Selaa lähdekoodia

feat: border, shadow improvements dialog

Aaron Iker 3 kuukautta sitten
vanhempi
sitoutus
85dd5e1a40
2 muutettua tiedostoa jossa 7 lisäystä ja 3 poistoa
  1. 5 1
      packages/ui/src/components/dialog.css
  2. 2 2
      packages/ui/src/styles/theme.css

+ 5 - 1
packages/ui/src/components/dialog.css

@@ -43,7 +43,11 @@
 
       /* padding: 8px; */
       /* padding: 8px 8px 0 8px; */
-      border: 1px solid color-mix(in oklch, var(--border-base) 50%, transparent);
+      border: 1px solid
+        light-dark(
+          color-mix(in oklch, var(--border-base) 30%, transparent),
+          color-mix(in oklch, var(--border-base) 50%, transparent)
+        );
       border-radius: var(--radius-xl);
       background: var(--surface-raised-stronger-non-alpha);
       background-clip: padding-box;

+ 2 - 2
packages/ui/src/styles/theme.css

@@ -55,8 +55,8 @@
     0 4px 8px -2px light-dark(hsl(0 0% 0% / 0.075), hsl(0 0% 0% / 0.15)),
     0 1px 2px light-dark(hsl(0 0% 0% / 0.1), hsl(0 0% 0% / 0.15));
   --shadow-lg:
-    0 16px 48px -6px light-dark(hsl(0 0% 0% / 0.075), hsl(0 0% 0% / 0.15)),
-    0 6px 12px -2px light-dark(hsl(0 0% 0% / 0.05), hsl(0 0% 0% / 0.1)),
+    0 16px 48px -6px light-dark(hsl(0 0% 0% / 0.05), hsl(0 0% 0% / 0.15)),
+    0 6px 12px -2px light-dark(hsl(0 0% 0% / 0.025), hsl(0 0% 0% / 0.1)),
     0 1px 2.5px light-dark(hsl(0 0% 0% / 0.025), hsl(0 0% 0% / 0.1));
   --shadow-xs-border:
     0 0 0 1px var(--border-base, rgba(11, 6, 0, 0.2)), 0 1px 2px -1px rgba(19, 16, 16, 0.04),