@chronoter/main 0.1.10 → 0.2.0

package/dist/server/client/main.css

@@ -103,6 +103,8 @@
     --color-sidebar-accent-foreground: oklch(0.205 0 0);
     --color-sidebar-border: oklch(0.922 0 0);
     --color-sidebar-ring: oklch(0.708 0 0);
+    --color-sidebar-active: oklch(0.95 0.02 264);
+    --color-sidebar-active-foreground: oklch(58.42% 0.2274 263.02);
   }
 }
 @layer base {
@@ -378,6 +380,9 @@
   .top-4 {
     top: calc(var(--spacing) * 4);
   }
+  .top-20 {
+    top: calc(var(--spacing) * 20);
+  }
   .top-\[1px\] {
     top: 1px;
   }
@@ -979,6 +984,9 @@
   .block {
     display: block;
   }
+  .contents {
+    display: contents;
+  }
   .flex {
     display: flex;
   }
@@ -1142,6 +1150,9 @@
   .max-h-\[300px\] {
     max-height: 300px;
   }
+  .max-h-\[calc\(100vh-5rem\)\] {
+    max-height: calc(100vh - 5rem);
+  }
   .min-h-0 {
     min-height: calc(var(--spacing) * 0);
   }
@@ -1199,8 +1210,17 @@
   .w-16 {
     width: calc(var(--spacing) * 16);
   }
-  .w-56 {
-    width: calc(var(--spacing) * 56);
+  .w-24 {
+    width: calc(var(--spacing) * 24);
+  }
+  .w-32 {
+    width: calc(var(--spacing) * 32);
+  }
+  .w-40 {
+    width: calc(var(--spacing) * 40);
+  }
+  .w-48 {
+    width: calc(var(--spacing) * 48);
   }
   .w-64 {
     width: calc(var(--spacing) * 64);
@@ -1492,9 +1512,19 @@
   .gap-7 {
     gap: calc(var(--spacing) * 7);
   }
+  .gap-8 {
+    gap: calc(var(--spacing) * 8);
+  }
   .gap-\[--spacing\(var\(--gap\)\)\] {
     gap: calc(var(--spacing) * var(--gap));
   }
+  .space-y-1 {
+    :where(& > :not(:last-child)) {
+      --tw-space-y-reverse: 0;
+      margin-block-start: calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));
+      margin-block-end: calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)));
+    }
+  }
   .space-y-2 {
     :where(& > :not(:last-child)) {
       --tw-space-y-reverse: 0;
@@ -1502,6 +1532,13 @@
       margin-block-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)));
     }
   }
+  .space-y-3 {
+    :where(& > :not(:last-child)) {
+      --tw-space-y-reverse: 0;
+      margin-block-start: calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));
+      margin-block-end: calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)));
+    }
+  }
   .gap-y-0\.5 {
     row-gap: calc(var(--spacing) * 0.5);
   }
@@ -1609,6 +1646,10 @@
     border-left-style: var(--tw-border-style);
     border-left-width: 1px;
   }
+  .border-l-2 {
+    border-left-style: var(--tw-border-style);
+    border-left-width: 2px;
+  }
   .border-dashed {
     --tw-border-style: dashed;
     border-style: dashed;
@@ -1829,6 +1870,9 @@
   .pl-4 {
     padding-left: calc(var(--spacing) * 4);
   }
+  .pl-7 {
+    padding-left: calc(var(--spacing) * 7);
+  }
   .pl-8 {
     padding-left: calc(var(--spacing) * 8);
   }
@@ -1841,6 +1885,9 @@
   .align-middle {
     vertical-align: middle;
   }
+  .font-mono {
+    font-family: var(--font-mono);
+  }
   .font-sans {
     font-family: var(--font-sans);
   }
@@ -2792,6 +2839,16 @@
       border-bottom-width: 0px;
     }
   }
+  .hover\:border-muted-foreground\/40 {
+    &:hover {
+      @media (hover: hover) {
+        border-color: color-mix(in srgb, oklch(56.41% 0.0194 285.88) 40%, transparent);
+        @supports (color: color-mix(in lab, red, red)) {
+          border-color: color-mix(in oklab, var(--color-muted-foreground) 40%, transparent);
+        }
+      }
+    }
+  }
   .hover\:bg-accent {
     &:hover {
       @media (hover: hover) {
@@ -3400,9 +3457,9 @@
       }
     }
   }
