|
@@ -1,6 +1,7 @@
|
|
|
@tailwind base;
|
|
|
@tailwind components;
|
|
|
@tailwind utilities;
|
|
|
+
|
|
|
:root {
|
|
|
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
|
|
|
line-height: 1.5;
|
|
@@ -12,6 +13,63 @@
|
|
|
|
|
|
font-synthesis: none;
|
|
|
text-rendering: optimizeLegibility;
|
|
|
+ --vt-c-white: #ffffff;
|
|
|
+ --vt-c-white-soft: #f8f8f8;
|
|
|
+ --vt-c-white-mute: #f2f2f2;
|
|
|
+
|
|
|
+ --vt-c-black: #181818;
|
|
|
+ --vt-c-black-soft: #222222;
|
|
|
+ --vt-c-black-mute: #282828;
|
|
|
+
|
|
|
+ --vt-c-indigo: #2c3e50;
|
|
|
+
|
|
|
+ --vt-c-divider-light-1: rgba(60, 60, 60, 0.29);
|
|
|
+ --vt-c-divider-light-2: rgba(60, 60, 60, 0.12);
|
|
|
+ --vt-c-divider-dark-1: rgba(84, 84, 84, 0.65);
|
|
|
+ --vt-c-divider-dark-2: rgba(84, 84, 84, 0.48);
|
|
|
+
|
|
|
+ --vt-c-text-light-1: var(--vt-c-indigo);
|
|
|
+ --vt-c-text-light-2: rgba(60, 60, 60, 0.66);
|
|
|
+ --vt-c-text-light-3: #56a7fb;
|
|
|
+ --vt-c-text-light-title: #000000;
|
|
|
+ --vt-c-text-dark-1: var(--vt-c-white);
|
|
|
+ --vt-c-text-dark-2: rgba(235, 235, 235, 0.64);
|
|
|
+ --vt-c-text-dark-3: #56a7fb;
|
|
|
+ --vt-c-text-light-title: #fffff;
|
|
|
+ --vt-c-text-red: #e74c3c;
|
|
|
+}
|
|
|
+
|
|
|
+:root {
|
|
|
+ --color-background: var(--vt-c-white);
|
|
|
+ --color-background-soft: var(--vt-c-white-soft);
|
|
|
+ --color-background-mute: var(--vt-c-white-mute);
|
|
|
+
|
|
|
+ --color-border: var(--vt-c-divider-light-2);
|
|
|
+ --color-border-hover: var(--vt-c-divider-light-1);
|
|
|
+
|
|
|
+ --color-heading: var(--vt-c-text-light-1);
|
|
|
+ --color-text: var(--vt-c-text-light-1);
|
|
|
+ --color-text-title: var(--vt-c-text-light-title);
|
|
|
+ --color-text-show: var(--vt-c-text-light-3);
|
|
|
+ --color-text-money: var(--vt-c-text-red);
|
|
|
+ --section-gap: 160px;
|
|
|
+}
|
|
|
+
|
|
|
+@media (prefers-color-scheme: dark) {
|
|
|
+ :root {
|
|
|
+ --color-background: var(--vt-c-black);
|
|
|
+ --color-background-soft: var(--vt-c-black-soft);
|
|
|
+ --color-background-mute: var(--vt-c-black-mute);
|
|
|
+
|
|
|
+ --color-border: var(--vt-c-divider-dark-2);
|
|
|
+ --color-border-hover: var(--vt-c-divider-dark-1);
|
|
|
+
|
|
|
+ --color-heading: var(--vt-c-text-dark-1);
|
|
|
+ /*--color-text-title: var(--vt-c-text-dark-title);*/
|
|
|
+ --color-text: var(--vt-c-text-dark-2);
|
|
|
+ --color-text-show: var(--vt-c-text-dark-3);
|
|
|
+ --color-text-money: var(--vt-c-text-red);
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
*{
|