@itwin/itwinui-css 1.0.0-dev.0 → 1.0.0-dev.1

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 (239) hide show
  1. package/CHANGELOG.md +26 -0
  2. package/css/alert.css +16 -27
  3. package/css/all.css +723 -817
  4. package/css/avatar.css +1 -1
  5. package/css/blockquote.css +2 -2
  6. package/css/breadcrumbs.css +19 -13
  7. package/css/button.css +30 -56
  8. package/css/carousel.css +5 -4
  9. package/css/checkbox.css +10 -7
  10. package/css/code.css +1 -0
  11. package/css/color-picker.css +10 -10
  12. package/css/date-picker.css +1 -1
  13. package/css/dialog.css +12 -9
  14. package/css/expandable-block.css +8 -19
  15. package/css/fieldset.css +2 -2
  16. package/css/file-upload.css +11 -20
  17. package/css/footer.css +28 -28
  18. package/css/global.css +65 -65
  19. package/css/header.css +12 -6
  20. package/css/information-panel.css +12 -7
  21. package/css/input.css +18 -10
  22. package/css/location-marker.css +8 -2
  23. package/css/menu.css +14 -7
  24. package/css/non-ideal-state.css +5 -5
  25. package/css/progress-indicator.css +10 -6
  26. package/css/radio-tile.css +19 -10
  27. package/css/radio.css +10 -7
  28. package/css/select.css +25 -19
  29. package/css/side-navigation.css +14 -19
  30. package/css/skip-to-content.css +2 -2
  31. package/css/slider.css +108 -40
  32. package/css/stepper.css +4 -4
  33. package/css/table.css +28 -28
  34. package/css/tabs.css +17 -10
  35. package/css/tag.css +5 -5
  36. package/css/text.css +7 -7
  37. package/css/tile.css +45 -69
  38. package/css/time-picker.css +3 -3
  39. package/css/toast.css +13 -11
  40. package/css/toggle-switch.css +5 -5
  41. package/css/tree.css +13 -20
  42. package/css/utils.css +104 -44
  43. package/css/workflow-diagram.css +1 -1
  44. package/package.json +8 -11
  45. package/css/icon.css +0 -117
  46. package/css/textarea.css +0 -96
  47. package/scss/alert/alert.scss +0 -89
  48. package/scss/alert/classes.scss +0 -33
  49. package/scss/alert/index.scss +0 -3
  50. package/scss/anchor/anchor.scss +0 -78
  51. package/scss/anchor/classes.scss +0 -11
  52. package/scss/anchor/index.scss +0 -3
  53. package/scss/avatar/avatar-sizes.scss +0 -23
  54. package/scss/avatar/avatar.scss +0 -215
  55. package/scss/avatar/classes.scss +0 -27
  56. package/scss/avatar/index.scss +0 -3
  57. package/scss/backdrop/backdrop.scss +0 -27
  58. package/scss/backdrop/classes.scss +0 -7
  59. package/scss/backdrop/index.scss +0 -3
  60. package/scss/badge/badge.scss +0 -34
  61. package/scss/badge/classes.scss +0 -7
  62. package/scss/badge/index.scss +0 -3
  63. package/scss/blockquote/blockquote.scss +0 -26
  64. package/scss/blockquote/classes.scss +0 -7
  65. package/scss/blockquote/index.scss +0 -3
  66. package/scss/breadcrumbs/breadcrumbs.scss +0 -119
  67. package/scss/breadcrumbs/classes.scss +0 -31
  68. package/scss/breadcrumbs/index.scss +0 -3
  69. package/scss/button/borderless.scss +0 -36
  70. package/scss/button/button-group.scss +0 -118
  71. package/scss/button/button.scss +0 -119
  72. package/scss/button/classes.scss +0 -80
  73. package/scss/button/default.scss +0 -51
  74. package/scss/button/idea.scss +0 -12
  75. package/scss/button/index.scss +0 -9
  76. package/scss/button/split-button.scss +0 -45
  77. package/scss/button/variant.scss +0 -44
  78. package/scss/carousel/carousel.scss +0 -113
  79. package/scss/carousel/classes.scss +0 -15
  80. package/scss/carousel/index.scss +0 -3
  81. package/scss/checkbox/checkbox.scss +0 -154
  82. package/scss/checkbox/classes.scss +0 -7
  83. package/scss/checkbox/index.scss +0 -3
  84. package/scss/classes.scss +0 -52
  85. package/scss/code/classes.scss +0 -11
  86. package/scss/code/code.scss +0 -16
  87. package/scss/code/codeblock.scss +0 -59
  88. package/scss/code/index.scss +0 -4
  89. package/scss/color-picker/classes.scss +0 -43
  90. package/scss/color-picker/color-picker.scss +0 -241
  91. package/scss/color-picker/index.scss +0 -3
  92. package/scss/date-picker/classes.scss +0 -47
  93. package/scss/date-picker/date-picker.scss +0 -246
  94. package/scss/date-picker/index.scss +0 -3
  95. package/scss/dialog/classes.scss +0 -48
  96. package/scss/dialog/dialog.scss +0 -178
  97. package/scss/dialog/index.scss +0 -3
  98. package/scss/expandable-block/block.scss +0 -165
  99. package/scss/expandable-block/classes.scss +0 -7
  100. package/scss/expandable-block/index.scss +0 -3
  101. package/scss/fieldset/classes.scss +0 -7
  102. package/scss/fieldset/fieldset.scss +0 -29
  103. package/scss/fieldset/index.scss +0 -3
  104. package/scss/file-upload/classes.scss +0 -7
  105. package/scss/file-upload/file-upload.scss +0 -80
  106. package/scss/file-upload/index.scss +0 -3
  107. package/scss/footer/classes.scss +0 -7
  108. package/scss/footer/footer.scss +0 -55
  109. package/scss/footer/index.scss +0 -3
  110. package/scss/header/classes.scss +0 -79
  111. package/scss/header/header-buttons.scss +0 -316
  112. package/scss/header/header.scss +0 -75
  113. package/scss/header/index.scss +0 -4
  114. package/scss/icon/classes.scss +0 -27
  115. package/scss/icon/icon.scss +0 -65
  116. package/scss/icon/index.scss +0 -3
  117. package/scss/index.scss +0 -50
  118. package/scss/information-panel/classes.scss +0 -27
  119. package/scss/information-panel/index.scss +0 -3
  120. package/scss/information-panel/information-panel.scss +0 -215
  121. package/scss/input/classes.scss +0 -15
  122. package/scss/input/index.scss +0 -4
  123. package/scss/input/input-with-icon.scss +0 -37
  124. package/scss/input/input.scss +0 -70
  125. package/scss/keyboard/classes.scss +0 -7
  126. package/scss/keyboard/index.scss +0 -3
  127. package/scss/keyboard/keyboard.scss +0 -29
  128. package/scss/location-marker/classes.scss +0 -15
  129. package/scss/location-marker/data-rich.scss +0 -49
  130. package/scss/location-marker/default.scss +0 -19
  131. package/scss/location-marker/index.scss +0 -6
  132. package/scss/location-marker/location-marker.scss +0 -11
  133. package/scss/location-marker/me.scss +0 -29
  134. package/scss/menu/classes.scss +0 -21
  135. package/scss/menu/index.scss +0 -3
  136. package/scss/menu/menu.scss +0 -185
  137. package/scss/non-ideal-state/classes.scss +0 -7
  138. package/scss/non-ideal-state/index.scss +0 -3
  139. package/scss/non-ideal-state/non-ideal-state.scss +0 -56
  140. package/scss/progress-indicator/classes.scss +0 -31
  141. package/scss/progress-indicator/index.scss +0 -5
  142. package/scss/progress-indicator/linear.scss +0 -108
  143. package/scss/progress-indicator/overlay.scss +0 -51
  144. package/scss/progress-indicator/radial.scss +0 -155
  145. package/scss/radio/classes.scss +0 -7
  146. package/scss/radio/index.scss +0 -3
  147. package/scss/radio/radio.scss +0 -18
  148. package/scss/radio-tile/classes.scss +0 -31
  149. package/scss/radio-tile/index.scss +0 -3
  150. package/scss/radio-tile/radio-tile.scss +0 -167
  151. package/scss/select/classes.scss +0 -27
  152. package/scss/select/index.scss +0 -3
  153. package/scss/select/select.scss +0 -124
  154. package/scss/side-navigation/classes.scss +0 -15
  155. package/scss/side-navigation/index.scss +0 -3
  156. package/scss/side-navigation/side-navigation.scss +0 -202
  157. package/scss/skip-to-content/classes.scss +0 -7
  158. package/scss/skip-to-content/index.scss +0 -3
  159. package/scss/skip-to-content/skip-to-content.scss +0 -40
  160. package/scss/slider/classes.scss +0 -27
  161. package/scss/slider/index.scss +0 -3
  162. package/scss/slider/slider.scss +0 -135
  163. package/scss/stepper/classes.scss +0 -32
  164. package/scss/stepper/index.scss +0 -3
  165. package/scss/stepper/stepper.scss +0 -151
  166. package/scss/style/baseline.scss +0 -4
  167. package/scss/style/color.scss +0 -39
  168. package/scss/style/elevation.scss +0 -11
  169. package/scss/style/global-variables.scss +0 -23
  170. package/scss/style/global.scss +0 -69
  171. package/scss/style/icon-sizes.scss +0 -14
  172. package/scss/style/index.scss +0 -11
  173. package/scss/style/space.scss +0 -11
  174. package/scss/style/speed.scss +0 -8
  175. package/scss/style/theme.scss +0 -443
  176. package/scss/style/typography.scss +0 -55
  177. package/scss/surface/classes.scss +0 -7
  178. package/scss/surface/index.scss +0 -3
  179. package/scss/surface/surface.scss +0 -17
  180. package/scss/table/classes.scss +0 -64
  181. package/scss/table/column-filter.scss +0 -34
  182. package/scss/table/index.scss +0 -6
  183. package/scss/table/paginator.scss +0 -79
  184. package/scss/table/sizes.scss +0 -31
  185. package/scss/table/table-densities.scss +0 -11
  186. package/scss/table/table.scss +0 -482
  187. package/scss/tabs/borderless.scss +0 -59
  188. package/scss/tabs/classes.scss +0 -44
  189. package/scss/tabs/default.scss +0 -89
  190. package/scss/tabs/index.scss +0 -6
  191. package/scss/tabs/pill.scss +0 -38
  192. package/scss/tabs/tabs.scss +0 -192
  193. package/scss/tag/classes.scss +0 -30
  194. package/scss/tag/index.scss +0 -3
  195. package/scss/tag/tag.scss +0 -89
  196. package/scss/text/classes.scss +0 -40
  197. package/scss/text/index.scss +0 -5
  198. package/scss/text/mixins.scss +0 -43
  199. package/scss/text/muted.scss +0 -7
  200. package/scss/text/skeleton.scss +0 -43
  201. package/scss/textarea/classes.scss +0 -7
  202. package/scss/textarea/index.scss +0 -3
  203. package/scss/textarea/textarea.scss +0 -15
  204. package/scss/tile/classes.scss +0 -51
  205. package/scss/tile/index.scss +0 -3
  206. package/scss/tile/tile.scss +0 -340
  207. package/scss/time-picker/classes.scss +0 -16
  208. package/scss/time-picker/index.scss +0 -3
  209. package/scss/time-picker/time-picker.scss +0 -63
  210. package/scss/toast/categories.scss +0 -22
  211. package/scss/toast/classes.scss +0 -98
  212. package/scss/toast/index.scss +0 -4
  213. package/scss/toast/toast.scss +0 -70
  214. package/scss/toggle-switch/classes.scss +0 -11
  215. package/scss/toggle-switch/index.scss +0 -3
  216. package/scss/toggle-switch/toggle-switch.scss +0 -203
  217. package/scss/tooltip/classes.scss +0 -24
  218. package/scss/tooltip/index.scss +0 -3
  219. package/scss/tooltip/tooltip.scss +0 -40
  220. package/scss/tree/classes.scss +0 -19
  221. package/scss/tree/index.scss +0 -3
  222. package/scss/tree/tree.scss +0 -126
  223. package/scss/utils/classes.scss +0 -6
  224. package/scss/utils/index.scss +0 -6
  225. package/scss/utils/input-container/classes.scss +0 -39
  226. package/scss/utils/input-container/index.scss +0 -3
  227. package/scss/utils/input-container/input-container.scss +0 -285
  228. package/scss/utils/mixins.scss +0 -171
  229. package/scss/utils/notification-marker/classes.scss +0 -9
  230. package/scss/utils/notification-marker/index.scss +0 -3
  231. package/scss/utils/notification-marker/notification-marker.scss +0 -55
  232. package/scss/utils/popover/classes.scss +0 -7
  233. package/scss/utils/popover/index.scss +0 -3
  234. package/scss/utils/popover/popover.scss +0 -21
  235. package/scss/variables.scss +0 -3
  236. package/scss/workflow-diagram/classes.scss +0 -15
  237. package/scss/workflow-diagram/index.scss +0 -3
  238. package/scss/workflow-diagram/workflow-diagram.scss +0 -64
  239. package/src/index.scss +0 -50
