@shival99/z-ui 1.2.17 → 1.2.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,73 +1,75 @@
1
1
  /* GRAY THEME */
2
- :root[z-theme='gray'] {
3
- --radius: 0.625rem;
4
- --background: oklch(1 0 0);
5
- --foreground: oklch(0.13 0.028 261.692);
6
- --card: oklch(1 0 0);
7
- --card-foreground: oklch(0.13 0.028 261.692);
8
- --popover: oklch(1 0 0);
9
- --popover-foreground: oklch(0.13 0.028 261.692);
10
- --primary: oklch(0.21 0.034 264.665);
11
- --primary-foreground: oklch(0.985 0.002 247.839);
12
- --secondary: oklch(0.967 0.003 264.542);
13
- --secondary-foreground: oklch(0.21 0.034 264.665);
14
- --muted: oklch(0.967 0.003 264.542);
15
- --muted-foreground: oklch(0.551 0.027 264.364);
16
- --accent: oklch(0.967 0.003 264.542);
17
- --accent-foreground: oklch(0.21 0.034 264.665);
18
- --destructive: oklch(0.577 0.245 27.325);
19
- --destructive-foreground: oklch(0.985 0 0);
20
- --border: oklch(0.928 0.006 264.531);
21
- --input: oklch(0.928 0.006 264.531);
22
- --input-autofill: oklch(1 0 0);
23
- --ring: oklch(0.707 0.022 261.325);
24
- --chart-1: oklch(0.646 0.222 41.116);
25
- --chart-2: oklch(0.6 0.118 184.704);
26
- --chart-3: oklch(0.398 0.07 227.334);
27
- --chart-4: oklch(0.828 0.189 84.429);
28
- --chart-5: oklch(0.769 0.188 70.08);
29
- --sidebar: oklch(0.985 0.002 247.839);
30
- --sidebar-foreground: oklch(0.13 0.028 261.692);
31
- --sidebar-primary: oklch(0.21 0.034 264.665);
32
- --sidebar-primary-foreground: oklch(0.985 0.002 247.839);
33
- --sidebar-accent: oklch(0.967 0.003 264.542);
34
- --sidebar-accent-foreground: oklch(0.21 0.034 264.665);
35
- --sidebar-border: oklch(0.928 0.006 264.531);
36
- --sidebar-ring: oklch(0.707 0.022 261.325);
37
- }
2
+ @layer z-theme {
3
+ :root[z-theme='gray'] {
4
+ --radius: 0.625rem;
5
+ --background: oklch(1 0 0);
6
+ --foreground: oklch(0.13 0.028 261.692);
7
+ --card: oklch(1 0 0);
8
+ --card-foreground: oklch(0.13 0.028 261.692);
9
+ --popover: oklch(1 0 0);
10
+ --popover-foreground: oklch(0.13 0.028 261.692);
11
+ --primary: oklch(0.21 0.034 264.665);
12
+ --primary-foreground: oklch(0.985 0.002 247.839);
13
+ --secondary: oklch(0.967 0.003 264.542);
14
+ --secondary-foreground: oklch(0.21 0.034 264.665);
15
+ --muted: oklch(0.967 0.003 264.542);
16
+ --muted-foreground: oklch(0.551 0.027 264.364);
17
+ --accent: oklch(0.967 0.003 264.542);
18
+ --accent-foreground: oklch(0.21 0.034 264.665);
19
+ --destructive: oklch(0.577 0.245 27.325);
20
+ --destructive-foreground: oklch(0.985 0 0);
21
+ --border: oklch(0.928 0.006 264.531);
22
+ --input: oklch(0.928 0.006 264.531);
23
+ --input-autofill: oklch(1 0 0);
24
+ --ring: oklch(0.707 0.022 261.325);
25
+ --chart-1: oklch(0.646 0.222 41.116);
26
+ --chart-2: oklch(0.6 0.118 184.704);
27
+ --chart-3: oklch(0.398 0.07 227.334);
28
+ --chart-4: oklch(0.828 0.189 84.429);
29
+ --chart-5: oklch(0.769 0.188 70.08);
30
+ --sidebar: oklch(0.985 0.002 247.839);
31
+ --sidebar-foreground: oklch(0.13 0.028 261.692);
32
+ --sidebar-primary: oklch(0.21 0.034 264.665);
33
+ --sidebar-primary-foreground: oklch(0.985 0.002 247.839);
34
+ --sidebar-accent: oklch(0.967 0.003 264.542);
35
+ --sidebar-accent-foreground: oklch(0.21 0.034 264.665);
36
+ --sidebar-border: oklch(0.928 0.006 264.531);
37
+ --sidebar-ring: oklch(0.707 0.022 261.325);
38
+ }
38
39
 
39
- :root[z-theme='gray'].dark {
40
- --background: oklch(0.13 0.028 261.692);
41
- --foreground: oklch(0.985 0.002 247.839);
42
- --card: oklch(0.21 0.034 264.665);
43
- --card-foreground: oklch(0.985 0.002 247.839);
44
- --popover: oklch(0.21 0.034 264.665);
45
- --popover-foreground: oklch(0.985 0.002 247.839);
46
- --primary: oklch(0.928 0.006 264.531);
47
- --primary-foreground: oklch(0.21 0.034 264.665);
48
- --secondary: oklch(0.278 0.033 256.848);
49
- --secondary-foreground: oklch(0.985 0.002 247.839);
50
- --muted: oklch(0.278 0.033 256.848);
51
- --muted-foreground: oklch(0.707 0.022 261.325);
52
- --accent: oklch(0.278 0.033 256.848);
53
- --accent-foreground: oklch(0.985 0.002 247.839);
54
- --destructive: oklch(0.704 0.191 22.216);
55
- --destructive-foreground: oklch(0.985 0 0);
56
- --border: oklch(1 0 0 / 10%);
57
- --input: oklch(1 0 0 / 15%);
58
- --input-autofill: oklch(0.19 0 0);
59
- --ring: oklch(0.551 0.027 264.364);
60
- --chart-1: oklch(0.488 0.243 264.376);
61
- --chart-2: oklch(0.696 0.17 162.48);
62
- --chart-3: oklch(0.769 0.188 70.08);
63
- --chart-4: oklch(0.627 0.265 303.9);
64
- --chart-5: oklch(0.645 0.246 16.439);
65
- --sidebar: oklch(0.21 0.034 264.665);
66
- --sidebar-foreground: oklch(0.985 0.002 247.839);
67
- --sidebar-primary: oklch(0.928 0.006 264.531);
68
- --sidebar-primary-foreground: oklch(0.21 0.034 264.665);
69
- --sidebar-accent: oklch(0.278 0.033 256.848);
70
- --sidebar-accent-foreground: oklch(0.985 0.002 247.839);
71
- --sidebar-border: oklch(1 0 0 / 10%);
72
- --sidebar-ring: oklch(0.551 0.027 264.364);
40
+ :root[z-theme='gray'].dark {
41
+ --background: oklch(0.13 0.028 261.692);
42
+ --foreground: oklch(0.985 0.002 247.839);
43
+ --card: oklch(0.21 0.034 264.665);
44
+ --card-foreground: oklch(0.985 0.002 247.839);
45
+ --popover: oklch(0.21 0.034 264.665);
46
+ --popover-foreground: oklch(0.985 0.002 247.839);
47
+ --primary: oklch(0.928 0.006 264.531);
48
+ --primary-foreground: oklch(0.21 0.034 264.665);
49
+ --secondary: oklch(0.278 0.033 256.848);
50
+ --secondary-foreground: oklch(0.985 0.002 247.839);
51
+ --muted: oklch(0.278 0.033 256.848);
52
+ --muted-foreground: oklch(0.707 0.022 261.325);
53
+ --accent: oklch(0.278 0.033 256.848);
54
+ --accent-foreground: oklch(0.985 0.002 247.839);
55
+ --destructive: oklch(0.704 0.191 22.216);
56
+ --destructive-foreground: oklch(0.985 0 0);
57
+ --border: oklch(1 0 0 / 10%);
58
+ --input: oklch(1 0 0 / 15%);
59
+ --input-autofill: oklch(0.19 0 0);
60
+ --ring: oklch(0.551 0.027 264.364);
61
+ --chart-1: oklch(0.488 0.243 264.376);
62
+ --chart-2: oklch(0.696 0.17 162.48);
63
+ --chart-3: oklch(0.769 0.188 70.08);
64
+ --chart-4: oklch(0.627 0.265 303.9);
65
+ --chart-5: oklch(0.645 0.246 16.439);
66
+ --sidebar: oklch(0.21 0.034 264.665);
67
+ --sidebar-foreground: oklch(0.985 0.002 247.839);
68
+ --sidebar-primary: oklch(0.928 0.006 264.531);
69
+ --sidebar-primary-foreground: oklch(0.21 0.034 264.665);
70
+ --sidebar-accent: oklch(0.278 0.033 256.848);
71
+ --sidebar-accent-foreground: oklch(0.985 0.002 247.839);
72
+ --sidebar-border: oklch(1 0 0 / 10%);
73
+ --sidebar-ring: oklch(0.551 0.027 264.364);
74
+ }
73
75
  }
@@ -1,75 +1,77 @@
1
1
  /* GREEN THEME (Default) */
2
- :root,
3
- :root[z-theme='green'] {
4
- --radius: 0.65rem;
5
- --background: oklch(1 0 0);
6
- --foreground: oklch(0.141 0.005 285.823);
7
- --card: oklch(1 0 0);
8
- --card-foreground: oklch(0.141 0.005 285.823);
9
- --popover: oklch(1 0 0);
10
- --popover-foreground: oklch(0.141 0.005 285.823);
11
- --primary: oklch(0.648 0.2 131.684);
12
- --primary-foreground: oklch(0.986 0.031 120.757);
13
- --secondary: oklch(0.967 0.001 286.375);
14
- --secondary-foreground: oklch(0.21 0.006 285.885);
15
- --muted: oklch(0.967 0.001 286.375);
16
- --muted-foreground: oklch(0.552 0.016 285.938);
17
- --accent: oklch(0.967 0.001 286.375);
18
- --accent-foreground: oklch(0.21 0.006 285.885);
19
- --destructive: oklch(0.577 0.245 27.325);
20
- --destructive-foreground: oklch(0.985 0 0);
21
- --border: oklch(0.92 0.004 286.32);
22
- --input: oklch(0.92 0.004 286.32);
23
- --input-autofill: oklch(1 0 0);
24
- --ring: oklch(0.841 0.238 128.85);
25
- --chart-1: oklch(0.871 0.15 154.449);
26
- --chart-2: oklch(0.723 0.219 149.579);
27
- --chart-3: oklch(0.627 0.194 149.214);
28
- --chart-4: oklch(0.527 0.154 150.069);
29
- --chart-5: oklch(0.448 0.119 151.328);
30
- --sidebar: oklch(0.985 0 0);
31
- --sidebar-foreground: oklch(0.141 0.005 285.823);
32
- --sidebar-primary: oklch(0.648 0.2 131.684);
33
- --sidebar-primary-foreground: oklch(0.986 0.031 120.757);
34
- --sidebar-accent: oklch(0.967 0.001 286.375);
35
- --sidebar-accent-foreground: oklch(0.21 0.006 285.885);
36
- --sidebar-border: oklch(0.92 0.004 286.32);
37
- --sidebar-ring: oklch(0.841 0.238 128.85);
38
- }
2
+ @layer z-theme {
3
+ :root,
4
+ :root[z-theme='green'] {
5
+ --radius: 0.65rem;
6
+ --background: oklch(1 0 0);
7
+ --foreground: oklch(0.141 0.005 285.823);
8
+ --card: oklch(1 0 0);
9
+ --card-foreground: oklch(0.141 0.005 285.823);
10
+ --popover: oklch(1 0 0);
11
+ --popover-foreground: oklch(0.141 0.005 285.823);
12
+ --primary: oklch(0.648 0.2 131.684);
13
+ --primary-foreground: oklch(0.986 0.031 120.757);
14
+ --secondary: oklch(0.967 0.001 286.375);
15
+ --secondary-foreground: oklch(0.21 0.006 285.885);
16
+ --muted: oklch(0.967 0.001 286.375);
17
+ --muted-foreground: oklch(0.552 0.016 285.938);
18
+ --accent: oklch(0.967 0.001 286.375);
19
+ --accent-foreground: oklch(0.21 0.006 285.885);
20
+ --destructive: oklch(0.577 0.245 27.325);
21
+ --destructive-foreground: oklch(0.985 0 0);
22
+ --border: oklch(0.92 0.004 286.32);
23
+ --input: oklch(0.92 0.004 286.32);
24
+ --input-autofill: oklch(1 0 0);
25
+ --ring: oklch(0.841 0.238 128.85);
26
+ --chart-1: oklch(0.871 0.15 154.449);
27
+ --chart-2: oklch(0.723 0.219 149.579);
28
+ --chart-3: oklch(0.627 0.194 149.214);
29
+ --chart-4: oklch(0.527 0.154 150.069);
30
+ --chart-5: oklch(0.448 0.119 151.328);
31
+ --sidebar: oklch(0.985 0 0);
32
+ --sidebar-foreground: oklch(0.141 0.005 285.823);
33
+ --sidebar-primary: oklch(0.648 0.2 131.684);
34
+ --sidebar-primary-foreground: oklch(0.986 0.031 120.757);
35
+ --sidebar-accent: oklch(0.967 0.001 286.375);
36
+ --sidebar-accent-foreground: oklch(0.21 0.006 285.885);
37
+ --sidebar-border: oklch(0.92 0.004 286.32);
38
+ --sidebar-ring: oklch(0.841 0.238 128.85);
39
+ }
39
40
 
40
- :root.dark,
41
- :root[z-theme='green'].dark {
42
- --background: oklch(0.141 0.005 285.823);
43
- --foreground: oklch(0.985 0 0);
44
- --card: oklch(0.21 0.006 285.885);
45
- --card-foreground: oklch(0.985 0 0);
46
- --popover: oklch(0.21 0.006 285.885);
47
- --popover-foreground: oklch(0.985 0 0);
48
- --primary: oklch(0.648 0.2 131.684);
49
- --primary-foreground: oklch(0.986 0.031 120.757);
50
- --secondary: oklch(0.274 0.006 286.033);
51
- --secondary-foreground: oklch(0.985 0 0);
52
- --muted: oklch(0.274 0.006 286.033);
53
- --muted-foreground: oklch(0.705 0.015 286.067);
54
- --accent: oklch(0.274 0.006 286.033);
55
- --accent-foreground: oklch(0.985 0 0);
56
- --destructive: oklch(0.704 0.191 22.216);
57
- --destructive-foreground: oklch(0.985 0 0);
58
- --border: oklch(1 0 0 / 10%);
59
- --input: oklch(1 0 0 / 15%);
60
- --input-autofill: oklch(0.19 0 0);
61
- --ring: oklch(0.405 0.101 131.063);
62
- --chart-1: oklch(0.871 0.15 154.449);
63
- --chart-2: oklch(0.723 0.219 149.579);
64
- --chart-3: oklch(0.627 0.194 149.214);
65
- --chart-4: oklch(0.527 0.154 150.069);
66
- --chart-5: oklch(0.448 0.119 151.328);
67
- --sidebar: oklch(0.21 0.006 285.885);
68
- --sidebar-foreground: oklch(0.985 0 0);
69
- --sidebar-primary: oklch(0.768 0.233 130.85);
70
- --sidebar-primary-foreground: oklch(0.986 0.031 120.757);
71
- --sidebar-accent: oklch(0.274 0.006 286.033);
72
- --sidebar-accent-foreground: oklch(0.985 0 0);
73
- --sidebar-border: oklch(1 0 0 / 10%);
74
- --sidebar-ring: oklch(0.405 0.101 131.063);
41
+ :root.dark,
42
+ :root[z-theme='green'].dark {
43
+ --background: oklch(0.141 0.005 285.823);
44
+ --foreground: oklch(0.985 0 0);
45
+ --card: oklch(0.21 0.006 285.885);
46
+ --card-foreground: oklch(0.985 0 0);
47
+ --popover: oklch(0.21 0.006 285.885);
48
+ --popover-foreground: oklch(0.985 0 0);
49
+ --primary: oklch(0.648 0.2 131.684);
50
+ --primary-foreground: oklch(0.986 0.031 120.757);
51
+ --secondary: oklch(0.274 0.006 286.033);
52
+ --secondary-foreground: oklch(0.985 0 0);
53
+ --muted: oklch(0.274 0.006 286.033);
54
+ --muted-foreground: oklch(0.705 0.015 286.067);
55
+ --accent: oklch(0.274 0.006 286.033);
56
+ --accent-foreground: oklch(0.985 0 0);
57
+ --destructive: oklch(0.704 0.191 22.216);
58
+ --destructive-foreground: oklch(0.985 0 0);
59
+ --border: oklch(1 0 0 / 10%);
60
+ --input: oklch(1 0 0 / 15%);
61
+ --input-autofill: oklch(0.19 0 0);
62
+ --ring: oklch(0.405 0.101 131.063);
63
+ --chart-1: oklch(0.871 0.15 154.449);
64
+ --chart-2: oklch(0.723 0.219 149.579);
65
+ --chart-3: oklch(0.627 0.194 149.214);
66
+ --chart-4: oklch(0.527 0.154 150.069);
67
+ --chart-5: oklch(0.448 0.119 151.328);
68
+ --sidebar: oklch(0.21 0.006 285.885);
69
+ --sidebar-foreground: oklch(0.985 0 0);
70
+ --sidebar-primary: oklch(0.768 0.233 130.85);
71
+ --sidebar-primary-foreground: oklch(0.986 0.031 120.757);
72
+ --sidebar-accent: oklch(0.274 0.006 286.033);
73
+ --sidebar-accent-foreground: oklch(0.985 0 0);
74
+ --sidebar-border: oklch(1 0 0 / 10%);
75
+ --sidebar-ring: oklch(0.405 0.101 131.063);
76
+ }
75
77
  }
@@ -1,79 +1,81 @@
1
1
  /* HOSPITAL THEME - Main color: #2e37a4 */
2
- :root[z-theme='hospital'] {
3
- --radius: 0.65rem;
4
- --background: oklch(1 0 0);
5
- --foreground: oklch(0.2 0.05 264);
6
- --card: oklch(1 0 0);
7
- --card-foreground: oklch(0.2 0.05 264);
8
- --popover: oklch(1 0 0);
9
- --popover-foreground: oklch(0.2 0.05 264);
10
- /* Primary: #2e37a4 converted to oklch */
11
- --primary: oklch(0.35 0.18 264);
12
- --primary-foreground: oklch(0.98 0 0);
13
- /* Secondary: lighter shade */
14
- --secondary: oklch(0.96 0.02 264);
15
- --secondary-foreground: oklch(0.25 0.08 264);
16
- --muted: oklch(0.967 0.003 264.542);
17
- --muted-foreground: oklch(0.551 0.027 264.364);
18
- --accent: oklch(0.96 0.02 264);
19
- --accent-foreground: oklch(0.25 0.08 264);
20
- --destructive: oklch(0.577 0.245 27.325);
21
- --destructive-foreground: oklch(0.985 0 0);
22
- --border: oklch(0.92 0.02 264);
23
- --input: oklch(0.92 0.02 264);
24
- --input-autofill: oklch(1 0 0);
25
- --ring: oklch(0.45 0.15 264);
26
- /* Chart colors - hospital blue palette */
27
- --chart-1: oklch(0.75 0.12 264);
28
- --chart-2: oklch(0.55 0.16 264);
29
- --chart-3: oklch(0.35 0.18 264);
30
- --chart-4: oklch(0.3 0.15 264);
31
- --chart-5: oklch(0.25 0.12 264);
32
- /* Sidebar - uses primary color */
33
- --sidebar: oklch(0.35 0.18 264);
34
- --sidebar-foreground: oklch(0.98 0 0);
35
- /* Active state: white background with primary text */
36
- --sidebar-primary: oklch(1 0 0);
37
- --sidebar-primary-foreground: oklch(0.35 0.18 264);
38
- /* Hover state: semi-transparent white */
39
- --sidebar-accent: oklch(1 0 0 / 20%);
40
- --sidebar-accent-foreground: oklch(0.98 0 0);
41
- --sidebar-border: oklch(0.4 0.16 264);
42
- --sidebar-ring: oklch(0.55 0.18 264);
43
- }
2
+ @layer z-theme {
3
+ :root[z-theme='hospital'] {
4
+ --radius: 0.65rem;
5
+ --background: oklch(1 0 0);
6
+ --foreground: oklch(0.2 0.05 264);
7
+ --card: oklch(1 0 0);
8
+ --card-foreground: oklch(0.2 0.05 264);
9
+ --popover: oklch(1 0 0);
10
+ --popover-foreground: oklch(0.2 0.05 264);
11
+ /* Primary: #2e37a4 converted to oklch */
12
+ --primary: oklch(0.35 0.18 264);
13
+ --primary-foreground: oklch(0.98 0 0);
14
+ /* Secondary: lighter shade */
15
+ --secondary: oklch(0.96 0.02 264);
16
+ --secondary-foreground: oklch(0.25 0.08 264);
17
+ --muted: oklch(0.967 0.003 264.542);
18
+ --muted-foreground: oklch(0.551 0.027 264.364);
19
+ --accent: oklch(0.96 0.02 264);
20
+ --accent-foreground: oklch(0.25 0.08 264);
21
+ --destructive: oklch(0.577 0.245 27.325);
22
+ --destructive-foreground: oklch(0.985 0 0);
23
+ --border: oklch(0.92 0.02 264);
24
+ --input: oklch(0.92 0.02 264);
25
+ --input-autofill: oklch(1 0 0);
26
+ --ring: oklch(0.45 0.15 264);
27
+ /* Chart colors - hospital blue palette */
28
+ --chart-1: oklch(0.75 0.12 264);
29
+ --chart-2: oklch(0.55 0.16 264);
30
+ --chart-3: oklch(0.35 0.18 264);
31
+ --chart-4: oklch(0.3 0.15 264);
32
+ --chart-5: oklch(0.25 0.12 264);
33
+ /* Sidebar - uses primary color */
34
+ --sidebar: oklch(0.35 0.18 264);
35
+ --sidebar-foreground: oklch(0.98 0 0);
36
+ /* Active state: white background with primary text */
37
+ --sidebar-primary: oklch(1 0 0);
38
+ --sidebar-primary-foreground: oklch(0.35 0.18 264);
39
+ /* Hover state: semi-transparent white */
40
+ --sidebar-accent: oklch(1 0 0 / 20%);
41
+ --sidebar-accent-foreground: oklch(0.98 0 0);
42
+ --sidebar-border: oklch(0.4 0.16 264);
43
+ --sidebar-ring: oklch(0.55 0.18 264);
44
+ }
44
45
 
45
- :root[z-theme='hospital'].dark {
46
- --background: oklch(0.15 0.03 264);
47
- --foreground: oklch(0.98 0 0);
48
- --card: oklch(0.2 0.04 264);
49
- --card-foreground: oklch(0.98 0 0);
50
- --popover: oklch(0.2 0.04 264);
51
- --popover-foreground: oklch(0.98 0 0);
52
- --primary: oklch(0.5 0.2 264);
53
- --primary-foreground: oklch(0.98 0 0);
54
- --secondary: oklch(0.25 0.05 264);
55
- --secondary-foreground: oklch(0.98 0 0);
56
- --muted: oklch(0.25 0.05 264);
57
- --muted-foreground: oklch(0.7 0.04 264);
58
- --accent: oklch(0.25 0.05 264);
59
- --accent-foreground: oklch(0.98 0 0);
60
- --destructive: oklch(0.704 0.191 22.216);
61
- --destructive-foreground: oklch(0.985 0 0);
62
- --border: oklch(1 0 0 / 10%);
63
- --input: oklch(1 0 0 / 15%);
64
- --input-autofill: oklch(0.19 0 0);
65
- --ring: oklch(0.45 0.18 264);
66
- --chart-1: oklch(0.75 0.12 264);
67
- --chart-2: oklch(0.55 0.16 264);
68
- --chart-3: oklch(0.4 0.18 264);
69
- --chart-4: oklch(0.35 0.15 264);
70
- --chart-5: oklch(0.3 0.12 264);
71
- --sidebar: oklch(0.25 0.1 264);
72
- --sidebar-foreground: oklch(0.98 0 0);
73
- --sidebar-primary: oklch(0.5 0.2 264);
74
- --sidebar-primary-foreground: oklch(0.98 0 0);
75
- --sidebar-accent: oklch(0.3 0.08 264);
76
- --sidebar-accent-foreground: oklch(0.98 0 0);
77
- --sidebar-border: oklch(1 0 0 / 10%);
78
- --sidebar-ring: oklch(0.45 0.18 264);
46
+ :root[z-theme='hospital'].dark {
47
+ --background: oklch(0.15 0.03 264);
48
+ --foreground: oklch(0.98 0 0);
49
+ --card: oklch(0.2 0.04 264);
50
+ --card-foreground: oklch(0.98 0 0);
51
+ --popover: oklch(0.2 0.04 264);
52
+ --popover-foreground: oklch(0.98 0 0);
53
+ --primary: oklch(0.5 0.2 264);
54
+ --primary-foreground: oklch(0.98 0 0);
55
+ --secondary: oklch(0.25 0.05 264);
56
+ --secondary-foreground: oklch(0.98 0 0);
57
+ --muted: oklch(0.25 0.05 264);
58
+ --muted-foreground: oklch(0.7 0.04 264);
59
+ --accent: oklch(0.25 0.05 264);
60
+ --accent-foreground: oklch(0.98 0 0);
61
+ --destructive: oklch(0.704 0.191 22.216);
62
+ --destructive-foreground: oklch(0.985 0 0);
63
+ --border: oklch(1 0 0 / 10%);
64
+ --input: oklch(1 0 0 / 15%);
65
+ --input-autofill: oklch(0.19 0 0);
66
+ --ring: oklch(0.45 0.18 264);
67
+ --chart-1: oklch(0.75 0.12 264);
68
+ --chart-2: oklch(0.55 0.16 264);
69
+ --chart-3: oklch(0.4 0.18 264);
70
+ --chart-4: oklch(0.35 0.15 264);
71
+ --chart-5: oklch(0.3 0.12 264);
72
+ --sidebar: oklch(0.25 0.1 264);
73
+ --sidebar-foreground: oklch(0.98 0 0);
74
+ --sidebar-primary: oklch(0.5 0.2 264);
75
+ --sidebar-primary-foreground: oklch(0.98 0 0);
76
+ --sidebar-accent: oklch(0.3 0.08 264);
77
+ --sidebar-accent-foreground: oklch(0.98 0 0);
78
+ --sidebar-border: oklch(1 0 0 / 10%);
79
+ --sidebar-ring: oklch(0.45 0.18 264);
80
+ }
79
81
  }
@@ -1,73 +1,75 @@
1
1
  /* NEUTRAL THEME */
2
- :root[z-theme='neutral'] {
3
- --radius: 0.625rem;
4
- --background: oklch(1 0 0);
5
- --foreground: oklch(0.145 0 0);
6
- --card: oklch(1 0 0);
7
- --card-foreground: oklch(0.145 0 0);
8
- --popover: oklch(1 0 0);
9
- --popover-foreground: oklch(0.145 0 0);
10
- --primary: oklch(0.205 0 0);
11
- --primary-foreground: oklch(0.985 0 0);
12
- --secondary: oklch(0.97 0 0);
13
- --secondary-foreground: oklch(0.205 0 0);
14
- --muted: oklch(0.97 0 0);
15
- --muted-foreground: oklch(0.556 0 0);
16
- --accent: oklch(0.97 0 0);
17
- --accent-foreground: oklch(0.205 0 0);
18
- --destructive: oklch(0.577 0.245 27.325);
19
- --destructive-foreground: oklch(0.985 0 0);
20
- --border: oklch(0.922 0 0);
21
- --input: oklch(0.922 0 0);
22
- --input-autofill: oklch(1 0 0);
23
- --ring: oklch(0.708 0 0);
24
- --chart-1: oklch(0.646 0.222 41.116);
25
- --chart-2: oklch(0.6 0.118 184.704);
26
- --chart-3: oklch(0.398 0.07 227.334);
27
- --chart-4: oklch(0.828 0.189 84.429);
28
- --chart-5: oklch(0.769 0.188 70.08);
29
- --sidebar: oklch(0.985 0 0);
30
- --sidebar-foreground: oklch(0.145 0 0);
31
- --sidebar-primary: oklch(0.205 0 0);
32
- --sidebar-primary-foreground: oklch(0.985 0 0);
33
- --sidebar-accent: oklch(0.97 0 0);
34
- --sidebar-accent-foreground: oklch(0.205 0 0);
35
- --sidebar-border: oklch(0.922 0 0);
36
- --sidebar-ring: oklch(0.708 0 0);
37
- }
2
+ @layer z-theme {
3
+ :root[z-theme='neutral'] {
4
+ --radius: 0.625rem;
5
+ --background: oklch(1 0 0);
6
+ --foreground: oklch(0.145 0 0);
7
+ --card: oklch(1 0 0);
8
+ --card-foreground: oklch(0.145 0 0);
9
+ --popover: oklch(1 0 0);
10
+ --popover-foreground: oklch(0.145 0 0);
11
+ --primary: oklch(0.205 0 0);
12
+ --primary-foreground: oklch(0.985 0 0);
13
+ --secondary: oklch(0.97 0 0);
14
+ --secondary-foreground: oklch(0.205 0 0);
15
+ --muted: oklch(0.97 0 0);
16
+ --muted-foreground: oklch(0.556 0 0);
17
+ --accent: oklch(0.97 0 0);
18
+ --accent-foreground: oklch(0.205 0 0);
19
+ --destructive: oklch(0.577 0.245 27.325);
20
+ --destructive-foreground: oklch(0.985 0 0);
21
+ --border: oklch(0.922 0 0);
22
+ --input: oklch(0.922 0 0);
23
+ --input-autofill: oklch(1 0 0);
24
+ --ring: oklch(0.708 0 0);
25
+ --chart-1: oklch(0.646 0.222 41.116);
26
+ --chart-2: oklch(0.6 0.118 184.704);
27
+ --chart-3: oklch(0.398 0.07 227.334);
28
+ --chart-4: oklch(0.828 0.189 84.429);
29
+ --chart-5: oklch(0.769 0.188 70.08);
30
+ --sidebar: oklch(0.985 0 0);
31
+ --sidebar-foreground: oklch(0.145 0 0);
32
+ --sidebar-primary: oklch(0.205 0 0);
33
+ --sidebar-primary-foreground: oklch(0.985 0 0);
34
+ --sidebar-accent: oklch(0.97 0 0);
35
+ --sidebar-accent-foreground: oklch(0.205 0 0);
36
+ --sidebar-border: oklch(0.922 0 0);
37
+ --sidebar-ring: oklch(0.708 0 0);
38
+ }
38
39
 
39
- :root[z-theme='neutral'].dark {
40
- --background: oklch(0.145 0 0);
41
- --foreground: oklch(0.985 0 0);
42
- --card: oklch(0.205 0 0);
43
- --card-foreground: oklch(0.985 0 0);
44
- --popover: oklch(0.205 0 0);
45
- --popover-foreground: oklch(0.985 0 0);
46
- --primary: oklch(0.922 0 0);
47
- --primary-foreground: oklch(0.205 0 0);
48
- --secondary: oklch(0.269 0 0);
49
- --secondary-foreground: oklch(0.985 0 0);
50
- --muted: oklch(0.269 0 0);
51
- --muted-foreground: oklch(0.708 0 0);
52
- --accent: oklch(0.269 0 0);
53
- --accent-foreground: oklch(0.985 0 0);
54
- --destructive: oklch(0.704 0.191 22.216);
55
- --destructive-foreground: oklch(0.985 0 0);
56
- --border: oklch(1 0 0 / 10%);
57
- --input: oklch(1 0 0 / 15%);
58
- --input-autofill: oklch(0.19 0 0);
59
- --ring: oklch(0.556 0 0);
60
- --chart-1: oklch(0.488 0.243 264.376);
61
- --chart-2: oklch(0.696 0.17 162.48);
62
- --chart-3: oklch(0.769 0.188 70.08);
63
- --chart-4: oklch(0.627 0.265 303.9);
64
- --chart-5: oklch(0.645 0.246 16.439);
65
- --sidebar: oklch(0.205 0 0);
66
- --sidebar-foreground: oklch(0.985 0 0);
67
- --sidebar-primary: oklch(0.922 0 0);
68
- --sidebar-primary-foreground: oklch(0.205 0 0);
69
- --sidebar-accent: oklch(0.269 0 0);
70
- --sidebar-accent-foreground: oklch(0.985 0 0);
71
- --sidebar-border: oklch(1 0 0 / 10%);
72
- --sidebar-ring: oklch(0.556 0 0);
40
+ :root[z-theme='neutral'].dark {
41
+ --background: oklch(0.145 0 0);
42
+ --foreground: oklch(0.985 0 0);
43
+ --card: oklch(0.205 0 0);
44
+ --card-foreground: oklch(0.985 0 0);
45
+ --popover: oklch(0.205 0 0);
46
+ --popover-foreground: oklch(0.985 0 0);
47
+ --primary: oklch(0.922 0 0);
48
+ --primary-foreground: oklch(0.205 0 0);
49
+ --secondary: oklch(0.269 0 0);
50
+ --secondary-foreground: oklch(0.985 0 0);
51
+ --muted: oklch(0.269 0 0);
52
+ --muted-foreground: oklch(0.708 0 0);
53
+ --accent: oklch(0.269 0 0);
54
+ --accent-foreground: oklch(0.985 0 0);
55
+ --destructive: oklch(0.704 0.191 22.216);
56
+ --destructive-foreground: oklch(0.985 0 0);
57
+ --border: oklch(1 0 0 / 10%);
58
+ --input: oklch(1 0 0 / 15%);
59
+ --input-autofill: oklch(0.19 0 0);
60
+ --ring: oklch(0.556 0 0);
61
+ --chart-1: oklch(0.488 0.243 264.376);
62
+ --chart-2: oklch(0.696 0.17 162.48);
63
+ --chart-3: oklch(0.769 0.188 70.08);
64
+ --chart-4: oklch(0.627 0.265 303.9);
65
+ --chart-5: oklch(0.645 0.246 16.439);
66
+ --sidebar: oklch(0.205 0 0);
67
+ --sidebar-foreground: oklch(0.985 0 0);
68
+ --sidebar-primary: oklch(0.922 0 0);
69
+ --sidebar-primary-foreground: oklch(0.205 0 0);
70
+ --sidebar-accent: oklch(0.269 0 0);
71
+ --sidebar-accent-foreground: oklch(0.985 0 0);
72
+ --sidebar-border: oklch(1 0 0 / 10%);
73
+ --sidebar-ring: oklch(0.556 0 0);
74
+ }
73
75
  }