style(webui): clarify surface hierarchy (#5029)
This commit is contained in:
+19
-24
@@ -22,47 +22,47 @@
|
||||
--accent-foreground: 0 0% 9%;
|
||||
--destructive: 0 84.2% 60.2%;
|
||||
--destructive-foreground: 0 0% 98%;
|
||||
--border: 0 0% 89.8%;
|
||||
--input: 0 0% 89.8%;
|
||||
--border: 40 8% 90.5%;
|
||||
--input: 40 8% 90.5%;
|
||||
--ring: 0 0% 3.9%;
|
||||
--inline-token-highlight: 221 70% 50%;
|
||||
--radius: 0.4375rem;
|
||||
--sidebar: 0 0% 98.5%;
|
||||
--sidebar: 40 8% 96.8%;
|
||||
--sidebar-foreground: 0 0% 3.9%;
|
||||
--sidebar-accent: 0 0% 95.8%;
|
||||
--sidebar-accent-foreground: 0 0% 9%;
|
||||
--sidebar-border: 0 0% 89.8%;
|
||||
--sidebar-border: 40 8% 90.5%;
|
||||
--scrollbar-thumb: hsl(var(--muted-foreground) / 0.26);
|
||||
--scrollbar-thumb-hover: hsl(var(--muted-foreground) / 0.42);
|
||||
}
|
||||
|
||||
.dark {
|
||||
color-scheme: dark;
|
||||
--background: 0 0% 10%;
|
||||
--background: 0 0% 12%;
|
||||
--foreground: 240 4% 96%;
|
||||
--card: 0 0% 12%;
|
||||
--card: 0 0% 14%;
|
||||
--card-foreground: 240 4% 96%;
|
||||
--popover: 0 0% 12%;
|
||||
--popover: 0 0% 14%;
|
||||
--popover-foreground: 240 4% 96%;
|
||||
--primary: 240 5% 98%;
|
||||
--primary-foreground: 0 0% 9%;
|
||||
--secondary: 0 0% 12%;
|
||||
--secondary: 0 0% 14%;
|
||||
--secondary-foreground: 0 0% 98%;
|
||||
--muted: 0 0% 13%;
|
||||
--muted-foreground: 0 0% 60%;
|
||||
--accent: 0 0% 15%;
|
||||
--muted: 0 0% 16%;
|
||||
--muted-foreground: 0 0% 65%;
|
||||
--accent: 0 0% 18%;
|
||||
--accent-foreground: 0 0% 98%;
|
||||
--destructive: 0 62.8% 30.6%;
|
||||
--destructive-foreground: 0 0% 98%;
|
||||
--border: 0 0% 18%;
|
||||
--input: 0 0% 18%;
|
||||
--border: 0 0% 22%;
|
||||
--input: 0 0% 22%;
|
||||
--ring: 0 0% 83.1%;
|
||||
--inline-token-highlight: 217 92% 72%;
|
||||
--sidebar: 0 0% 11.5%;
|
||||
--sidebar: 0 0% 10.5%;
|
||||
--sidebar-foreground: 0 0% 98%;
|
||||
--sidebar-accent: 0 0% 15.5%;
|
||||
--sidebar-accent: 0 0% 15%;
|
||||
--sidebar-accent-foreground: 0 0% 98%;
|
||||
--sidebar-border: 0 0% 18%;
|
||||
--sidebar-border: 0 0% 20%;
|
||||
--scrollbar-thumb: hsl(var(--muted-foreground) / 0.28);
|
||||
--scrollbar-thumb-hover: hsl(var(--muted-foreground) / 0.44);
|
||||
}
|
||||
@@ -81,6 +81,7 @@
|
||||
|
||||
body {
|
||||
@apply bg-background text-foreground font-sans antialiased;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
* {
|
||||
@@ -159,10 +160,7 @@
|
||||
background: hsl(var(--sidebar) / 0.94);
|
||||
-webkit-backdrop-filter: saturate(145%) blur(18px);
|
||||
backdrop-filter: saturate(145%) blur(18px);
|
||||
box-shadow:
|
||||
inset -1px 0 0 hsl(var(--border) / 0.32),
|
||||
inset 1px 0 0 hsl(var(--background) / 0.52),
|
||||
14px 0 32px -30px rgb(0 0 0 / 0.22);
|
||||
box-shadow: 14px 0 32px -30px rgb(0 0 0 / 0.12);
|
||||
}
|
||||
|
||||
.dark .host-window-shell,
|
||||
@@ -174,10 +172,7 @@
|
||||
|
||||
.dark .host-sidebar-glass {
|
||||
background: hsl(var(--sidebar) / 0.96);
|
||||
box-shadow:
|
||||
inset -1px 0 0 hsl(var(--border) / 0.42),
|
||||
inset 1px 0 0 hsl(var(--foreground) / 0.05),
|
||||
14px 0 34px -30px rgb(0 0 0 / 0.62);
|
||||
box-shadow: 14px 0 34px -30px rgb(0 0 0 / 0.34);
|
||||
}
|
||||
|
||||
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
|
||||
|
||||
Reference in New Issue
Block a user