From a3638e2663110688d71a4cc784ece70c5b7e8b8c Mon Sep 17 00:00:00 2001 From: "Irsyad A. Panjaitan" Date: Sat, 12 Oct 2024 23:34:51 +0700 Subject: [PATCH] lfg --- src/resources/themes/sky.css | 122 +++++++++++++++++++++++++++++++++++ 1 file changed, 122 insertions(+) create mode 100644 src/resources/themes/sky.css diff --git a/src/resources/themes/sky.css b/src/resources/themes/sky.css new file mode 100644 index 0000000..32638d3 --- /dev/null +++ b/src/resources/themes/sky.css @@ -0,0 +1,122 @@ +@tailwind base; +@tailwind components; +@tailwind utilities; + +@layer base { + :root { + --light: 0 0% 100%; + --dark: 228.65 84% 5%; + --bg: 0 0% 100%; + --fg: 222.2 84% 4.9%; + --primary: 200.41 98.01% 40.41%; + --primary-fg: 204 100% 97.06%; + --secondary: 240 4% 96%; + --secondary-fg: 240.01 6% 10%; + --tertiary: 0 0% 100%; + --tertiary-fg: 240 4% 16%; + --accent: 214.29 33% 91%; + --accent-fg: 228.65 84% 5%; + --accent-subtle: 204 93.75% 93.73%; + --accent-subtle-fg: 200.95 90% 27.45%; + --overlay: 210 35% 98%; + --overlay-fg: 228.65 84% 5%; + --muted: 212.73 40% 89%; + --muted-fg: 215.39 17% 46%; + --success: 161.17 91% 31%; + --success-fg: 151.77 82% 96%; + --info: 205.77 100% 50%; + --info-fg: 40 35% 98%; + --danger: 0.01 72% 51%; + --danger-fg: 360 86% 97%; + --warning: 43.2 96% 56.99%; + --warning-fg: 20.91 91% 14.1%; + --border: 214.29 33% 91%; + --input: 214.29 33% 91%; + --ring: 198.63 88.66% 48.43%; + --toggle: 212.72 27% 84%; + --radius: 0.5rem; + --primary-chart: 198.63 88.66% 48.43%; + --secondary-chart: 199.37 95.49% 73.92%; + --tertiary-chart: 200.6 94.37% 86.08%; + --highlight-chart: 198.44 93.2% 59.61%; + --accent-chart: 204 93.75% 93.73% + } + + .dark { + --bg: 222.2 84% 4.9%; + --fg: 210 40% 98%; + --primary: 200.41 98.01% 40.41%; + --primary-fg: 204 100% 97.06%; + --secondary: 222.23 48% 11%; + --secondary-fg: 210 35% 98%; + --tertiary: 230.03 88% 4%; + --tertiary-fg: 210 35% 98%; + --accent: 200.41 98.01% 40.41%; + --accent-fg: 204 100% 97.06%; + --accent-subtle: 205.14 100% 9%; + --accent-subtle-fg: 204 93.75% 93.73%; + --overlay: 230.03 88% 4%; + --overlay-fg: 210 35% 98%; + --muted: 217.3 40% 14.1%; + --muted-fg: 215 20% 65%; + --info: 205.77 100% 50%; + --info-fg: 40 35% 98%; + --success: 161.17 91% 31%; + --success-fg: 151.77 82% 96%; + --toggle: 215.29 33% 19%; + --border: 217.32 43% 13%; + --input: 217.24 33% 17%; + --ring: 198.63 88.66% 42.43%; + --primary-chart: 200.41 98.01% 39.41%; + --secondary-chart: 199.37 95.49% 73.92%; + --tertiary-chart: 200.6 94.37% 86.08%; + --highlight-chart: 198.44 93.2% 59.61%; + --accent-chart: 204 93.75% 93.73% + } +} + +@layer base { + html { + @apply scroll-smooth; + } + + * { + @apply border-border; + font-feature-settings: 'cv11', 'ss01'; + font-variation-settings: 'opsz' 850; + text-rendering: optimizeLegibility; + scrollbar-width: thin; + } + + body { + @apply bg-bg text-fg; + } + + /* dark mode */ + .dark { + scrollbar-width: thin; + + @media (prefers-color-scheme: dark) { + * { + scrollbar-width: thin; + } + } + } + + /* Chrome, Edge, and Safari */ + *::-webkit-scrollbar { + width: 8px; + height: 8px; + } + + *::-webkit-scrollbar-track { + background: transparent; + border-radius: 5px; + } + + *::-webkit-scrollbar-thumb { + @apply bg-muted; + border-radius: 14px; + border: 3px solid transparent; + } +}