@itwin/itwinui-css 1.0.0-dev.4 → 1.0.0-dev.6

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/css/all.css +42 -39
  2. package/css/checkbox.css +3 -1
  3. package/css/radio.css +3 -1
  4. package/css/table.css +17 -11
  5. package/css/tile.css +19 -26
  6. package/package.json +1 -1
package/css/all.css CHANGED
@@ -1722,7 +1722,8 @@ a.iui-breadcrumbs-text:focus{
1722
1722
  gap:var(--iui-size-xs);
1723
1723
  }
1724
1724
  .iui-checkbox-wrapper.iui-loading{
1725
- cursor:wait;
1725
+ cursor:progress;
1726
+ font-style:italic;
1726
1727
  color:var(--iui-color-foreground-4);
1727
1728
  }
1728
1729
  .iui-checkbox-wrapper > .iui-checkbox-label,
@@ -1809,6 +1810,7 @@ a.iui-breadcrumbs-text:focus{
1809
1810
  --_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m1.70671 12.879 11.17218-11.17219 1.4142 1.4142-11.17218 11.17218zm.99329-1.679 1.1-1.1a5.06317 5.06317 0 0 1 -2-2.1 7.48268 7.48268 0 0 1 6.2-3.5 4.86877 4.86877 0 0 1 1.2.1l1.3-1.3a10.07431 10.07431 0 0 0 -2.5-.3 8.84129 8.84129 0 0 0 -8 5 8.42455 8.42455 0 0 0 2.7 3.2zm10.7-6.4-1.1 1.1a7.08625 7.08625 0 0 1 2 2.1 7.50323 7.50323 0 0 1 -6.2 3.5 8.31665 8.31665 0 0 1 -1.3-.2l-1.3 1.3a8.909 8.909 0 0 0 6.4-.5 9.04344 9.04344 0 0 0 4.1-4.1 9.168 9.168 0 0 0 -2.6-3.2z" /></svg>');
1810
1811
  --_iui-checkbox-border-color:transparent;
1811
1812
  --_iui-checkbox-background-color:transparent;
1813
+ outline-width:1px;
1812
1814
  }
