@ardium-ui/ui 5.0.0-alpha.60 → 5.0.0-alpha.61

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/fesm2022/ardium-ui-ui.mjs +5 -3
  2. package/fesm2022/ardium-ui-ui.mjs.map +1 -1
  3. package/package.json +1 -1
  4. package/prebuilt-themes/default/tabber.css +14 -6
  5. package/prebuilt-themes/default/tabber.css.map +1 -1
  6. package/themes/default/tabber.scss +16 -6
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ardium-ui/ui",
3
- "version": "5.0.0-alpha.60",
3
+ "version": "5.0.0-alpha.61",
4
4
  "peerDependencies": {
5
5
  "@angular/common": ">=18.0.0",
6
6
  "@angular/core": ">=18.0.0",
package/prebuilt-themes/default/tabber.css CHANGED
@@ -8,9 +8,11 @@
8
8
  --ard-tabber-tab-gap: 0;
9
9
  --ard-tabber-tab-content-gap: 0.375rem;
10
10
  --ard-tabber-separator-border: 1px solid var(--ard-detail-ultralight, rgba(0, 0, 0, 12%));
11
- --ard-tabber-tab-hover-opacity: 4%;
12
- --ard-tabber-tab-active-opacity: 12%;
13
- --ard-tabber-tab-focus-visible-opacity: 18%;
11
+ --ard-tabber-tab-hover-overlay-opacity: 4%;
12
+ --ard-tabber-tab-active-overlay-opacity: 12%;
13
+ --ard-tabber-tab-focus-visible-overlay-opacity: 18%;
14
+ --ard-tabber-tab-disabled-overlay-opacity: 12%;
15
+ --ard-tabber-tab-disabled-opacity: 12%;
14
16
  }
15
17
 
16
18
  ard-tabber {
@@ -212,13 +214,13 @@ ard-tabber {
212
214
  gap: var(--ard-tabber-tab-content-gap, 0.375rem);
213
215
  }
214
216
  .ard-tabber .ard-tabber-tabs .ard-tab-button:hover .ard-focus-overlay, .ard-tabber .ard-tabber-tabs .ard-tab-button:focus .ard-focus-overlay {
215
- opacity: var(--ard-tabber-tab-hover-opacity, 4%);
217
+ opacity: var(--ard-tabber-tab-hover-overlay-opacity, 4%);
216
218
  }
217
219
  .ard-tabber .ard-tabber-tabs .ard-tab-button.ard-active .ard-focus-overlay, .ard-tabber .ard-tabber-tabs .ard-tab-button:active .ard-focus-overlay {
218
- opacity: var(--ard-tabber-tab-active-opacity, 12%);
220
+ opacity: var(--ard-tabber-tab-active-overlay-opacity, 12%);
219
221
  }
220
222
  .ard-tabber .ard-tabber-tabs .ard-tab-button:focus-visible .ard-focus-overlay {
221
- opacity: var(--ard-tabber-tab-focus-visible-opacity, 18%);
223
+ opacity: var(--ard-tabber-tab-focus-visible-overlay-opacity, 18%);
222
224
  }
223
225
  .ard-tabber .ard-tabber-tabs .ard-tab-button.ard-tab-active::after {
224
226
  content: "";
@@ -229,5 +231,11 @@ ard-tabber {
229
231
  height: 2px;
230
232
  background: var(--ard-cmpcl--bg-colored);
231
233
  }
234
+ .ard-tabber .ard-tabber-tabs .ard-tab-button.ard-tab-disabled {
235
+ opacity: var(--ard-tabber-tab-disabled-opacity);
236
+ }
237
+ .ard-tabber .ard-tabber-tabs .ard-tab-button.ard-tab-disabled .ard-focus-overlay {
238
+ opacity: var(--ard-tabber-tab-disabled-overlay-opacity, 18%);
239
+ }
232
240
 
233
241
  /*# sourceMappingURL=tabber.css.map */
package/prebuilt-themes/default/tabber.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/tabber.scss","../../../../projects/ui/src/themes/default/_coloring.scss","../../../../projects/ui/src/themes/default/_mixins.scss"],"names":[],"mappings":"AAKA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;;;AAGF;EACE;;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA;;AC7BA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;ADpGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EEzDJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EFkDM;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAKA;EACE;;AAKF;EACE;;AAIF;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA","file":"tabber.css"}
1
+ {"version":3,"sourceRoot":"","sources":["../../../../projects/ui/src/themes/default/tabber.scss","../../../../projects/ui/src/themes/default/_coloring.scss","../../../../projects/ui/src/themes/default/_mixins.scss"],"names":[],"mappings":"AAKA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EAEE;EACA;EACA;EACA;EACA;EACA;;AC/BA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;ADlGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;;AAEF;EACE;;AAEF;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EE3DJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EFoDM;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAKA;EACE;;AAKF;EACE;;AAIF;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAIJ;EACE;;AAEA;EACE","file":"tabber.css"}
package/themes/default/tabber.scss CHANGED
@@ -14,9 +14,11 @@
14
14
  --ard-tabber-tab-content-gap: 0.375rem;
15
15
  --ard-tabber-separator-border: 1px solid var(--ard-detail-ultralight, rgba(0, 0, 0, 12%));
16
16
  // --ard-tabber-tab-overlay-color: ;
17
- --ard-tabber-tab-hover-opacity: 4%;
18
- --ard-tabber-tab-active-opacity: 12%;
19
- --ard-tabber-tab-focus-visible-opacity: 18%;
17
+ --ard-tabber-tab-hover-overlay-opacity: 4%;
18
+ --ard-tabber-tab-active-overlay-opacity: 12%;
19
+ --ard-tabber-tab-focus-visible-overlay-opacity: 18%;
20
+ --ard-tabber-tab-disabled-overlay-opacity: 12%;
21
+ --ard-tabber-tab-disabled-opacity: 12%;
20
22
  }
21
23
 
22
24
  ard-tabber {
@@ -83,18 +85,18 @@ ard-tabber {
83
85
  &:hover,
84
86
  &:focus {
85
87
  .ard-focus-overlay {
86
- opacity: var(--ard-tabber-tab-hover-opacity, 4%);
88
+ opacity: var(--ard-tabber-tab-hover-overlay-opacity, 4%);
87
89
  }
88
90
  }
89
91
  &.ard-active,
90
92
  &:active {
91
93
  .ard-focus-overlay {
92
- opacity: var(--ard-tabber-tab-active-opacity, 12%);
94
+ opacity: var(--ard-tabber-tab-active-overlay-opacity, 12%);
93
95
  }
94
96
  }
95
97
  &:focus-visible {
96
98
  .ard-focus-overlay {
97
- opacity: var(--ard-tabber-tab-focus-visible-opacity, 18%);
99
+ opacity: var(--ard-tabber-tab-focus-visible-overlay-opacity, 18%);
98
100
  }
99
101
  }
100
102
 
@@ -109,6 +111,14 @@ ard-tabber {
109
111
  background: var(--ard-cmpcl--bg-colored);
110
112
  }
111
113
  }
114
+
115
+ &.ard-tab-disabled {
116
+ opacity: var(--ard-tabber-tab-disabled-opacity);
117
+
118
+ .ard-focus-overlay {
119
+ opacity: var(--ard-tabber-tab-disabled-overlay-opacity, 18%);
120
+ }
121
+ }
112
122
  }
113
123
  }
114
124
  }