mirror of https://github.com/gohugoio/hugo
132 lines
3.2 KiB
CSS
132 lines
3.2 KiB
CSS
@import "tailwindcss";
|
|
@plugin "@tailwindcss/typography";
|
|
@variant dark (&:where(.dark, .dark *));
|
|
|
|
@import "components/all.css";
|
|
|
|
/* TailwindCSS ignores files in .gitignore, so make it explicit. */
|
|
@source "hugo_stats.json";
|
|
|
|
@theme {
|
|
/* Breakpoints. */
|
|
--breakpoint-sm: 40rem;
|
|
--breakpoint-md: 48rem;
|
|
--breakpoint-lg: 68rem; /* Default 64rem; */
|
|
--breakpoint-xl: 80rem;
|
|
--breakpoint-2xl: 96rem;
|
|
|
|
/* Colors. */
|
|
--color-primary: var(--color-blue-600);
|
|
--color-dark: #000;
|
|
--color-light: var(--color-gray-50);
|
|
--color-accent: var(--color-orange-500);
|
|
--color-accent-light: var(--color-pink-500);
|
|
--color-accent-dark: var(--color-green-500);
|
|
|
|
/* https://www.tints.dev/blue/0594CB */
|
|
--color-blue-50: #e1f6fe;
|
|
--color-blue-100: #c3edfe;
|
|
--color-blue-200: #88dbfc;
|
|
--color-blue-300: #4cc9fb;
|
|
--color-blue-400: #15b9f9;
|
|
--color-blue-500: #0594cb;
|
|
--color-blue-600: #0477a4;
|
|
--color-blue-700: #035677;
|
|
--color-blue-800: #023a50;
|
|
--color-blue-900: #011d28;
|
|
--color-blue-950: #000e14;
|
|
|
|
/* https://www.tints.dev/orange/EBB951 */
|
|
--color-orange-50: #fdf8ed;
|
|
--color-orange-100: #fbf1da;
|
|
--color-orange-200: #f7e4ba;
|
|
--color-orange-300: #f3d596;
|
|
--color-orange-400: #efc976;
|
|
--color-orange-500: #ebb951;
|
|
--color-orange-600: #e5a51a;
|
|
--color-orange-700: #a97a13;
|
|
--color-orange-800: #72520d;
|
|
--color-orange-900: #372806;
|
|
--color-orange-950: #1b1403;
|
|
|
|
/* https://www.tints.dev/pink/FF4088 */
|
|
--color-pink-50: #ffebf2;
|
|
--color-pink-100: #ffdbe9;
|
|
--color-pink-200: #ffb3d0;
|
|
--color-pink-300: #ff8fba;
|
|
--color-pink-400: #ff66a1;
|
|
--color-pink-500: #ff4088;
|
|
--color-pink-600: #ff0062;
|
|
--color-pink-700: #c2004a;
|
|
--color-pink-800: #800031;
|
|
--color-pink-900: #420019;
|
|
--color-pink-950: #1f000c;
|
|
|
|
/* https://www.tints.dev/green/33BA91 */
|
|
--color-green-50: #ebfaf5;
|
|
--color-green-100: #d3f3e9;
|
|
--color-green-200: #abe8d6;
|
|
--color-green-300: #7fdcc0;
|
|
--color-green-400: #53d0aa;
|
|
--color-green-500: #33ba91;
|
|
--color-green-600: #299474;
|
|
--color-green-700: #1f7058;
|
|
--color-green-800: #154c3b;
|
|
--color-green-900: #0a241c;
|
|
--color-green-950: #051410;
|
|
|
|
/* Fonts. */
|
|
--font-sans:
|
|
"Mulish", ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
|
|
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
|
}
|
|
|
|
html {
|
|
scroll-padding-top: 100px;
|
|
}
|
|
|
|
body {
|
|
@apply antialiased font-sans text-black dark:text-gray-100;
|
|
}
|
|
|
|
.p-safe-area-x {
|
|
padding-left: env(safe-area-inset-left);
|
|
padding-right: env(safe-area-inset-right);
|
|
}
|
|
|
|
.p-safe-area-y {
|
|
padding-top: env(safe-area-inset-top);
|
|
padding-bottom: env(safe-area-inset-bottom);
|
|
}
|
|
|
|
.px-main {
|
|
padding-left: max(env(safe-area-inset-left), 1rem);
|
|
padding-right: max(env(safe-area-inset-right), 1rem);
|
|
}
|
|
|
|
@media screen(md) {
|
|
.px-main {
|
|
padding-left: max(env(safe-area-inset-left), 2rem);
|
|
padding-right: max(env(safe-area-inset-right), 2rem);
|
|
}
|
|
}
|
|
|
|
@media screen(lg) {
|
|
.px-main {
|
|
padding-left: max(env(safe-area-inset-left), 3rem);
|
|
padding-right: max(env(safe-area-inset-right), 3rem);
|
|
}
|
|
}
|
|
|
|
/* Algolia DocSearch */
|
|
.algolia-docsearch-suggestion--highlight {
|
|
color: var(--color-primary);
|
|
}
|
|
|
|
/* Footnotes */
|
|
.footnote-backref,
|
|
.footnote-ref {
|
|
text-decoration: none;
|
|
padding-left: .0625em;
|
|
}
|