1813
1815
  .iui-checkbox.iui-checkbox-visibility:where(:not(:checked):not(:indeterminate)){
1814
1816
  --_iui-checkbox-svg-color:var(--iui-color-foreground-2);
@@ -4541,7 +4543,8 @@ div.iui-header-breadcrumb-button-icon{
4541
4543
  gap:var(--iui-size-xs);
4542
4544
  }
4543
4545
  .iui-radio-wrapper.iui-loading{
4544
- cursor:wait;
4546
+ cursor:progress;
4547
+ font-style:italic;
4545
4548
  color:var(--iui-color-foreground-4);
4546
4549
  }
4547
4550
  .iui-radio-wrapper > .iui-checkbox-label,
@@ -4628,6 +4631,7 @@ div.iui-header-breadcrumb-button-icon{
4628
4631
  --_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m1.70671 12.879 11.17218-11.17219 1.4142 1.4142-11.17218 11.17218zm.99329-1.679 1.1-1.1a5.06317 5.06317 0 0 1 -2-2.1 7.48268 7.48268 0 0 1 6.2-3.5 4.86877 4.86877 0 0 1 1.2.1l1.3-1.3a10.07431 10.07431 0 0 0 -2.5-.3 8.84129 8.84129 0 0 0 -8 5 8.42455 8.42455 0 0 0 2.7 3.2zm10.7-6.4-1.1 1.1a7.08625 7.08625 0 0 1 2 2.1 7.50323 7.50323 0 0 1 -6.2 3.5 8.31665 8.31665 0 0 1 -1.3-.2l-1.3 1.3a8.909 8.909 0 0 0 6.4-.5 9.04344 9.04344 0 0 0 4.1-4.1 9.168 9.168 0 0 0 -2.6-3.2z" /></svg>');
4629
4632
  --_iui-checkbox-border-color:transparent;
4630
4633
  --_iui-checkbox-background-color:transparent;
4634
+ outline-width:1px;
4631
4635
  }
4632
4636
  .iui-radio.iui-checkbox-visibility:where(:not(:checked):not(:indeterminate)){
4633
4637
  --_iui-checkbox-svg-color:var(--iui-color-foreground-2);
@@ -5930,14 +5934,11 @@ div.iui-header-breadcrumb-button-icon{
5930
5934
  .iui-table-body .iui-table-row > .iui-slot > .iui-table-more-options{
5931
5935
  opacity:0;
5932
5936
  }
5933
- .iui-table-body .iui-table-row:where(:hover:not([aria-disabled="true"])) .iui-table-cell{
5934
- background-color:var(--iui-color-background-transparent-hover);
5935
- }
5936
- .iui-table-body .iui-table-row:where(:hover:not([aria-disabled="true"])) > .iui-slot:not([aria-disabled=true]) > .iui-table-more-options{
5937
+ .iui-table-body .iui-table-row:where(:hover, :focus-within) > .iui-slot > .iui-table-more-options{
5937
5938
  opacity:1;
5938
5939
  }
5939
- .iui-table-body .iui-table-row:focus-within > .iui-slot:not([aria-disabled=true]) > .iui-table-more-options{
5940
- opacity:1;
5940
+ .iui-table-body .iui-table-row:where(:hover:not(.iui-loading):not([aria-disabled="true"])) .iui-table-cell{
5941
+ background-color:var(--iui-color-background-transparent-hover);
5941
5942
  }
5942
5943
  @media (prefers-reduced-motion: no-preference){
5943
5944
  .iui-table-body .iui-table-row .iui-table-row-expander > .iui-button-icon{
@@ -6021,14 +6022,13 @@ div.iui-header-breadcrumb-button-icon{
6021
6022
  font-size:var(--iui-font-size-4);
6022
6023
  color:var(--iui-color-foreground-positive);
6023
6024
  }
6025
+ .iui-table-body .iui-table-row.iui-loading,
6024
6026
  .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true], .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true]{
6025
- font-style:italic;
6026
- cursor:not-allowed;
6027
6027
  color:var(--iui-color-foreground-4);
6028
6028
  }
6029
- .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true].iui-slot:hover > .iui-table-more-options, .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true].iui-slot:hover > .iui-table-more-options{
6030
- opacity:0;
6031
- }
6029
+ .iui-table-body .iui-table-row.iui-loading img,
6030
+ .iui-table-body .iui-table-row.iui-loading svg:not(.iui-radial),
6031
+ .iui-table-body .iui-table-row.iui-loading .iui-avatar,
6032
6032
  .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true] img,
6033
6033
  .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true] svg:not(.iui-radial),
6034
6034
  .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true] .iui-avatar, .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true] img,
@@ -6036,6 +6036,16 @@ div.iui-header-breadcrumb-button-icon{
6036
6036
  .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true] .iui-avatar{
6037
6037
  filter:grayscale(100%);
6038
6038
  }
6039
+ .iui-table-body .iui-table-row.iui-loading{
6040
+ font-style:italic;
6041
+ }
6042
+ .iui-table-body .iui-table-row.iui-loading,
6043
+ .iui-table-body .iui-table-row.iui-loading .iui-checkbox{
6044
+ cursor:progress;
6045
+ }
6046
+ .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true], .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true]{
6047
+ cursor:not-allowed;
6048
+ }
6039
6049
  .iui-table-body .iui-table-row[data-iui-status=positive] .iui-table-cell:first-of-type,