@@ -40,28 +40,19 @@
40
40
  }
41
41
  .iui-file-upload > .iui-content > svg,
42
42
  .iui-file-upload > .iui-content .iui-template-icon{
43
- fill:var(--iui-icons-color);
44
- display:inline-flex;
43
+ display:flex;
44
+ flex-shrink:0;
45
45
  width:64px;
46
46
  height:64px;
47
- margin-top:11px;
48
- margin-bottom:11px;
49
- }
50
- .iui-file-upload > .iui-content > svg.iui-informational,
51
- .iui-file-upload > .iui-content .iui-template-icon.iui-informational{
52
- fill:var(--iui-icons-color-primary);
53
- }
54
- .iui-file-upload > .iui-content > svg.iui-positive,
55
- .iui-file-upload > .iui-content .iui-template-icon.iui-positive{
56
- fill:var(--iui-icons-color-positive);
47
+ fill:var(--iui-icon-color);
48
+ margin-top:12px;
49
+ margin-bottom:12px;
57
50
  }
58
- .iui-file-upload > .iui-content > svg.iui-warning,
59
- .iui-file-upload > .iui-content .iui-template-icon.iui-warning{
60
- fill:var(--iui-icons-color-warning);
61
- }
62
- .iui-file-upload > .iui-content > svg.iui-negative,
63
- .iui-file-upload > .iui-content .iui-template-icon.iui-negative{
64
- fill:var(--iui-icons-color-negative);
51
+ @media (forced-colors: active){
52
+ .iui-file-upload > .iui-content > svg,
53
+ .iui-file-upload > .iui-content .iui-template-icon{
54
+ fill:CanvasText;
55
+ }
65
56
  }
66
57
  .iui-file-upload > .iui-content:only-child{
67
58
  visibility:visible;
@@ -86,5 +77,5 @@
86
77
  }
87
78
  .iui-file-upload.iui-drag > .iui-content > svg,
88
79
  .iui-file-upload.iui-drag > .iui-content .iui-template-icon{
89
- fill:var(--iui-icons-color-primary);
80
+ fill:var(--iui-icon-color-primary);
90
81
  }
package/css/footer.css CHANGED
@@ -9,10 +9,11 @@
9
9
  vertical-align:baseline;
10
10
  text-align:center;
11
11
  width:100%;
12
- padding:11px 0;
12
+ padding:12px 0;
13
13
  font-size:12px;
14
14
  }