-  .data-\[active\=true\]\:bg-sidebar-accent {
+  .data-\[active\=true\]\:bg-sidebar-active {
     &[data-active=true] {
-      background-color: var(--color-sidebar-accent);
+      background-color: var(--color-sidebar-active);
     }
   }
   .data-\[active\=true\]\:font-medium {
@@ -3416,9 +3473,9 @@
       color: var(--color-accent-foreground);
     }
   }
-  .data-\[active\=true\]\:text-sidebar-accent-foreground {
+  .data-\[active\=true\]\:text-sidebar-active-foreground {
     &[data-active=true] {
-      color: var(--color-sidebar-accent-foreground);
+      color: var(--color-sidebar-active-foreground);
     }
   }
   .data-\[active\=true\]\:hover\:bg-accent {
@@ -4212,6 +4269,11 @@
       top: calc(var(--spacing) * 16);
     }
   }
+  .md\:top-\[5\.5rem\] {
+    @media (width >= 48rem) {
+      top: 5.5rem;
+    }
+  }
   .md\:block {
     @media (width >= 48rem) {
       display: block;
@@ -4232,6 +4294,11 @@
       height: calc(100svh - 4rem);
     }
   }
+  .md\:max-h-\[calc\(100vh-5\.5rem\)\] {
+    @media (width >= 48rem) {
+      max-height: calc(100vh - 5.5rem);
+    }
+  }
   .md\:w-\[var\(--radix-navigation-menu-viewport-width\)\] {
     @media (width >= 48rem) {
       width: var(--radix-navigation-menu-viewport-width);
@@ -4334,11 +4401,26 @@
       }
     }
   }
+  .lg\:top-24 {
+    @media (width >= 64rem) {
+      top: calc(var(--spacing) * 24);
+    }
+  }
+  .lg\:max-h-\[calc\(100vh-6rem\)\] {
+    @media (width >= 64rem) {
+      max-height: calc(100vh - 6rem);
+    }
+  }
   .lg\:p-8 {
     @media (width >= 64rem) {
       padding: calc(var(--spacing) * 8);
     }
   }
+  .xl\:block {
+    @media (width >= 80rem) {
+      display: block;
+    }
+  }
   .\@md\/field-group\:flex-row {
     @container field-group (width >= 28rem) {
       flex-direction: row;
@@ -5270,14 +5352,130 @@
     --color-sidebar-accent-foreground: oklch(0.985 0 0);
     --color-sidebar-border: oklch(1 0 0 / 10%);
     --color-sidebar-ring: oklch(0.439 0 0);
+    --color-sidebar-active: oklch(0.30 0.05 264);
+    --color-sidebar-active-foreground: oklch(67.17% 0.2174 263.71);
+  }
+}
+@layer base {
+  * {
+    border-color: var(--color-border);
+  }
+  body {
+    background-color: var(--color-background);
+    color: var(--color-foreground);
   }
 }