6040
6050
  .iui-table-body .iui-table-row[data-iui-status=positive] + .iui-table-expanded-content{
6041
6051
  box-shadow:inset var(--iui-size-3xs) 0 0 0 var(--iui-color-foreground-positive);
@@ -7019,6 +7029,8 @@ a.iui-tag-basic:focus-visible{
7019
7029
  margin:0 0 var(--iui-size-l);
7020
7030
  }
7021
7031
  .iui-tile{
7032
+ --_iui-tile-title-text-color:var(--iui-color-foreground-2);
7033
+ --_iui-tile-body-text-color:var(--iui-color-foreground-4);
7022
7034
  margin:0;
7023
7035
  padding:0;
7024
7036
  border:none;
@@ -7134,28 +7146,27 @@ a.iui-tag-basic:focus-visible{
7134
7146
  margin-bottom:0;
7135
7147
  -webkit-line-clamp:2;
7136
7148
  }
7137
- .iui-tile.iui-progress{
7138
- cursor:progress;
7139
- font-style:italic;
7140
- }
7141
- .iui-tile[aria-disabled=true]{
7142
- cursor:not-allowed;
7143
- }
7144
- .iui-tile[aria-disabled=true] .iui-tile-name-label{
7145
- color:var(--iui-color-foreground-4);
7149
+ .iui-tile.iui-loading, .iui-tile[aria-disabled=true]{
7150
+ --_iui-tile-title-text-color:var(--iui-color-foreground-4);
7146
7151
  }
7147
- .iui-tile[aria-disabled=true] .iui-thumbnail-icon,
7152
+ .iui-tile.iui-loading .iui-thumbnail-icon,
7153
+ .iui-tile.iui-loading .iui-tile-thumbnail-picture, .iui-tile[aria-disabled=true] .iui-thumbnail-icon,
7148
7154
  .iui-tile[aria-disabled=true] .iui-tile-thumbnail-picture{
7149
7155
  filter:grayscale(100%);
7150
7156
  }
7151
- .iui-tile[aria-disabled=true]:hover .iui-tile-thumbnail-picture, .iui-tile[aria-disabled=true]:focus-within .iui-tile-thumbnail-picture{
7157
+ .iui-tile.iui-loading:hover .iui-tile-thumbnail-picture, .iui-tile.iui-loading:focus-within .iui-tile-thumbnail-picture, .iui-tile[aria-disabled=true]:hover .iui-tile-thumbnail-picture, .iui-tile[aria-disabled=true]:focus-within .iui-tile-thumbnail-picture{
7152
7158
  transform:none;
7153
7159
  }
7154
- .iui-tile[aria-disabled=true] .iui-tile-more-options{
7155
- display:none;
7160
+ .iui-tile.iui-loading{
7161
+ cursor:progress;
7162
+ font-style:italic;
7163
+ }
7164
+ .iui-tile[aria-disabled=true]{
7165
+ cursor:not-allowed;
7156
7166
  }
7157
7167
  .iui-tile.iui-positive{
7158
7168
  --_iui-tile-status-icon-fill:var(--iui-color-foreground-positive);
7169
+ --_iui-tile-title-text-color:var(--iui-color-foreground-positive);
7159
7170
  }
7160
7171
  .iui-tile.iui-positive::-moz-selection, .iui-tile.iui-positive *::-moz-selection{
7161
7172
  background-color:hsl(var(--iui-color-foreground-positive-hsl)/var(--iui-opacity-5));
@@ -7171,11 +7182,9 @@ a.iui-tag-basic:focus-visible{
7171
7182
  box-shadow:var(--iui-size-2xs) 0 0 var(--iui-color-foreground-positive);
7172
7183
  }
7173
7184
 
7174
- .iui-tile.iui-positive .iui-tile-name-label{
7175
- color:var(--iui-color-foreground-positive);
7176
- }
7177
7185
  .iui-tile.iui-warning{
7178
7186
  --_iui-tile-status-icon-fill:var(--iui-color-foreground-warning);
7187
+ --_iui-tile-title-text-color:var(--iui-color-foreground-warning);
7179
7188
  }
7180
7189
  .iui-tile.iui-warning::-moz-selection, .iui-tile.iui-warning *::-moz-selection{
7181
7190
  background-color:hsl(var(--iui-color-foreground-warning-hsl)/var(--iui-opacity-5));
@@ -7191,11 +7200,9 @@ a.iui-tag-basic:focus-visible{
7191
7200
  box-shadow:var(--iui-size-2xs) 0 0 var(--iui-color-foreground-warning);
7192
7201
  }
7193
7202
 
7194
- .iui-tile.iui-warning .iui-tile-name-label{
7195
- color:var(--iui-color-foreground-warning);
7196
- }
7197
7203
  .iui-tile.iui-negative{
7198
7204
  --_iui-tile-status-icon-fill:var(--iui-color-foreground-negative);
7205
+ --_iui-tile-title-text-color:var(--iui-color-foreground-negative);
7199
7206
  }
7200
7207
  .iui-tile.iui-negative::-moz-selection, .iui-tile.iui-negative *::-moz-selection{
7201
7208
  background-color:hsl(var(--iui-color-foreground-negative-hsl)/var(--iui-opacity-5));
@@ -7211,10 +7218,6 @@ a.iui-tag-basic:focus-visible{
7211
7218
  box-shadow:var(--iui-size-2xs) 0 0 var(--iui-color-foreground-negative);
7212
7219
  }
7213
7220
 
7214
- .iui-tile.iui-negative .iui-tile-name-label{
7215
- color:var(--iui-color-foreground-negative);
7216
- }
7217
-
7218
7221
  .iui-tile-thumbnail-type-indicator{
7219
7222
  --_iui-button-text-color:var(--iui-color-foreground-2);
7220
7223
  --_iui-button-background-color:transparent;
@@ -7436,7 +7439,7 @@ div.iui-tile-thumbnail-picture{
7436
7439
  -moz-user-select:all;
7437
7440
  user-select:all;
7438
7441
  margin-bottom:calc(var(--iui-size-s) * 0.5);
7439
- color:var(--iui-color-foreground-2);
7442
+ color:var(--_iui-tile-title-text-color);
7440
7443
  }
7441
7444
  .iui-tile-content .iui-tile-status-icon{
7442
7445
  display:flex;
@@ -7461,7 +7464,7 @@ div.iui-tile-thumbnail-picture{
7461
7464
  display:-webkit-box;
7462
7465
  -webkit-line-clamp:3;
7463
7466
  -webkit-box-orient:vertical;
7464
- color:var(--iui-color-foreground-4);
7467
+ color:var(--_iui-tile-body-text-color);
7465
7468
  }
7466
7469
  .iui-tile-content .iui-tile-metadata{
7467
7470
  font-size:var(--iui-font-size-0);
@@ -7473,7 +7476,7 @@ div.iui-tile-thumbnail-picture{
7473
7476
  display:flex;
7474
7477
  align-items:center;
7475
7478
  margin-top:auto;
7476
- color:var(--iui-color-foreground-4);
7479
+ color:var(--_iui-tile-body-text-color);
7477
7480
  }
7478
7481
  .iui-tile-content .iui-tile-metadata > svg,
7479
7482
  .iui-tile-content .iui-tile-metadata .iui-tile-metadata-icon{
package/css/checkbox.css CHANGED
@@ -44,7 +44,8 @@
44
44
  gap:var(--iui-size-xs);
45
45
  }
46
46
  .iui-checkbox-wrapper.iui-loading{
47
- cursor:wait;
47
+ cursor:progress;
48
+ font-style:italic;
48
49
  color:var(--iui-color-foreground-4);
49
50
  }
50
51
  .iui-checkbox-wrapper > .iui-checkbox-label,
@@ -131,6 +132,7 @@
131
132
  --_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m1.70671 12.879 11.17218-11.17219 1.4142 1.4142-11.17218 11.17218zm.99329-1.679 1.1-1.1a5.06317 5.06317 0 0 1 -2-2.1 7.48268 7.48268 0 0 1 6.2-3.5 4.86877 4.86877 0 0 1 1.2.1l1.3-1.3a10.07431 10.07431 0 0 0 -2.5-.3 8.84129 8.84129 0 0 0 -8 5 8.42455 8.42455 0 0 0 2.7 3.2zm10.7-6.4-1.1 1.1a7.08625 7.08625 0 0 1 2 2.1 7.50323 7.50323 0 0 1 -6.2 3.5 8.31665 8.31665 0 0 1 -1.3-.2l-1.3 1.3a8.909 8.909 0 0 0 6.4-.5 9.04344 9.04344 0 0 0 4.1-4.1 9.168 9.168 0 0 0 -2.6-3.2z" /></svg>');
132
133
  --_iui-checkbox-border-color:transparent;
133
134
  --_iui-checkbox-background-color:transparent;
135
+ outline-width:1px;
134
136
  }
135
137
  .iui-checkbox.iui-checkbox-visibility:where(:not(:checked):not(:indeterminate)){
136
138
  --_iui-checkbox-svg-color:var(--iui-color-foreground-2);
package/css/radio.css CHANGED
@@ -45,7 +45,8 @@
45
45
  gap:var(--iui-size-xs);
46
46
  }
47
47
  .iui-radio-wrapper.iui-loading{
48
- cursor:wait;
48
+ cursor:progress;
49
+ font-style:italic;
49
50
  color:var(--iui-color-foreground-4);
50
51
  }
51
52
  .iui-radio-wrapper > .iui-checkbox-label,
@@ -132,6 +133,7 @@
132
133
  --_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m1.70671 12.879 11.17218-11.17219 1.4142 1.4142-11.17218 11.17218zm.99329-1.679 1.1-1.1a5.06317 5.06317 0 0 1 -2-2.1 7.48268 7.48268 0 0 1 6.2-3.5 4.86877 4.86877 0 0 1 1.2.1l1.3-1.3a10.07431 10.07431 0 0 0 -2.5-.3 8.84129 8.84129 0 0 0 -8 5 8.42455 8.42455 0 0 0 2.7 3.2zm10.7-6.4-1.1 1.1a7.08625 7.08625 0 0 1 2 2.1 7.50323 7.50323 0 0 1 -6.2 3.5 8.31665 8.31665 0 0 1 -1.3-.2l-1.3 1.3a8.909 8.909 0 0 0 6.4-.5 9.04344 9.04344 0 0 0 4.1-4.1 9.168 9.168 0 0 0 -2.6-3.2z" /></svg>');
133
134
  --_iui-checkbox-border-color:transparent;
134
135
  --_iui-checkbox-background-color:transparent;
136
+ outline-width:1px;
135
137
  }
136
138
  .iui-radio.iui-checkbox-visibility:where(:not(:checked):not(:indeterminate)){
137
139
  --_iui-checkbox-svg-color:var(--iui-color-foreground-2);
package/css/table.css CHANGED
@@ -189,14 +189,11 @@
189
189
  .iui-table-body .iui-table-row > .iui-slot > .iui-table-more-options{
190
190
  opacity:0;
191
191
  }
192
- .iui-table-body .iui-table-row:where(:hover:not([aria-disabled="true"])) .iui-table-cell{
193
- background-color:var(--iui-color-background-transparent-hover);
194
- }
195
- .iui-table-body .iui-table-row:where(:hover:not([aria-disabled="true"])) > .iui-slot:not([aria-disabled=true]) > .iui-table-more-options{
192
+ .iui-table-body .iui-table-row:where(:hover, :focus-within) > .iui-slot > .iui-table-more-options{
196
193
  opacity:1;
197
194
  }
198
- .iui-table-body .iui-table-row:focus-within > .iui-slot:not([aria-disabled=true]) > .iui-table-more-options{
199
- opacity:1;
195
+ .iui-table-body .iui-table-row:where(:hover:not(.iui-loading):not([aria-disabled="true"])) .iui-table-cell{
196
+ background-color:var(--iui-color-background-transparent-hover);
200
197
  }
201
198
  @media (prefers-reduced-motion: no-preference){
202
199
  .iui-table-body .iui-table-row .iui-table-row-expander > .iui-button-icon{
@@ -280,14 +277,13 @@
280
277
  font-size:var(--iui-font-size-4);
281
278
  color:var(--iui-color-foreground-positive);
282
279
  }
280
+ .iui-table-body .iui-table-row.iui-loading,
283
281
  .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true], .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true]{
284
- font-style:italic;
285
- cursor:not-allowed;
286
282
  color:var(--iui-color-foreground-4);
287
283
  }
288
- .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true].iui-slot:hover > .iui-table-more-options, .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true].iui-slot:hover > .iui-table-more-options{
289
- opacity:0;
290
- }
284
+ .iui-table-body .iui-table-row.iui-loading img,
285
+ .iui-table-body .iui-table-row.iui-loading svg:not(.iui-radial),
286
+ .iui-table-body .iui-table-row.iui-loading .iui-avatar,
291
287
  .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true] img,
292
288
  .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true] svg:not(.iui-radial),
293
289
  .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true] .iui-avatar, .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true] img,
@@ -295,6 +291,16 @@
295
291
  .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true] .iui-avatar{
296
292
  filter:grayscale(100%);
297
293
  }
294
+ .iui-table-body .iui-table-row.iui-loading{
295
+ font-style:italic;
296
+ }
297
+ .iui-table-body .iui-table-row.iui-loading,
298
+ .iui-table-body .iui-table-row.iui-loading .iui-checkbox{
299
+ cursor:progress;
300
+ }
301
+ .iui-table-body .iui-table-row .iui-table-cell[aria-disabled=true], .iui-table-body .iui-table-row.iui-table-expanded-content[aria-disabled=true]{
302
+ cursor:not-allowed;
303
+ }
298
304
  .iui-table-body .iui-table-row[data-iui-status=positive] .iui-table-cell:first-of-type,
299
305
  .iui-table-body .iui-table-row[data-iui-status=positive] + .iui-table-expanded-content{
300
306
  box-shadow:inset var(--iui-size-3xs) 0 0 0 var(--iui-color-foreground-positive);
package/css/tile.css CHANGED
@@ -3,6 +3,8 @@
3
3
  * See LICENSE.md in the project root for license terms and full copyright notice.
4
4
  *--------------------------------------------------------------------------------------------*/
5
5
  .iui-tile{
6
+ --_iui-tile-title-text-color:var(--iui-color-foreground-2);
7
+ --_iui-tile-body-text-color:var(--iui-color-foreground-4);
6
8
  margin:0;
7
9
  padding:0;
8
10
  border:none;
@@ -118,28 +120,27 @@
118
120
  margin-bottom:0;
119
121
  -webkit-line-clamp:2;
120
122
  }
121
- .iui-tile.iui-progress{
122
- cursor:progress;
123
- font-style:italic;
124
- }
125
- .iui-tile[aria-disabled=true]{
126
- cursor:not-allowed;
127
- }
128
- .iui-tile[aria-disabled=true] .iui-tile-name-label{
129
- color:var(--iui-color-foreground-4);
123
+ .iui-tile.iui-loading, .iui-tile[aria-disabled=true]{
124
+ --_iui-tile-title-text-color:var(--iui-color-foreground-4);
130
125
  }
131
- .iui-tile[aria-disabled=true] .iui-thumbnail-icon,
126
+ .iui-tile.iui-loading .iui-thumbnail-icon,
127
+ .iui-tile.iui-loading .iui-tile-thumbnail-picture, .iui-tile[aria-disabled=true] .iui-thumbnail-icon,
132
128
  .iui-tile[aria-disabled=true] .iui-tile-thumbnail-picture{
133
129
  filter:grayscale(100%);
134
130
  }
135
- .iui-tile[aria-disabled=true]:hover .iui-tile-thumbnail-picture, .iui-tile[aria-disabled=true]:focus-within .iui-tile-thumbnail-picture{
131
+ .iui-tile.iui-loading:hover .iui-tile-thumbnail-picture, .iui-tile.iui-loading:focus-within .iui-tile-thumbnail-picture, .iui-tile[aria-disabled=true]:hover .iui-tile-thumbnail-picture, .iui-tile[aria-disabled=true]:focus-within .iui-tile-thumbnail-picture{
136
132
  transform:none;
137
133
  }
138
- .iui-tile[aria-disabled=true] .iui-tile-more-options{
139
- display:none;
134
+ .iui-tile.iui-loading{
135
+ cursor:progress;
136
+ font-style:italic;
137
+ }
138
+ .iui-tile[aria-disabled=true]{
139
+ cursor:not-allowed;
140
140
  }
141
141
  .iui-tile.iui-positive{
142
142
  --_iui-tile-status-icon-fill:var(--iui-color-foreground-positive);
143
+ --_iui-tile-title-text-color:var(--iui-color-foreground-positive);
143
144
  }
144
145
  .iui-tile.iui-positive::-moz-selection, .iui-tile.iui-positive *::-moz-selection{
145
146
  background-color:hsl(var(--iui-color-foreground-positive-hsl)/var(--iui-opacity-5));
@@ -155,11 +156,9 @@
155
156
  box-shadow:var(--iui-size-2xs) 0 0 var(--iui-color-foreground-positive);
156
157
  }
157
158
 
158
- .iui-tile.iui-positive .iui-tile-name-label{
159
- color:var(--iui-color-foreground-positive);
160
- }
161
159
  .iui-tile.iui-warning{
162
160
  --_iui-tile-status-icon-fill:var(--iui-color-foreground-warning);
161
+ --_iui-tile-title-text-color:var(--iui-color-foreground-warning);
163
162
  }
164
163
  .iui-tile.iui-warning::-moz-selection, .iui-tile.iui-warning *::-moz-selection{
165
164
  background-color:hsl(var(--iui-color-foreground-warning-hsl)/var(--iui-opacity-5));
@@ -175,11 +174,9 @@
175
174
  box-shadow:var(--iui-size-2xs) 0 0 var(--iui-color-foreground-warning);
176
175
  }
177
176
 
178
- .iui-tile.iui-warning .iui-tile-name-label{
179
- color:var(--iui-color-foreground-warning);
180
- }
181
177
  .iui-tile.iui-negative{
182
178
  --_iui-tile-status-icon-fill:var(--iui-color-foreground-negative);
179
+ --_iui-tile-title-text-color:var(--iui-color-foreground-negative);
183
180
  }
184
181
  .iui-tile.iui-negative::-moz-selection, .iui-tile.iui-negative *::-moz-selection{
185
182
  background-color:hsl(var(--iui-color-foreground-negative-hsl)/var(--iui-opacity-5));
@@ -195,10 +192,6 @@
195
192
  box-shadow:var(--iui-size-2xs) 0 0 var(--iui-color-foreground-negative);
196
193
  }
197
194
 
198
- .iui-tile.iui-negative .iui-tile-name-label{
199
- color:var(--iui-color-foreground-negative);
200
- }
201
-
202
195
  .iui-tile-thumbnail-type-indicator{
203
196
  --_iui-button-text-color:var(--iui-color-foreground-2);
204
197
  --_iui-button-background-color:transparent;
@@ -420,7 +413,7 @@ div.iui-tile-thumbnail-picture{
420
413
  -moz-user-select:all;
421
414
  user-select:all;
422
415
  margin-bottom:calc(var(--iui-size-s) * 0.5);
423
- color:var(--iui-color-foreground-2);
416
+ color:var(--_iui-tile-title-text-color);
424
417
  }
425
418
  .iui-tile-content .iui-tile-status-icon{
426
419
  display:flex;
@@ -445,7 +438,7 @@ div.iui-tile-thumbnail-picture{
445
438
  display:-webkit-box;
446
439
  -webkit-line-clamp:3;
447
440
  -webkit-box-orient:vertical;
448
- color:var(--iui-color-foreground-4);
441
+ color:var(--_iui-tile-body-text-color);
449
442
  }
450
443
  .iui-tile-content .iui-tile-metadata{
451
444
  font-size:var(--iui-font-size-0);
@@ -457,7 +450,7 @@ div.iui-tile-thumbnail-picture{
457
450
  display:flex;
458
451
  align-items:center;
459
452
  margin-top:auto;
460
- color:var(--iui-color-foreground-4);
453
+ color:var(--_iui-tile-body-text-color);
461
454
  }
462
455
  .iui-tile-content .iui-tile-metadata > svg,
463
456
  .iui-tile-content .iui-tile-metadata .iui-tile-metadata-icon{
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@itwin/itwinui-css",
3
- "version": "1.0.0-dev.4",
3
+ "version": "1.0.0-dev.6",
4
4
  "author": "Bentley Systems",
5
5
  "license": "MIT",
6
6
  "main": "css/all.css",