15
- .iui-legal-footer > ul{
15
+
16
+ .iui-legal-footer-list{
16
17
  list-style-type:none;
17
18
  margin:0 auto;
18
19
  padding:0;
@@ -21,8 +22,10 @@
21
22
  align-items:center;
22
23
  flex-wrap:wrap;
23
24
  }
24
- .iui-legal-footer > ul > li{
25
- display:inline-block;
25
+
26
+ .iui-legal-footer-item{
27
+ display:flex;
28
+ align-items:center;
26
29
  -webkit-user-select:none;
27
30
  -moz-user-select:none;
28
31
  -ms-user-select:none;
@@ -31,65 +34,62 @@
31
34
  word-break:keep-all;
32
35
  color:var(--iui-text-color-muted);
33
36
  }
34
- .iui-legal-footer > ul > li .iui-separator{
35
- margin:0 8px;
36
- width:1px;
37
- height:11px;
38
- display:inline-table;
39
- background-color:var(--iui-text-color-muted);
40
- }
41
- .iui-legal-footer > ul > li > a{
37
+ .iui-legal-footer-item > a{
42
38
  color:var(--iui-color-foreground-primary);
43
39
  -webkit-tap-highlight-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-5));
44
40
  border-radius:4px;
45
41
  cursor:pointer;
46
42
  text-decoration:none;
47
43
  }
48
- .iui-legal-footer > ul > li > a:focus-visible{
44
+ .iui-legal-footer-item > a:focus-visible{
49
45
  outline:1px solid var(--iui-color-foreground-primary);
50
46
  outline-offset:1px;
51
47
  }
52
48
  @supports not selector(*:focus-visible){
53
- .iui-legal-footer > ul > li > a:focus{
49
+ .iui-legal-footer-item > a:focus{
54
50
  outline:1px solid var(--iui-color-foreground-primary);
55
51
  outline-offset:1px;
56
52
  }
57
53
  }
58
- .iui-legal-footer > ul > li > a:hover{
54
+ .iui-legal-footer-item > a:hover{
59
55
  color:var(--iui-color-foreground-primary-overlay);
60
56
  }
61
- .iui-legal-footer > ul > li > a:hover{
57
+ .iui-legal-footer-item > a:hover{
62
58
  text-decoration:underline;
63
59
  }
64
60
  @media (prefers-contrast: more){
65
- .iui-legal-footer > ul > li > a{
61
+ .iui-legal-footer-item > a{
66
62
  text-decoration:underline;
67
63
  }
68
- .iui-legal-footer > ul > li > a:hover{
64
+ .iui-legal-footer-item > a:hover{
69
65
  text-decoration:none;
70
66
  }
71
67
  }
72
- .iui-theme-light .iui-legal-footer > ul > li > a, .iui-theme-dark .iui-legal-footer > ul > li > a{
68
+ .iui-theme-light .iui-legal-footer-item > a, .iui-theme-dark .iui-legal-footer-item > a{
73
69
  text-decoration:none;
74
70
  }
75
- .iui-theme-light .iui-legal-footer > ul > li > a:hover, .iui-theme-dark .iui-legal-footer > ul > li > a:hover{
71
+ .iui-theme-light .iui-legal-footer-item > a:hover, .iui-theme-dark .iui-legal-footer-item > a:hover{
76
72
  text-decoration:underline;
77
73
  }
78
74
 
79
- .iui-theme-light-hc .iui-legal-footer > ul > li > a, .iui-theme-dark-hc .iui-legal-footer > ul > li > a{
75
+ .iui-theme-light-hc .iui-legal-footer-item > a, .iui-theme-dark-hc .iui-legal-footer-item > a{
80
76
  text-decoration:underline;
81
77
  }
82
- .iui-theme-light-hc .iui-legal-footer > ul > li > a:hover, .iui-theme-dark-hc .iui-legal-footer > ul > li > a:hover{
78
+ .iui-theme-light-hc .iui-legal-footer-item > a:hover, .iui-theme-dark-hc .iui-legal-footer-item > a:hover{
83
79
  text-decoration:none;
84
80
  }
85
81
 
86
- .iui-legal-footer > ul > li > a, .iui-legal-footer > ul > li > a:hover{
82
+ .iui-legal-footer-item > a, .iui-legal-footer-item > a:hover{
87
83
  color:var(--iui-text-color-muted);
88
84
  }
89
- .iui-legal-footer > .iui-legal-footer-developer{
90
- display:block;
91
- -webkit-user-select:all;
92
- -moz-user-select:all;
93
- user-select:all;
85
+
86
+ .iui-legal-footer-separator{
87
+ margin:0 8px;
88
+ width:1px;
89
+ height:12px;
90
+ background-color:var(--iui-text-color-muted);
91
+ }
92
+
93
+ .iui-legal-footer-developer{
94
94
  color:var(--iui-text-color-muted);
95
95
  }
package/css/global.css CHANGED
@@ -62,14 +62,14 @@ html{
62
62
  --iui-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
63
63
  --iui-text-color-muted:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
64
64
  --iui-text-color-placeholder:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
65
- --iui-icons-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
66
- --iui-icons-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
67
- --iui-icons-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
68
- --iui-icons-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
69
- --iui-icons-color-primary:var(--iui-color-foreground-primary);
70
- --iui-icons-color-positive:var(--iui-color-foreground-positive);
71
- --iui-icons-color-warning:var(--iui-color-foreground-warning);
72
- --iui-icons-color-negative:var(--iui-color-foreground-negative);
65
+ --iui-icon-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
66
+ --iui-icon-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
67
+ --iui-icon-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
68
+ --iui-icon-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
69
+ --iui-icon-color-primary:var(--iui-color-foreground-primary);
70
+ --iui-icon-color-positive:var(--iui-color-foreground-positive);
71
+ --iui-icon-color-warning:var(--iui-color-foreground-warning);
72
+ --iui-icon-color-negative:var(--iui-color-foreground-negative);
73
73
  }
74
74
  @media (prefers-color-scheme: dark){
75
75
  html{
@@ -132,14 +132,14 @@ html{
132
132
  --iui-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
133
133
  --iui-text-color-muted:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
134
134
  --iui-text-color-placeholder:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
135
- --iui-icons-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
136
- --iui-icons-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
137
- --iui-icons-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
138
- --iui-icons-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
139
- --iui-icons-color-primary:var(--iui-color-foreground-primary);
140
- --iui-icons-color-positive:var(--iui-color-foreground-positive);
141
- --iui-icons-color-warning:var(--iui-color-foreground-warning);
142
- --iui-icons-color-negative:var(--iui-color-foreground-negative);
135
+ --iui-icon-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
136
+ --iui-icon-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
137
+ --iui-icon-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
138
+ --iui-icon-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
139
+ --iui-icon-color-primary:var(--iui-color-foreground-primary);
140
+ --iui-icon-color-positive:var(--iui-color-foreground-positive);
141
+ --iui-icon-color-warning:var(--iui-color-foreground-warning);
142
+ --iui-icon-color-negative:var(--iui-color-foreground-negative);
143
143
  }
144
144
  }
145
145
  @media (prefers-color-scheme: light) and (prefers-contrast: more){
@@ -200,14 +200,14 @@ html{
200
200
  --iui-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
201
201
  --iui-text-color-muted:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
202
202
  --iui-text-color-placeholder:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
203
- --iui-icons-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
204
- --iui-icons-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
205
- --iui-icons-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
206
- --iui-icons-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
207
- --iui-icons-color-primary:var(--iui-color-foreground-primary);
208
- --iui-icons-color-positive:var(--iui-color-foreground-positive);
209
- --iui-icons-color-warning:var(--iui-color-foreground-warning);
210
- --iui-icons-color-negative:var(--iui-color-foreground-negative);
203
+ --iui-icon-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
204
+ --iui-icon-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
205
+ --iui-icon-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
206
+ --iui-icon-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
207
+ --iui-icon-color-primary:var(--iui-color-foreground-primary);
208
+ --iui-icon-color-positive:var(--iui-color-foreground-positive);
209
+ --iui-icon-color-warning:var(--iui-color-foreground-warning);
210
+ --iui-icon-color-negative:var(--iui-color-foreground-negative);
211
211
  }
212
212
  }
213
213
  @media (prefers-color-scheme: dark) and (prefers-contrast: more){
@@ -268,14 +268,14 @@ html{
268
268
  --iui-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
269
269
  --iui-text-color-muted:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
270
270
  --iui-text-color-placeholder:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
271
- --iui-icons-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
272
- --iui-icons-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
273
- --iui-icons-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
274
- --iui-icons-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
275
- --iui-icons-color-primary:var(--iui-color-foreground-primary);
276
- --iui-icons-color-positive:var(--iui-color-foreground-positive);
277
- --iui-icons-color-warning:var(--iui-color-foreground-warning);
278
- --iui-icons-color-negative:var(--iui-color-foreground-negative);
271
+ --iui-icon-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
272
+ --iui-icon-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
273
+ --iui-icon-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
274
+ --iui-icon-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
275
+ --iui-icon-color-primary:var(--iui-color-foreground-primary);
276
+ --iui-icon-color-positive:var(--iui-color-foreground-positive);
277
+ --iui-icon-color-warning:var(--iui-color-foreground-warning);
278
+ --iui-icon-color-negative:var(--iui-color-foreground-negative);
279
279
  }
280
280
  }
281
281
  html.iui-theme-light{
@@ -338,14 +338,14 @@ html.iui-theme-light{
338
338
  --iui-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
339
339
  --iui-text-color-muted:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
340
340
  --iui-text-color-placeholder:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
341
- --iui-icons-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
342
- --iui-icons-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
343
- --iui-icons-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
344
- --iui-icons-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
345
- --iui-icons-color-primary:var(--iui-color-foreground-primary);
346
- --iui-icons-color-positive:var(--iui-color-foreground-positive);
347
- --iui-icons-color-warning:var(--iui-color-foreground-warning);
348
- --iui-icons-color-negative:var(--iui-color-foreground-negative);
341
+ --iui-icon-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
342
+ --iui-icon-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
343
+ --iui-icon-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
344
+ --iui-icon-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
345
+ --iui-icon-color-primary:var(--iui-color-foreground-primary);
346
+ --iui-icon-color-positive:var(--iui-color-foreground-positive);
347
+ --iui-icon-color-warning:var(--iui-color-foreground-warning);
348
+ --iui-icon-color-negative:var(--iui-color-foreground-negative);
349
349
  }
350
350
  html.iui-theme-dark{
351
351
  --iui-color-background-1-rgb:90, 104, 114;
@@ -407,14 +407,14 @@ html.iui-theme-dark{
407
407
  --iui-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
408
408
  --iui-text-color-muted:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
409
409
  --iui-text-color-placeholder:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
410
- --iui-icons-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
411
- --iui-icons-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
412
- --iui-icons-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
413
- --iui-icons-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
414
- --iui-icons-color-primary:var(--iui-color-foreground-primary);
415
- --iui-icons-color-positive:var(--iui-color-foreground-positive);
416
- --iui-icons-color-warning:var(--iui-color-foreground-warning);
417
- --iui-icons-color-negative:var(--iui-color-foreground-negative);
410
+ --iui-icon-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
411
+ --iui-icon-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
412
+ --iui-icon-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
413
+ --iui-icon-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
414
+ --iui-icon-color-primary:var(--iui-color-foreground-primary);
415
+ --iui-icon-color-positive:var(--iui-color-foreground-positive);
416
+ --iui-icon-color-warning:var(--iui-color-foreground-warning);
417
+ --iui-icon-color-negative:var(--iui-color-foreground-negative);
418
418
  }
419
419
  html.iui-theme-light-hc{
420
420
  --iui-color-background-1-rgb:255, 255, 255;
@@ -473,14 +473,14 @@ html.iui-theme-light-hc{
473
473
  --iui-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
474
474
  --iui-text-color-muted:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
475
475
  --iui-text-color-placeholder:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
476
- --iui-icons-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
477
- --iui-icons-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
478
- --iui-icons-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
479
- --iui-icons-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
480
- --iui-icons-color-primary:var(--iui-color-foreground-primary);
481
- --iui-icons-color-positive:var(--iui-color-foreground-positive);
482
- --iui-icons-color-warning:var(--iui-color-foreground-warning);
483
- --iui-icons-color-negative:var(--iui-color-foreground-negative);
476
+ --iui-icon-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
477
+ --iui-icon-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
478
+ --iui-icon-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
479
+ --iui-icon-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
480
+ --iui-icon-color-primary:var(--iui-color-foreground-primary);
481
+ --iui-icon-color-positive:var(--iui-color-foreground-positive);
482
+ --iui-icon-color-warning:var(--iui-color-foreground-warning);
483
+ --iui-icon-color-negative:var(--iui-color-foreground-negative);
484
484
  }
485
485
  html.iui-theme-dark-hc{
486
486
  --iui-color-background-1-rgb:45, 53, 57;
@@ -539,21 +539,21 @@ html.iui-theme-dark-hc{
539
539
  --iui-text-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
540
540
  --iui-text-color-muted:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
541
541
  --iui-text-color-placeholder:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
542
- --iui-icons-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
543
- --iui-icons-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
544
- --iui-icons-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
545
- --iui-icons-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
546
- --iui-icons-color-primary:var(--iui-color-foreground-primary);
547
- --iui-icons-color-positive:var(--iui-color-foreground-positive);
548
- --iui-icons-color-warning:var(--iui-color-foreground-warning);
549
- --iui-icons-color-negative:var(--iui-color-foreground-negative);
542
+ --iui-icon-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
543
+ --iui-icon-color-actionable:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
544
+ --iui-icon-color-actionable-hover:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-1));
545
+ --iui-icon-color-actionable-disabled:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
546
+ --iui-icon-color-primary:var(--iui-color-foreground-primary);
547
+ --iui-icon-color-positive:var(--iui-color-foreground-positive);
548
+ --iui-icon-color-warning:var(--iui-color-foreground-warning);
549
+ --iui-icon-color-negative:var(--iui-color-foreground-negative);
550
550
  }
551
551
 
552
552
  .iui-body{
553
553
  background-color:var(--iui-color-background-2);
554
554
  color:var(--iui-text-color);
555
555
  font-size:14px;
556
- line-height:22px;
556
+ line-height:24px;
557
557
  scrollbar-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4)) transparent;
558
558
  scrollbar-width:thin;
559
559
  font-family:"Noto Sans", "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;
package/css/header.css CHANGED
@@ -4,7 +4,7 @@
4
4
  *--------------------------------------------------------------------------------------------*/
5
5
  .iui-page-header{
6
6
  --_iui-header-brand-label-font-size:16px;
7
- --_iui-header-height:55px;
7
+ --_iui-header-height:60px;
8
8
  --_iui-header-icon-scale:none;
9
9
  margin:0;
10
10
  padding:0;
@@ -30,7 +30,7 @@
30
30
  }
31
31
  .iui-page-header[data-iui-size=slim]{
32
32
  --_iui-header-brand-label-font-size:14px;
33
- --_iui-header-height:33px;
33
+ --_iui-header-height:36px;
34
34
  --_iui-header-icon-scale:scale(0.66666);
35
35
  }
36
36
 
@@ -60,7 +60,7 @@
60
60
  }
61
61
 
62
62
  .iui-page-header-divider{
63
- height:22px;
63
+ height:24px;
64
64
  border-left:1px solid var(--iui-color-background-border);
65
65
  }
66
66
  @media (forced-colors: active){
@@ -131,10 +131,12 @@ a.iui-header-brand{
131
131
  }
132
132
 
133
133
  .iui-header-brand-icon{
134
+ display:flex;
135
+ flex-shrink:0;
134
136
  width:24px;
135
137
  height:24px;
136
138
  margin:0 24px;
137
- fill:var(--iui-icons-color-actionable);
139
+ fill:var(--iui-icon-color-actionable);
138
140
  will-change:transform;
139
141
  transform:var(--_iui-header-icon-scale);
140
142
  }
@@ -304,6 +306,8 @@ a.iui-header-brand{
304
306
  }
305
307
 
306
308
  .iui-header-breadcrumb-button-icon{
309
+ display:flex;
310
+ flex-shrink:0;
307
311
  width:24px;
308
312
  height:24px;
309
313
  background-color:var(--iui-color-background-3);
@@ -312,7 +316,7 @@ a.iui-header-brand{
312
316
  flex-shrink:0;
313
317
  box-sizing:border-box;
314
318
  padding:4px;
315
- fill:var(--iui-icons-color);
319
+ fill:var(--iui-icon-color);
316
320
  will-change:transform;
317
321
  transform:var(--_iui-header-icon-scale);
318
322
  }
@@ -356,7 +360,7 @@ div.iui-header-breadcrumb-button-icon{
356
360
 
357
361
  :disabled .iui-header-breadcrumb-button-icon, [aria-disabled=true] .iui-header-breadcrumb-button-icon{
358
362
  background-color:var(--iui-color-background-2);
359
- fill:var(--iui-icons-color-actionable-disabled);
363
+ fill:var(--iui-icon-color-actionable-disabled);
360
364
  }
361
365
  @media (forced-colors: active){
362
366
  :disabled .iui-header-breadcrumb-button-icon, [aria-disabled=true] .iui-header-breadcrumb-button-icon{
@@ -378,6 +382,8 @@ div.iui-header-breadcrumb-button-icon{
378
382
  }
379
383
 
380
384
  .iui-header-breadcrumb-button-dropdown-icon{
385
+ display:flex;
386
+ flex-shrink:0;
381
387
  width:16px;
382
388
  height:16px;
383
389
  fill:currentColor;
@@ -39,7 +39,7 @@
39
39
  padding-right:12px;
40
40
  }
41
41
  .iui-information-panel .iui-information-header{
42
- height:55px;
42
+ height:60px;
43
43
  flex-shrink:0;
44
44
  display:flex;
45
45
  align-items:center;
@@ -61,19 +61,24 @@
61
61
  }
62
62
  .iui-information-panel .iui-information-header .iui-information-header-label svg{
63
63
  display:flex;
64
+ flex-shrink:0;
64
65
  width:24px;
65
66
  height:24px;
67
+ fill:var(--iui-icon-color);
66
68
  margin-right:8px;
67
- flex-shrink:0;
68
- fill:var(--iui-icons-color);
69
+ }
70
+ @media (forced-colors: active){
71
+ .iui-information-panel .iui-information-header .iui-information-header-label svg{
72
+ fill:CanvasText;
73
+ }
69
74
  }
70
75
  .iui-information-panel .iui-information-header .iui-information-header-actions{
71
76
  flex-shrink:0;
72
77
  margin-left:8px;
73
78
  }
74
79
  .iui-information-panel .iui-information-body{
75
- padding-top:11px;
76
- padding-bottom:11px;
80
+ padding-top:12px;
81
+ padding-bottom:12px;
77
82
  height:100%;
78
83
  overflow-x:hidden;
79
84
  overflow-y:auto;
@@ -170,10 +175,10 @@
170
175
  color:var(--iui-text-color-muted);
171
176
  }
172
177
  .iui-information-body-content:not(.iui-inline) > *:nth-child(even):not(:last-child){
173
- margin-bottom:11px;
178
+ margin-bottom:12px;
174
179
  }
175
180
  .iui-information-body-content.iui-inline{
176
- row-gap:11px;
181
+ row-gap:12px;
177
182
  grid-template-columns:auto 1fr;
178
183
  align-items:center;
179
184
  }
package/css/input.css CHANGED
@@ -11,13 +11,13 @@
11
11
  font-family:inherit;
12
12
  font-size:14px;
13
13
  font-weight:400;
14
- line-height:22px;
14
+ line-height:24px;
15
15
  border-radius:4px;
16
16
  -webkit-appearance:none;
17
17
  -moz-appearance:none;
18
18
  appearance:none;
19
19
  padding:7px 12px;
20
- min-height:38px;
20
+ min-height:40px;
21
21
  color:var(--iui-text-color);
22
22
  background-color:var(--iui-color-background-1);
23
23
  border:1px solid rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
@@ -38,14 +38,14 @@
38
38
  }
39
39
  }
40
40
  .iui-input.iui-small{
41
- padding-top:1.5px;
42
- padding-bottom:1.5px;
43
- min-height:27px;
41
+ padding-top:1px;
42
+ padding-bottom:1px;
43
+ min-height:28px;
44
44
  }
45
45
  .iui-input.iui-large{
46
- padding-top:12.5px;
47
- padding-bottom:12.5px;
48
- min-height:49px;
46
+ padding-top:13px;
47
+ padding-bottom:13px;
48
+ min-height:52px;
49
49
  font-size:16px;
50
50
  }
51
51
  .iui-input::-moz-placeholder{
@@ -89,6 +89,12 @@
89
89
  cursor:not-allowed;
90
90
  --_hover-color:var(--iui-color-background-disabled);
91
91
  }
92
+ :where(textarea.iui-input){
93
+ resize:vertical;
94
+ }
95
+ :where(textarea.iui-input)[disabled], :where(textarea.iui-input)[readonly]{
96
+ resize:none;
97
+ }
92
98
 
93
99
  .iui-input-with-icon.iui-input-with-icon{
94
100
  display:grid;
@@ -116,6 +122,8 @@
116
122
  grid-area:1/-1;
117
123
  }
118
124
  .iui-end-icon svg{
125
+ display:flex;
126
+ flex-shrink:0;
119
127
  width:16px;
120
128
  height:16px;
121
129
  }
@@ -148,7 +156,7 @@
148
156
  transition:background 0s;
149
157
  }
150
158
  .iui-end-icon.iui-actionable svg{
151
- fill:var(--iui-icons-color-actionable);
159
+ fill:var(--iui-icon-color-actionable);
152
160
  transition:transform 0.2s ease-out;
153
161
  }
154
162
  .iui-end-icon.iui-actionable.iui-open svg{
@@ -158,5 +166,5 @@
158
166
  cursor:not-allowed;
159
167
  }
160
168
  .iui-end-icon.iui-disabled svg{
161
- fill:var(--iui-icons-color-actionable-disabled);
169
+ fill:var(--iui-icon-color-actionable-disabled);
162
170
  }
@@ -13,6 +13,8 @@
13
13
  -ms-user-select:none;
14
14
  user-select:none;
15
15
  position:relative;
16
+ display:flex;
17
+ flex-shrink:0;
16
18
  width:24px;
17
19
  height:24px;
18
20
  cursor:pointer;
@@ -64,9 +66,11 @@
64
66
  border-color:var(--iui-color-foreground-accessory) transparent transparent transparent;
65
67
  }
66
68
  .iui-location-marker-data-rich > .iui-location-marker-data-rich-body > .iui-location-marker-data-rich-icon{
67
- display:inline-block;
69
+ display:flex;
70
+ flex-shrink:0;
68
71
  width:16px;
69
72
  height:16px;
73
+ display:inline-block;
70
74
  font-size:inherit;
71
75
  vertical-align:-2px;
72
76
  }
@@ -85,9 +89,11 @@
85
89
  -ms-user-select:none;
86
90
  user-select:none;
87
91
  position:relative;
88
- position:relative;
92
+ display:flex;
93
+ flex-shrink:0;
89
94
  width:24px;
90
95
  height:24px;
96
+ position:relative;
91
97
  border-radius:50%;
92
98
  cursor:default;
93
99
  background:radial-gradient(circle at center, rgba(var(--iui-color-foreground-primary-rgb), 0), rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-5)));
package/css/menu.css CHANGED
@@ -22,6 +22,7 @@
22
22
  width:100%;
23
23
  margin:0;
24
24
  padding:0;
25
+ max-height:var(--iui-menu-max-height);
25
26
  }
26
27
  @media (forced-colors: active){
27
28
  .iui-menu{
@@ -32,14 +33,17 @@
32
33
  margin:0 4px;
33
34
  }
34
35
  .iui-menu div.iui-header-menu-icon{
35
- margin:0;
36
+ display:flex;
37
+ flex-shrink:0;
36
38
  width:24px;
37
39
  height:24px;
40
+ margin:0;
38
41
  border-radius:4px;
39
42
  }
40
43
  .iui-menu.iui-scroll{
41
44
  overflow-y:auto;
42
45
  overflow-y:overlay;
46
+ --iui-menu-max-height:315px;
43
47
  }
44
48
 
45
49
  .iui-menu-item{
@@ -47,9 +51,10 @@
47
51
  align-items:center;
48
52
  font-size:14px;
49
53
  padding:0 13px;
50
- height:38px;
54
+ height:40px;
51
55
  cursor:pointer;
52
56
  line-height:normal;
57
+ color:var(--iui-color-foreground-2);
53
58
  }
54
59
  .iui-menu-item + .iui-menu-item{
55
60
  margin-top:-1px;
@@ -74,10 +79,12 @@
74
79
  opacity:var(--iui-opacity-3);
75
80
  }
76
81
  .iui-menu-item > .iui-icon{
82
+ display:flex;
83
+ flex-shrink:0;
77
84
  width:16px;
78
85
  height:16px;
79
86
  flex:0 0 auto;
80
- fill:var(--iui-icons-color-actionable);
87
+ fill:var(--iui-icon-color-actionable);
81
88
  }
82
89
  .iui-menu-item > .iui-icon + .iui-content{
83
90
  margin-left:8px;
@@ -93,7 +100,7 @@
93
100
  outline:none;
94
101
  }
95
102
  .iui-menu-item.iui-large{
96
- height:49px;
103
+ height:52px;
97
104
  }
98
105
  .iui-menu-item.iui-large .iui-menu-description{
99
106
  display:block;
@@ -108,7 +115,7 @@
108
115
  opacity:1;
109
116
  }
110
117
  .iui-menu-item.iui-active > .iui-icon{
111
- fill:var(--iui-icons-color-primary);
118
+ fill:var(--iui-icon-color-primary);
112
119
  }
113
120
  .iui-menu-item.iui-active:focus, .iui-menu-item.iui-active.iui-focused{
114
121
  outline-width:2px;
@@ -125,7 +132,7 @@
125
132
  color:var(--iui-text-color-placeholder);
126
133
  }
127
134
  .iui-menu-item.iui-disabled > .iui-icon, .iui-menu-item.iui-disabled:hover > .iui-icon{
128
- fill:var(--iui-icons-color-actionable-disabled);
135
+ fill:var(--iui-icon-color-actionable-disabled);
129
136
  }
130
137
  .iui-menu-item-skeleton{
131
138
  --iui-menu-item-content-skeleton-max-width:30%;
@@ -150,7 +157,7 @@
150
157
  }
151
158
 
152
159
  .iui-menu-content{
153
- padding:11px 13px;
160
+ padding:12px 13px;
154
161
  }
155
162
 
156
163
  .iui-menu-divider{