@inglorious/ui 9.5.1 → 9.6.0

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.
Files changed (12) hide show
  1. package/README.md +4 -1
  2. package/package.json +5 -2
  3. package/src/controls/input/style.css +1 -0
  4. package/src/examples/dashboard/app-header.js +13 -6
  5. package/src/examples/dashboard/style.css +1 -0
  6. package/src/examples/dashboard/theme-utils.js +9 -2
  7. package/src/styles/themes/bootstrap.css +531 -64
  8. package/src/styles/themes/ios-18.css +713 -0
  9. package/src/styles/themes/ios-26.css +741 -0
  10. package/src/styles/themes/material-3.css +748 -0
  11. package/src/styles/themes/material-ui.css +687 -0
  12. package/src/styles/themes/material.css +0 -170
package/src/styles/themes/material.css DELETED
@@ -1,170 +0,0 @@
1
- .iw-theme-material {
2
- /* The theme on the page itself: the element with the theme class, usually
3
- <body>, takes its background, text color and font. */
4
- background-color: var(--iw-color-bg);
5
- color: var(--iw-color-text);
6
- font-family: var(--iw-font-family-sans);
7
-
8
- /* ========================================
9
- MATERIAL THEME - Material Design Inspired
10
- ======================================== */
11
-
12
- /* Semantic Colors */
13
- --iw-color-bg: var(--iw-color-gray-50);
14
- --iw-color-bg-secondary: var(--iw-color-white);
15
- --iw-color-bg-tertiary: var(--iw-color-gray-100);
16
- --iw-color-surface: var(--iw-color-white);
17
- --iw-color-surface-hover: var(--iw-color-gray-50);
18
- --iw-color-surface-active: var(--iw-color-gray-100);
19
-
20
- --iw-color-text: var(--iw-color-gray-900);
21
- --iw-color-text-secondary: var(--iw-color-gray-700);
22
- --iw-color-text-muted: var(--iw-color-gray-500);
23
-
24
- --iw-color-border: var(--iw-color-gray-300);
25
- --iw-color-border-focus: #1a73e8;
26
-
27
- --iw-color-primary: #1a73e8;
28
- --iw-color-primary-hover: #1557b0;
29
- --iw-color-primary-active: #0d47a1;
30
- --iw-color-primary-text: var(--iw-color-white);
31
-
32
- --iw-color-accent: #e91e63;
33
- --iw-color-accent-hover: #c2185b;
34
- --iw-color-accent-active: #ad1457;
35
-
36
- /* Buttons and tabs carry their labels as Material UI does */
37
- --iw-label-text-transform: uppercase;
38
- --iw-label-letter-spacing: 0.02857em;
39
- --iw-label-font-weight: var(--iw-font-weight-medium);
40
-
41
- /* ========================================
42
- COMPONENT TOKENS
43
- ======================================== */
44
-
45
- /* Button */
46
- --iw-button-bg: var(--iw-color-primary);
47
- --iw-button-bg-hover: var(--iw-color-primary-hover);
48
- --iw-button-bg-active: var(--iw-color-primary-active);
49
- --iw-button-text: var(--iw-color-primary-text);
50
- --iw-button-border: var(--iw-color-primary);
51
- --iw-button-radius: var(--iw-radius-full);
52
- --iw-button-shadow:
53
- 0 1px 2px rgba(60, 64, 67, 0.3), 0 1px 3px 1px rgba(60, 64, 67, 0.15);
54
- --iw-button-shadow-hover:
55
- 0 1px 2px rgba(60, 64, 67, 0.3), 0 2px 6px 2px rgba(60, 64, 67, 0.15);
56
- --iw-button-shadow-active: 0 1px 3px rgba(60, 64, 67, 0.4);
57
-
58
- /* A button's default color is primary, as in Material UI */
59
- --iw-button-default-color: var(--iw-color-primary);
60
- --iw-button-default-bg: var(--iw-color-primary);
61
- --iw-button-default-bg-hover: var(--iw-color-primary-hover);
62
- --iw-button-default-bg-active: var(--iw-color-primary-active);
63
- --iw-button-default-border: var(--iw-color-primary);
64
- --iw-button-default-text: var(--iw-color-primary-text);
65
-
66
- --iw-button-outline-bg: transparent;
67
- --iw-button-outline-bg-hover: rgba(26, 115, 232, 0.08);
68
- --iw-button-outline-text: var(--iw-color-primary);
69
- --iw-button-outline-text-hover: var(--iw-color-primary);
70
- --iw-button-outline-border: transparent;
71
-
72
- --iw-button-ghost-bg: transparent;
73
- --iw-button-ghost-bg-hover: rgba(0, 0, 0, 0.04);
74
- --iw-button-ghost-text: var(--iw-color-primary);
75
- --iw-button-ghost-border: transparent;
76
-
77
- /* Input */
78
- --iw-input-bg: var(--iw-color-bg-secondary);
79
- --iw-input-bg-hover: var(--iw-color-bg-secondary);
80
- --iw-input-bg-focus: var(--iw-color-bg-secondary);
81
- --iw-input-text: var(--iw-color-text);
82
- --iw-input-text-placeholder: var(--iw-color-text-muted);
83
- --iw-input-border: var(--iw-color-border);
84
- --iw-input-border-hover: var(--iw-color-border);
85
- --iw-input-border-focus: var(--iw-color-primary);
86
- --iw-input-radius: var(--iw-radius-xs);
87
- --iw-input-shadow-focus: none;
88
-
89
- /* App bar */
90
- --iw-app-bar-bg: var(--iw-color-surface);
91
-
92
- /* Drawer */
93
- --iw-drawer-bg: var(--iw-color-surface);
94
-
95
- /* Card */
96
- --iw-card-bg: var(--iw-color-surface);
97
- --iw-card-border: transparent;
98
- --iw-card-radius: var(--iw-radius-lg);
99
- --iw-card-shadow:
100
- 0 1px 2px 0 rgba(60, 64, 67, 0.3), 0 1px 3px 1px rgba(60, 64, 67, 0.15);
101
- --iw-card-shadow-hover:
102
- 0 1px 3px 0 rgba(60, 64, 67, 0.3), 0 4px 8px 3px rgba(60, 64, 67, 0.15);
103
-
104
- /* Badge */
105
- --iw-badge-radius: var(--iw-radius-sm);
106
-
107
- /* Chip: a tint of the text, as cards and tables share the white background */
108
- --iw-chip-bg: color-mix(in srgb, var(--iw-color-text) 8%, transparent);
109
-
110
- /* List */
111
- --iw-list-item: transparent;
112
- --iw-list-item-selected: color-mix(
113
- in srgb,
114
- var(--iw-color-primary) 8%,
115
- transparent
116
- );
117
-
118
- /* Alert */
119
- --iw-alert-radius: var(--iw-radius-md);
120
- --iw-alert-shadow: none;
121
- color-scheme: light;
122
- }
123
-
124
- /* Dark variant */
125
- .iw-theme-material.iw-theme-dark {
126
- color-scheme: dark;
127
-
128
- --iw-color-bg: #121212;
129
- --iw-color-bg-secondary: #1e1e1e;
130
- --iw-color-bg-tertiary: #2d2d2d;
131
- --iw-color-surface: #1e1e1e;
132
- --iw-color-surface-hover: #2d2d2d;
133
- --iw-color-surface-active: #3d3d3d;
134
- --iw-color-text: var(--iw-color-gray-100);
135
- --iw-color-text-secondary: var(--iw-color-gray-300);
136
- --iw-color-text-muted: var(--iw-color-gray-400);
137
- --iw-color-border: var(--iw-color-gray-700);
138
-
139
- --iw-color-primary: #8ab4f8;
140
- --iw-color-primary-hover: #aecbfa;
141
- --iw-color-primary-active: #669df6;
142
- --iw-color-primary-text: var(--iw-color-black);
143
-
144
- --iw-color-border-focus: #8ab4f8;
145
-
146
- --iw-input-bg: var(--iw-color-bg-secondary);
147
- --iw-input-bg-hover: var(--iw-color-bg-secondary);
148
- --iw-input-bg-focus: var(--iw-color-bg-secondary);
149
- --iw-input-border: var(--iw-color-gray-600);
150
- --iw-input-border-hover: var(--iw-color-gray-500);
151
- --iw-input-border-focus: var(--iw-color-primary);
152
-
153
- --iw-button-shadow:
154
- 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 3px 1px rgba(0, 0, 0, 0.15);
155
- --iw-button-shadow-hover:
156
- 0 1px 2px rgba(0, 0, 0, 0.3), 0 2px 6px 2px rgba(0, 0, 0, 0.15);
157
-
158
- --iw-card-shadow:
159
- 0 1px 2px 0 rgba(0, 0, 0, 0.3), 0 1px 3px 1px rgba(0, 0, 0, 0.15);
160
-
161
- --iw-chip-bg: color-mix(in srgb, var(--iw-color-text) 16%, transparent);
162
-
163
- --iw-list-item: transparent;
164
- --iw-list-item-active: #2d2d2d;
165
- --iw-list-item-selected: color-mix(
166
- in srgb,
167
- var(--iw-color-primary) 12%,
168
- transparent
169
- );
170
- }