-* {
-  border-color: var(--color-border);
+.theme-blue {
+  --color-primary: oklch(58.42% 0.2274 263.02);
+  --color-primary-foreground: oklch(98.04% 0.0058 264.53);
+  --color-ring: oklch(58.42% 0.2274 263.02);
+  --color-sidebar-active: oklch(0.95 0.02 264);
+  --color-sidebar-active-foreground: oklch(58.42% 0.2274 263.02);
+}
+.theme-blue:where(.dark, .dark *) {
+  --color-primary: oklch(67.17% 0.2174 263.71);
+  --color-primary-foreground: oklch(20.09% 0.0211 285.88);
+  --color-ring: oklch(54.89% 0.2068 263.71);
+  --color-sidebar-active: oklch(0.30 0.05 264);
+  --color-sidebar-active-foreground: oklch(67.17% 0.2174 263.71);
+}
+.theme-violet {
+  --color-primary: oklch(58.42% 0.22 285);
+  --color-primary-foreground: oklch(98.04% 0.0058 285);
+  --color-ring: oklch(58.42% 0.22 285);
+  --color-sidebar-active: oklch(0.95 0.02 285);
+  --color-sidebar-active-foreground: oklch(58.42% 0.22 285);
+}
+.theme-violet:where(.dark, .dark *) {
+  --color-primary: oklch(67.17% 0.20 285);
+  --color-primary-foreground: oklch(20.09% 0.02 285);
+  --color-ring: oklch(54.89% 0.19 285);
+  --color-sidebar-active: oklch(0.30 0.05 285);
+  --color-sidebar-active-foreground: oklch(67.17% 0.20 285);
+}
+.theme-slate {
+  --color-primary: oklch(45% 0.03 250);
+  --color-primary-foreground: oklch(98% 0.005 250);
+  --color-ring: oklch(45% 0.03 250);
+  --color-sidebar-active: oklch(0.95 0.01 250);
+  --color-sidebar-active-foreground: oklch(45% 0.03 250);
+}
+.theme-slate:where(.dark, .dark *) {
+  --color-primary: oklch(70% 0.03 250);
+  --color-primary-foreground: oklch(20% 0.02 250);
+  --color-ring: oklch(55% 0.03 250);
+  --color-sidebar-active: oklch(0.30 0.02 250);
+  --color-sidebar-active-foreground: oklch(70% 0.03 250);
+}
+.theme-green {
+  --color-primary: oklch(60% 0.18 150);
+  --color-primary-foreground: oklch(98% 0.01 150);
+  --color-ring: oklch(60% 0.18 150);
+  --color-sidebar-active: oklch(0.95 0.03 150);
+  --color-sidebar-active-foreground: oklch(60% 0.18 150);
+}
+.theme-green:where(.dark, .dark *) {
+  --color-primary: oklch(70% 0.17 150);
+  --color-primary-foreground: oklch(20% 0.02 150);
+  --color-ring: oklch(55% 0.16 150);
+  --color-sidebar-active: oklch(0.30 0.05 150);
+  --color-sidebar-active-foreground: oklch(70% 0.17 150);
+}
+.theme-orange {
+  --color-primary: oklch(65% 0.18 50);
+  --color-primary-foreground: oklch(98% 0.01 50);
+  --color-ring: oklch(65% 0.18 50);
+  --color-sidebar-active: oklch(0.95 0.03 50);
+  --color-sidebar-active-foreground: oklch(65% 0.18 50);
+}
+.theme-orange:where(.dark, .dark *) {
+  --color-primary: oklch(72% 0.17 50);
+  --color-primary-foreground: oklch(20% 0.02 50);
+  --color-ring: oklch(58% 0.16 50);
+  --color-sidebar-active: oklch(0.30 0.05 50);
+  --color-sidebar-active-foreground: oklch(72% 0.17 50);
+}
+.theme-red {
+  --color-primary: oklch(60% 0.22 25);
+  --color-primary-foreground: oklch(98% 0.01 25);
+  --color-ring: oklch(60% 0.22 25);
+  --color-sidebar-active: oklch(0.95 0.03 25);
+  --color-sidebar-active-foreground: oklch(60% 0.22 25);
+}
+.theme-red:where(.dark, .dark *) {
+  --color-primary: oklch(68% 0.20 25);
+  --color-primary-foreground: oklch(20% 0.02 25);
+  --color-ring: oklch(55% 0.19 25);
+  --color-sidebar-active: oklch(0.30 0.05 25);
+  --color-sidebar-active-foreground: oklch(68% 0.20 25);
+}
+.theme-rose {
+  --color-primary: oklch(60% 0.20 350);
+  --color-primary-foreground: oklch(98% 0.01 350);
+  --color-ring: oklch(60% 0.20 350);
+  --color-sidebar-active: oklch(0.95 0.03 350);
+  --color-sidebar-active-foreground: oklch(60% 0.20 350);
+}
+.theme-rose:where(.dark, .dark *) {
+  --color-primary: oklch(68% 0.18 350);
+  --color-primary-foreground: oklch(20% 0.02 350);
+  --color-ring: oklch(55% 0.17 350);
+  --color-sidebar-active: oklch(0.30 0.05 350);
+  --color-sidebar-active-foreground: oklch(68% 0.18 350);
+}
+.theme-zinc {
+  --color-primary: oklch(50% 0 0);
+  --color-primary-foreground: oklch(98% 0 0);
+  --color-ring: oklch(50% 0 0);
+  --color-sidebar-active: oklch(0.95 0 0);
+  --color-sidebar-active-foreground: oklch(50% 0 0);
 }
-body {
-  background-color: var(--color-background);
-  color: var(--color-foreground);
+.theme-zinc:where(.dark, .dark *) {
+  --color-primary: oklch(70% 0 0);
+  --color-primary-foreground: oklch(20% 0 0);
+  --color-ring: oklch(55% 0 0);
+  --color-sidebar-active: oklch(0.30 0 0);
+  --color-sidebar-active-foreground: oklch(70% 0 0);
 }
 @property --tw-translate-x { syntax: "*"; inherits: false; initial-value: 0; }
 @property --tw-translate-y { syntax: "*"; inherits: false; initial-value: 0; }