@inglorious/ui 7.2.4 → 7.3.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 (6) hide show
  1. package/package.json +1 -1
  2. package/src/navigation/drawer/style.css +1 -1
  3. package/src/styles/themes/bootstrap.css +10 -4
  4. package/src/styles/themes/inglorious.css +10 -4
  5. package/src/styles/themes/material.css +10 -4
  6. package/src/surfaces/app-bar/style.css +2 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@inglorious/ui",
3
- "version": "7.2.4",
3
+ "version": "7.3.0",
4
4
  "description": "A design system for Inglorious Web with render-function components and customizable themes",
5
5
  "author": "Matteo Antony Mistretta <antony.mistretta@gmail.com> (https://ingloriouscoderz.it)",
6
6
  "license": "MIT",
package/src/navigation/drawer/style.css CHANGED
@@ -1,6 +1,6 @@
1
1
  .iw-drawer {
2
2
  width: 16rem;
3
- background: var(--iw-color-surface);
3
+ background: var(--iw-drawer-bg, var(--iw-color-surface));
4
4
  color: var(--iw-color-text);
5
5
  transition:
6
6
  margin var(--iw-transition-fast),
package/src/styles/themes/bootstrap.css CHANGED
@@ -67,6 +67,12 @@
67
67
  --iw-input-radius: var(--iw-radius-md);
68
68
  --iw-input-shadow-focus: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
69
69
 
70
+ /* App bar */
71
+ --iw-app-bar-bg: var(--iw-color-surface);
72
+
73
+ /* Drawer */
74
+ --iw-drawer-bg: var(--iw-color-surface);
75
+
70
76
  /* Card */
71
77
  --iw-card-bg: var(--iw-color-surface);
72
78
  --iw-card-border: var(--iw-color-border);
@@ -78,11 +84,11 @@
78
84
  --iw-badge-radius: var(--iw-radius-md);
79
85
 
80
86
  /* List */
81
- --iw-list-item: var(--iw-color-white);
87
+ --iw-list-item: transparent;
82
88
  --iw-list-item-selected: color-mix(
83
89
  in srgb,
84
90
  var(--iw-color-primary) 8%,
85
- var(--iw-color-white)
91
+ transparent
86
92
  );
87
93
 
88
94
  /* Alert */
@@ -126,11 +132,11 @@
126
132
  --iw-button-ghost-bg-hover: #343a40;
127
133
  --iw-button-ghost-text: var(--iw-color-text);
128
134
 
129
- --iw-list-item: #2c3036;
135
+ --iw-list-item: transparent;
130
136
  --iw-list-item-active: #343a40;
131
137
  --iw-list-item-selected: color-mix(
132
138
  in srgb,
133
139
  var(--iw-color-primary) 12%,
134
- #2c3036
140
+ transparent
135
141
  );
136
142
  }
package/src/styles/themes/inglorious.css CHANGED
@@ -81,6 +81,12 @@
81
81
  --iw-input-shadow-focus:
82
82
  0 0 0 1px var(--iw-color-primary), 0 0 10px rgba(0, 255, 136, 0.3);
83
83
 
84
+ /* App bar */
85
+ --iw-app-bar-bg: var(--iw-color-surface);
86
+
87
+ /* Drawer */
88
+ --iw-drawer-bg: var(--iw-color-surface);
89
+
84
90
  /* Card */
85
91
  --iw-card-bg: var(--iw-color-surface);
86
92
  --iw-card-border: var(--iw-color-border);
@@ -92,11 +98,11 @@
92
98
  --iw-badge-radius: var(--iw-radius-none);
93
99
 
94
100
  /* List */
95
- --iw-list-item: var(--iw-color-gray-800);
101
+ --iw-list-item: transparent;
96
102
  --iw-list-item-selected: color-mix(
97
103
  in srgb,
98
104
  var(--iw-color-primary) 8%,
99
- var(--iw-color-gray-800)
105
+ transparent
100
106
  );
101
107
 
102
108
  /* Alert */
@@ -126,12 +132,12 @@
126
132
  --iw-button-shadow-hover: 0 0 10px var(--iw-color-primary);
127
133
  --iw-card-shadow-hover: var(--iw-shadow-xl), 0 0 15px rgba(0, 255, 136, 0.2);
128
134
 
129
- --iw-list-item: var(--iw-color-white);
135
+ --iw-list-item: transparent;
130
136
  --iw-list-item-active: var(--iw-color-gray-100);
131
137
  --iw-list-item-selected: color-mix(
132
138
  in srgb,
133
139
  var(--iw-color-primary) 8%,
134
- var(--iw-color-white)
140
+ transparent
135
141
  );
136
142
  }
137
143
 
package/src/styles/themes/material.css CHANGED
@@ -69,6 +69,12 @@
69
69
  --iw-input-radius: var(--iw-radius-xs);
70
70
  --iw-input-shadow-focus: none;
71
71
 
72
+ /* App bar */
73
+ --iw-app-bar-bg: var(--iw-color-surface);
74
+
75
+ /* Drawer */
76
+ --iw-drawer-bg: var(--iw-color-surface);
77
+
72
78
  /* Card */
73
79
  --iw-card-bg: var(--iw-color-surface);
74
80
  --iw-card-border: transparent;
@@ -82,11 +88,11 @@
82
88
  --iw-badge-radius: var(--iw-radius-sm);
83
89
 
84
90
  /* List */
85
- --iw-list-item: var(--iw-color-white);
91
+ --iw-list-item: transparent;
86
92
  --iw-list-item-selected: color-mix(
87
93
  in srgb,
88
94
  var(--iw-color-primary) 8%,
89
- var(--iw-color-white)
95
+ transparent
90
96
  );
91
97
 
92
98
  /* Alert */
@@ -132,11 +138,11 @@
132
138
  --iw-card-shadow:
133
139
  0 1px 2px 0 rgba(0, 0, 0, 0.3), 0 1px 3px 1px rgba(0, 0, 0, 0.15);
134
140
 
135
- --iw-list-item: #1e1e1e;
141
+ --iw-list-item: transparent;
136
142
  --iw-list-item-active: #2d2d2d;
137
143
  --iw-list-item-selected: color-mix(
138
144
  in srgb,
139
145
  var(--iw-color-primary) 12%,
140
- #1e1e1e
146
+ transparent
141
147
  );
142
148
  }
package/src/surfaces/app-bar/style.css CHANGED
@@ -3,7 +3,7 @@
3
3
  align-items: center;
4
4
  min-height: var(--iw-space-16);
5
5
  /* gap: var(--iw-space-3); */
6
- background: var(--iw-color-surface);
6
+ background: var(--iw-app-bar-bg, var(--iw-color-surface));
7
7
  color: var(--iw-color-text);
8
8
  border-bottom: 1px solid var(--iw-color-border);
9
9
  }
@@ -51,7 +51,7 @@
51
51
  }
52
52
 
53
53
  .iw-app-bar-color-default {
54
- background: var(--iw-color-surface);
54
+ background: var(--iw-app-bar-bg, var(--iw-color-surface));
55
55
  color: var(--iw-color-text);
56
56
  }
57
57