@itwin/itwinui-css 1.0.0-dev.8 → 1.0.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 (51) hide show
  1. package/CHANGELOG.md +39 -969
  2. package/README.md +50 -29
  3. package/css/alert.css +1 -387
  4. package/css/all.css +1 -9049
  5. package/css/anchor.css +1 -64
  6. package/css/avatar.css +1 -222
  7. package/css/backdrop.css +1 -22
  8. package/css/badge.css +1 -25
  9. package/css/blockquote.css +1 -22
  10. package/css/breadcrumbs.css +1 -372
  11. package/css/button.css +1 -381
  12. package/css/carousel.css +1 -121
  13. package/css/checkbox.css +1 -150
  14. package/css/code.css +1 -81
  15. package/css/color-picker.css +1 -203
  16. package/css/date-picker.css +1 -399
  17. package/css/dialog.css +1 -159
  18. package/css/expandable-block.css +1 -171
  19. package/css/fieldset.css +1 -27
  20. package/css/file-upload.css +1 -78
  21. package/css/footer.css +1 -91
  22. package/css/global.css +1 -59
  23. package/css/header.css +1 -432
  24. package/css/information-panel.css +1 -189
  25. package/css/input.css +1 -166
  26. package/css/keyboard.css +1 -27
  27. package/css/location-marker.css +1 -114
  28. package/css/menu.css +1 -171
  29. package/css/non-ideal-state.css +1 -61
  30. package/css/progress-indicator.css +1 -299
  31. package/css/radio-tile.css +1 -187
  32. package/css/radio.css +1 -157
  33. package/css/select.css +1 -235
  34. package/css/side-navigation.css +1 -198
  35. package/css/skip-to-content.css +1 -61
  36. package/css/slider.css +1 -258
  37. package/css/stepper.css +1 -137
  38. package/css/surface.css +1 -14
  39. package/css/table.css +1 -705
  40. package/css/tabs.css +1 -321
  41. package/css/tag.css +1 -140
  42. package/css/text.css +1 -115
  43. package/css/tile.css +1 -488
  44. package/css/time-picker.css +1 -128
  45. package/css/toast.css +1 -284
  46. package/css/toggle-switch.css +1 -212
  47. package/css/tooltip.css +1 -48
  48. package/css/tree.css +1 -124
  49. package/css/utils.css +1 -679
  50. package/css/workflow-diagram.css +1 -63
  51. package/package.json +8 -4
package/css/expandable-block.css CHANGED
@@ -2,174 +2,4 @@
2
2
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
3
3
  * See LICENSE.md in the project root for license terms and full copyright notice.
4
4
  *--------------------------------------------------------------------------------------------*/
5
- .iui-expandable-block{
6
- margin:0;
7
- padding:0;
8
- border:none;
9
- vertical-align:baseline;
10
- display:flex;
11
- flex-direction:column;
12
- width:100%;
13
- background-color:var(--iui-color-background-1);
14
- border-radius:var(--iui-border-radius-1);
15
- }
16
- .iui-expandable-block > .iui-header{
17
- display:flex;
18
- align-items:center;
19
- padding:var(--iui-size-s);
20
- cursor:pointer;
21
- -webkit-user-select:none;
22
- -moz-user-select:none;
23
- -ms-user-select:none;
24
- user-select:none;
25
- transition:background-color var(--iui-duration-1) ease-out;
26
- border-radius:inherit;
27
- border:1px solid var(--iui-color-background-3);
28
- background-color:var(--iui-color-background-3);
29
- }
30
- .iui-expandable-block > .iui-header:focus-visible{
31
- outline:1px solid var(--iui-color-foreground-primary);
32
- outline-offset:-1px;
33
- }
34
- @supports not selector(*:focus-visible){
35
- .iui-expandable-block > .iui-header:focus{
36
- outline:1px solid var(--iui-color-foreground-primary);
37
- outline-offset:-1px;
38
- }
39
- }
40
- .iui-expandable-block > .iui-header > .iui-icon,
41
- .iui-expandable-block > .iui-header > .iui-status-icon{
42
- display:flex;
43
- flex-shrink:0;
44
- width:var(--iui-size-m);
45
- height:var(--iui-size-m);
46
- }
47
- .iui-expandable-block > .iui-header > .iui-icon{
48
- fill:var(--iui-color-foreground-2);
49
- }
50
- @media (prefers-reduced-motion: no-preference){
51
- .iui-expandable-block > .iui-header > .iui-icon{
52
- transition:transform var(--iui-duration-1) ease-out;
53
- }
54
- }
55
- .iui-expandable-block > .iui-header > .iui-status-icon{
56
- margin-left:var(--iui-size-s);
57
- }
58
- .iui-expandable-block > .iui-header .iui-expandable-block-label{
59
- display:flex;
60
- flex-direction:column;
61
- flex:auto;
62
- min-width:0;
63
- margin-left:var(--iui-size-s);
64
- transition:color var(--iui-duration-1) ease;
65
- color:var(--iui-color-foreground-2);
66
- }
67
- .iui-expandable-block > .iui-header .iui-title,
68
- .iui-expandable-block > .iui-header .iui-caption{
69
- white-space:nowrap;
70
- overflow:hidden;
71
- text-overflow:ellipsis;
72
- }
73
- .iui-expandable-block > .iui-header .iui-title{
74
- font-size:var(--iui-font-size-2);
75
- }
76
- .iui-expandable-block > .iui-header .iui-caption{
77
- font-size:var(--iui-font-size-0);
78
- color:var(--iui-color-foreground-4);
79
- }
80
- .iui-expandable-block > .iui-header:focus-visible{
81
- outline:1px solid var(--iui-color-foreground-primary);
82
- outline-offset:-1px;
83
- }
84
- @supports not selector(*:focus-visible){
85
- .iui-expandable-block > .iui-header:focus{
86
- outline:1px solid var(--iui-color-foreground-primary);
87
- outline-offset:-1px;
88
- }
89
- }
90
- .iui-expandable-block .iui-expandable-content{
91
- overflow:hidden;
92
- border-bottom:1px solid var(--iui-color-background-4);
93
- border-right:1px solid var(--iui-color-background-4);
94
- border-left:1px solid var(--iui-color-background-4);
95
- border-bottom-left-radius:inherit;
96
- border-bottom-right-radius:inherit;
97
- }
98
- .iui-expandable-block .iui-expandable-content.iui-enter{
99
- opacity:0;
100
- }
101
- .iui-expandable-block .iui-expandable-content.iui-enter-active{
102
- opacity:1;
103
- }
104
- @media (prefers-reduced-motion: no-preference){
105
- .iui-expandable-block .iui-expandable-content.iui-enter-active{
106
- transition:opacity var(--iui-duration-1) ease-out, width var(--iui-duration-1) ease-out, height var(--iui-duration-1) ease-out;
107
- }
108
- }
109
- .iui-expandable-block .iui-expandable-content.iui-exit{
110
- opacity:1;
111
- }
112
- .iui-expandable-block .iui-expandable-content.iui-exit-active{
113
- opacity:0;
114
- }
115
- @media (prefers-reduced-motion: no-preference){
116
- .iui-expandable-block .iui-expandable-content.iui-exit-active{
117
- transition:opacity var(--iui-duration-1) ease-out, width var(--iui-duration-1) ease-out, height var(--iui-duration-1) ease-out;
118
- }
119
- }
120
- .iui-expandable-block .iui-expandable-content > div{
121
- padding:var(--iui-size-s) var(--iui-size-s);
122
- }
123
- .iui-expandable-block:hover > .iui-header{
124
- background-color:var(--iui-color-background-4);
125
- }
126
- .iui-expandable-block:hover > .iui-header > .iui-icon{
127
- fill:var(--iui-color-foreground-1);
128
- }
129
- .iui-expandable-block:hover > .iui-header .iui-caption,
130
- .iui-expandable-block:hover > .iui-header .iui-title{
131
- color:var(--iui-color-foreground-1);
132
- transition:color var(--iui-duration-1) ease;
133
- }
134
- .iui-expandable-block.iui-expanded > .iui-header{
135
- background-color:var(--iui-color-background-3);
136
- border-color:var(--iui-color-background-4);
137
- border-bottom-left-radius:0;
138
- border-bottom-right-radius:0;
139
- }
140
- .iui-expandable-block.iui-expanded > .iui-header:hover{
141
- background-color:var(--iui-color-background-4);
142
- }
143
- .iui-expandable-block.iui-expanded > .iui-header > .iui-icon{
144
- transform:rotate(90deg);
145
- }
146
- .iui-expandable-block.iui-small .iui-header{
147
- padding:calc(var(--iui-size-s) * 0.5) var(--iui-size-xs);
148
- }
149
- .iui-expandable-block.iui-small .iui-header > .iui-icon{
150
- display:flex;
151
- flex-shrink:0;
152
- width:var(--iui-size-s);
153
- height:var(--iui-size-s);
154
- }
155
- .iui-expandable-block.iui-small .iui-header > .iui-expandable-block-label{
156
- margin-left:var(--iui-size-xs);
157
- }
158
- .iui-expandable-block.iui-small .iui-header > .iui-status-icon{
159
- margin-left:var(--iui-size-xs);
160
- }
161
- .iui-expandable-block.iui-borderless,
162
- .iui-expandable-block.iui-borderless .iui-header,
163
- .iui-expandable-block.iui-borderless .iui-expandable-content{
164
- background-color:transparent;
165
- border:initial;
166
- }
167
- .iui-expandable-block.iui-borderless .iui-header{
168
- border-radius:var(--iui-border-radius-1);
169
- }
170
- .iui-expandable-block.iui-borderless .iui-header:hover{
171
- background-color:var(--iui-color-background-transparent-hover);
172
- }
173
- .iui-expandable-block.iui-borderless .iui-expandable-content > div{
174
- padding:0;
175
- }
5
+ .iui-expandable-block{vertical-align:baseline;width:100%;background-color:var(--iui-color-background);border-radius:var(--iui-border-radius-1);border:none;flex-direction:column;margin:0;padding:0;display:flex}.iui-expandable-block>.iui-header{padding:var(--iui-size-s);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color var(--iui-duration-1)ease-out;border-radius:inherit;border:1px solid var(--iui-color-border);background-color:var(--iui-color-background);align-items:center;display:flex}.iui-expandable-block>.iui-header:focus-visible{outline:1px solid var(--iui-color-border-accent);outline-offset:-1px}@supports not selector(*:focus-visible){.iui-expandable-block>.iui-header:focus{outline:1px solid var(--iui-color-border-accent);outline-offset:-1px}}.iui-expandable-block>.iui-header>.iui-icon,.iui-expandable-block>.iui-header>.iui-status-icon{width:var(--iui-size-m);height:var(--iui-size-m);flex-shrink:0;display:flex}.iui-expandable-block>.iui-header>.iui-icon{fill:var(--iui-color-icon)}@media (prefers-reduced-motion:no-preference){.iui-expandable-block>.iui-header>.iui-icon{transition:transform var(--iui-duration-1)ease-out}}.iui-expandable-block>.iui-header>.iui-status-icon{margin-left:var(--iui-size-s)}.iui-expandable-block>.iui-header .iui-expandable-block-label{min-width:0;margin-left:var(--iui-size-s);transition:color var(--iui-duration-1)ease;color:var(--iui-color-text);flex-direction:column;flex:auto;display:flex}.iui-expandable-block>.iui-header .iui-title,.iui-expandable-block>.iui-header .iui-caption{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.iui-expandable-block>.iui-header .iui-title{font-size:var(--iui-font-size-2)}.iui-expandable-block>.iui-header .iui-caption{font-size:var(--iui-font-size-0);color:var(--iui-color-text-muted)}.iui-expandable-block>.iui-header:focus-visible{outline:1px solid var(--iui-color-border-accent);outline-offset:-1px}@supports not selector(*:focus-visible){.iui-expandable-block>.iui-header:focus{outline:1px solid var(--iui-color-border-accent);outline-offset:-1px}}.iui-expandable-block .iui-expandable-content{border-bottom:1px solid var(--iui-color-border);border-right:1px solid var(--iui-color-border);border-left:1px solid var(--iui-color-border);border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;overflow:hidden}.iui-expandable-block .iui-expandable-content.iui-enter{opacity:0}.iui-expandable-block .iui-expandable-content.iui-enter-active{opacity:1}@media (prefers-reduced-motion:no-preference){.iui-expandable-block .iui-expandable-content.iui-enter-active{transition:opacity var(--iui-duration-1)ease-out,width var(--iui-duration-1)ease-out,height var(--iui-duration-1)ease-out}}.iui-expandable-block .iui-expandable-content.iui-exit{opacity:1}.iui-expandable-block .iui-expandable-content.iui-exit-active{opacity:0}@media (prefers-reduced-motion:no-preference){.iui-expandable-block .iui-expandable-content.iui-exit-active{transition:opacity var(--iui-duration-1)ease-out,width var(--iui-duration-1)ease-out,height var(--iui-duration-1)ease-out}}.iui-expandable-block .iui-expandable-content>div{padding:var(--iui-size-s)var(--iui-size-s)}.iui-expandable-block:hover>.iui-header{background-color:var(--iui-color-background-hover)}.iui-expandable-block:hover>.iui-header>.iui-icon{fill:var(--iui-color-icon-hover)}.iui-expandable-block:hover>.iui-header .iui-caption,.iui-expandable-block:hover>.iui-header .iui-title{color:var(--iui-color-text-hover);transition:color var(--iui-duration-1)ease}.iui-expandable-block.iui-expanded>.iui-header{background-color:var(--iui-color-background);border-color:var(--iui-color-border);border-bottom-right-radius:0;border-bottom-left-radius:0}.iui-expandable-block.iui-expanded>.iui-header:hover{background-color:var(--iui-color-background-hover)}.iui-expandable-block.iui-expanded>.iui-header>.iui-icon{transform:rotate(90deg)}.iui-expandable-block.iui-small .iui-header{padding:calc(var(--iui-size-s)*.5)var(--iui-size-xs)}.iui-expandable-block.iui-small .iui-header>.iui-icon{width:var(--iui-size-s);height:var(--iui-size-s);flex-shrink:0;display:flex}.iui-expandable-block.iui-small .iui-header>.iui-expandable-block-label,.iui-expandable-block.iui-small .iui-header>.iui-status-icon{margin-left:var(--iui-size-xs)}.iui-expandable-block.iui-borderless,.iui-expandable-block.iui-borderless .iui-header,.iui-expandable-block.iui-borderless .iui-expandable-content{border:initial;background-color:#0000}.iui-expandable-block.iui-borderless .iui-header{border-radius:var(--iui-border-radius-1)}.iui-expandable-block.iui-borderless .iui-header:hover{background-color:var(--iui-color-background-transparent-hover)}.iui-expandable-block.iui-borderless .iui-expandable-content>div{padding:0}
package/css/fieldset.css CHANGED
@@ -2,30 +2,4 @@
2
2
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
3
3
  * See LICENSE.md in the project root for license terms and full copyright notice.
4
4
  *--------------------------------------------------------------------------------------------*/
5
- .iui-fieldset{
6
- margin:0;
7
- padding:0;
8
- border:none;
9
- vertical-align:baseline;
10
- padding:var(--iui-size-s) var(--iui-size-s);
11
- border-radius:var(--iui-border-radius-1);
12
- border:1px solid var(--iui-color-background-border);
13
- background-color:var(--iui-color-background-1);
14
- }
15
- .iui-fieldset legend{
16
- font-size:var(--iui-font-size-2);
17
- padding-inline:var(--iui-size-xs);
18
- border-radius:var(--iui-border-radius-1);
19
- -webkit-user-select:none;
20
- -moz-user-select:none;
21
- -ms-user-select:none;
22
- user-select:none;
23
- background-color:var(--iui-color-background-4);
24
- color:var(--iui-color-foreground-2);
25
- }
26
- .iui-fieldset[disabled]{
27
- cursor:not-allowed;
28
- }
29
- .iui-fieldset[disabled] legend{
30
- color:var(--iui-color-foreground-4);
31
- }
5
+ .iui-fieldset{vertical-align:baseline;padding:0;padding:var(--iui-size-s)var(--iui-size-s);border-radius:var(--iui-border-radius-1);border:none;border:1px solid var(--iui-color-border);background-color:var(--iui-color-background);margin:0}.iui-fieldset legend{font-size:var(--iui-font-size-2);padding-inline:var(--iui-size-xs);border-radius:var(--iui-border-radius-1);-webkit-user-select:none;user-select:none;background-color:var(--iui-color-background);border:2px solid var(--iui-color-border);color:var(--iui-color-text)}.iui-fieldset[disabled]{cursor:not-allowed}.iui-fieldset[disabled] legend{color:var(--iui-color-text-disabled)}
package/css/file-upload.css CHANGED
@@ -2,81 +2,4 @@
2
2
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
3
3
  * See LICENSE.md in the project root for license terms and full copyright notice.
4
4
  *--------------------------------------------------------------------------------------------*/
5
- .iui-file-upload{
6
- margin:0;
7
- padding:0;
8
- border:none;
9
- vertical-align:baseline;
10
- font-size:var(--iui-font-size-1);
11
- font-weight:var(--iui-font-weight-normal);
12
- position:relative;
13
- display:flex;
14
- }
15
- .iui-file-upload > .iui-content{
16
- visibility:hidden;
17
- position:absolute;
18
- top:0;
19
- left:0;
20
- width:100%;
21
- height:100%;
22
- display:flex;
23
- flex-direction:column;
24
- justify-content:center;
25
- align-items:center;
26
- -webkit-user-select:none;
27
- -moz-user-select:none;
28
- -ms-user-select:none;
29
- user-select:none;
30
- padding:calc(var(--iui-size-s) * 0.5) var(--iui-size-s);
31
- background-color:var(--iui-color-background-2);
32
- border:1px solid var(--iui-color-background-2);
33
- border-radius:var(--iui-border-radius-1);
34
- }
35
- .iui-file-upload > .iui-content .iui-browse-input{
36
- width:0.1px;
37
- height:0.1px;
38
- opacity:0;
39
- overflow:hidden;
40
- position:absolute;
41
- }
42
- .iui-file-upload > .iui-content > svg,
43
- .iui-file-upload > .iui-content .iui-template-icon{
44
- display:flex;
45
- flex-shrink:0;
46
- width:var(--iui-size-2xl);
47
- height:var(--iui-size-2xl);
48
- fill:var(--iui-color-foreground-4);
49
- margin-top:var(--iui-size-s);
50
- margin-bottom:var(--iui-size-s);
51
- }
52
- @media (forced-colors: active){
53
- .iui-file-upload > .iui-content > svg,
54
- .iui-file-upload > .iui-content .iui-template-icon{
55
- fill:CanvasText;
56
- }
57
- }
58
- .iui-file-upload > .iui-content:only-child{
59
- visibility:visible;
60
- position:relative;
61
- flex-direction:row;
62
- }
63
- .iui-file-upload > .iui-content:only-child:focus-within{
64
- outline:2px solid var(--iui-color-foreground-primary);
65
- outline-offset:-2px;
66
- }
67
- .iui-file-upload > .iui-content .iui-template-text{
68
- margin-left:var(--iui-size-l);
69
- }
70
- .iui-file-upload > .iui-content .iui-template-text > label{
71
- font-weight:var(--iui-font-weight-bold);
72
- }
73
- .iui-file-upload.iui-drag > .iui-content{
74
- background-color:var(--iui-color-background-subtle-primary);
75
- border-color:var(--iui-color-foreground-primary);
76
- color:var(--iui-color-foreground-primary);
77
- visibility:visible;
78
- }
79
- .iui-file-upload.iui-drag > .iui-content > svg,
80
- .iui-file-upload.iui-drag > .iui-content .iui-template-icon{
81
- fill:var(--iui-color-foreground-primary);
82
- }
5
+ .iui-file-upload{vertical-align:baseline;font-size:var(--iui-font-size-1);font-weight:var(--iui-font-weight-normal);border:none;margin:0;padding:0;display:flex;position:relative}.iui-file-upload>.iui-content{visibility:hidden;width:100%;height:100%;-webkit-user-select:none;user-select:none;padding:calc(var(--iui-size-s)*.5)var(--iui-size-s);background-color:var(--iui-color-background-backdrop);border:1px solid var(--iui-color-background-backdrop);border-radius:var(--iui-border-radius-1);flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;top:0;left:0}.iui-file-upload>.iui-content .iui-browse-input{width:.1px;height:.1px;opacity:0;position:absolute;overflow:hidden}.iui-file-upload>.iui-content>svg,.iui-file-upload>.iui-content .iui-template-icon{width:var(--iui-size-2xl);height:var(--iui-size-2xl);fill:var(--iui-color-icon-muted);margin-top:var(--iui-size-s);margin-bottom:var(--iui-size-s);flex-shrink:0;display:flex}@media (forced-colors:active){.iui-file-upload>.iui-content>svg,.iui-file-upload>.iui-content .iui-template-icon{fill:CanvasText}}.iui-file-upload>.iui-content:only-child{visibility:visible;flex-direction:row;position:relative}.iui-file-upload>.iui-content:only-child:focus-within{outline:2px solid var(--iui-color-text-accent);outline-offset:-2px}.iui-file-upload>.iui-content .iui-template-text{margin-left:var(--iui-size-l)}.iui-file-upload>.iui-content .iui-template-text>label{font-weight:var(--iui-font-weight-bold)}.iui-file-upload.iui-drag>.iui-content{background-color:var(--iui-color-background-accent-muted);border-color:var(--iui-color-border-accent);color:var(--iui-color-text-accent);visibility:visible}.iui-file-upload.iui-drag>.iui-content>svg,.iui-file-upload.iui-drag>.iui-content .iui-template-icon{fill:var(--iui-color-icon-accent)}
package/css/footer.css CHANGED
@@ -2,94 +2,4 @@
2
2
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
3
3
  * See LICENSE.md in the project root for license terms and full copyright notice.
4
4
  *--------------------------------------------------------------------------------------------*/
5
- .iui-legal-footer{
6
- margin:0;
7
- padding:0;
8
- border:none;
9
- vertical-align:baseline;
10
- text-align:center;
11
- width:100%;
12
- padding:var(--iui-size-s) 0;
13
- font-size:var(--iui-font-size-0);
14
- }
15
-
16
- .iui-legal-footer-list{
17
- list-style-type:none;
18
- margin:0 auto;
19
- padding:0;
20
- display:flex;
21
- justify-content:center;
22
- align-items:center;
23
- flex-wrap:wrap;
24
- }
25
-
26
- .iui-legal-footer-item{
27
- display:flex;
28
- align-items:center;
29
- -webkit-user-select:none;
30
- -moz-user-select:none;
31
- -ms-user-select:none;
32
- user-select:none;
33
- white-space:nowrap;
34
- word-break:keep-all;
35
- color:var(--iui-color-foreground-4);
36
- }
37
- .iui-legal-footer-item > a{
38
- color:var(--iui-color-foreground-primary);
39
- -webkit-tap-highlight-color:hsl(var(--iui-color-foreground-primary-hsl)/var(--iui-opacity-6));
40
- border-radius:var(--iui-border-radius-1);
41
- cursor:pointer;
42
- text-decoration:none;
43
- }
44
- .iui-legal-footer-item > a:focus-visible{
45
- outline:1px solid var(--iui-color-foreground-primary);
46
- outline-offset:1px;
47
- }
48
- @supports not selector(*:focus-visible){
49
- .iui-legal-footer-item > a:focus{
50
- outline:1px solid var(--iui-color-foreground-primary);
51
- outline-offset:1px;
52
- }
53
- }
54
- .iui-legal-footer-item > a:hover{
55
- color:var(--iui-color-foreground-primary-hover);
56
- }
57
- .iui-legal-footer-item > a:hover{
58
- text-decoration:underline;
59
- }
60
- @media (prefers-contrast: more){
61
- .iui-legal-footer-item > a{
62
- text-decoration:underline;
63
- }
64
- .iui-legal-footer-item > a:hover{
65
- text-decoration:none;
66
- }
67
- }
68
- .iui-theme-light .iui-legal-footer-item > a, .iui-theme-dark .iui-legal-footer-item > a{
69
- text-decoration:none;
70
- }
71
- .iui-theme-light .iui-legal-footer-item > a:hover, .iui-theme-dark .iui-legal-footer-item > a:hover{
72
- text-decoration:underline;
73
- }
74
-
75
- .iui-theme-light-hc .iui-legal-footer-item > a, .iui-theme-dark-hc .iui-legal-footer-item > a{
76
- text-decoration:underline;
77
- }
78
- .iui-theme-light-hc .iui-legal-footer-item > a:hover, .iui-theme-dark-hc .iui-legal-footer-item > a:hover{
79
- text-decoration:none;
80
- }
81
-
82
- .iui-legal-footer-item > a, .iui-legal-footer-item > a:hover{
83
- color:var(--iui-color-foreground-4);
84
- }
85
-
86
- .iui-legal-footer-separator{
87
- margin:0 var(--iui-size-xs);
88
- width:1px;
89
- height:var(--iui-size-s);
90
- background-color:var(--iui-color-foreground-4);
91
- }
92
-
93
- .iui-legal-footer-developer{
94
- color:var(--iui-color-foreground-4);
95
- }
5
+ .iui-legal-footer{vertical-align:baseline;text-align:center;width:100%;padding:0;padding:var(--iui-size-s)0;font-size:var(--iui-font-size-0);border:none;margin:0}.iui-legal-footer-list{flex-wrap:wrap;justify-content:center;align-items:center;margin:0 auto;padding:0;list-style-type:none;display:flex}.iui-legal-footer-item{-webkit-user-select:none;user-select:none;white-space:nowrap;word-break:keep-all;color:var(--iui-color-text-muted);align-items:center;display:flex}.iui-legal-footer-item>a{color:var(--iui-color-text-accent);-webkit-tap-highlight-color:hsl(var(--iui-color-accent-hsl)/var(--iui-opacity-6));border-radius:var(--iui-border-radius-1);cursor:pointer;text-decoration:none}.iui-legal-footer-item>a:focus-visible{outline:1px solid var(--iui-color-text-accent);outline-offset:1px}@supports not selector(*:focus-visible){.iui-legal-footer-item>a:focus{outline:1px solid var(--iui-color-text-accent);outline-offset:1px}}.iui-legal-footer-item>a:hover{color:var(--iui-color-text-accent-hover);text-decoration:underline}@media (prefers-contrast:more){.iui-legal-footer-item>a{text-decoration:underline}.iui-legal-footer-item>a:hover{text-decoration:none}}[data-iui-contrast=high] .iui-legal-footer-item>a{text-decoration:underline}[data-iui-contrast=high] .iui-legal-footer-item>a:hover{text-decoration:none}.iui-legal-footer-item>a,.iui-legal-footer-item>a:hover{color:var(--iui-color-text-muted)}.iui-legal-footer-separator{margin:0 var(--iui-size-xs);width:1px;height:var(--iui-size-s);background-color:var(--iui-color-border)}.iui-legal-footer-developer{color:var(--iui-color-text-muted)}
package/css/global.css CHANGED
@@ -2,62 +2,4 @@
2
2
  * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
3
3
  * See LICENSE.md in the project root for license terms and full copyright notice.
4
4
  *--------------------------------------------------------------------------------------------*/
5
- :where(.iui-root){
6
- color:var(--iui-color-foreground-2);
7
- font-size:var(--iui-font-size-1);
8
- line-height:var(--iui-size-l);
9
- font-family:var(--iui-font-sans);
10
- }
11
- :where(body:where(.iui-root)){
12
- margin:0;
13
- background-color:var(--iui-color-background-2);
14
- }
15
-
16
- :where(.iui-root) :where([class*="iui-"]):where(:not(.iui-root)), :where(.iui-root) :where([class*="iui-"]):where(:not(.iui-root))::before, :where(.iui-root) :where([class*="iui-"]):where(:not(.iui-root))::after,
17
- :where(.iui-root) :where([class*="iui-"]) *,
18
- :where(.iui-root) :where([class*="iui-"]) *::before,
19
- :where(.iui-root) :where([class*="iui-"]) *::after{
20
- box-sizing:border-box;
21
- }
22
-
23
- :where([data-iui-theme]),
24
- :where(.iui-root),
25
- :where(.iui-root) *{
26
- scrollbar-color:hsl(var(--iui-color-foreground-1-hsl)/var(--iui-opacity-4)) transparent;
27
- scrollbar-width:thin;
28
- }
29
- :where([data-iui-theme])::-moz-selection, :where([data-iui-theme]) *::-moz-selection, :where(.iui-root)::-moz-selection, :where(.iui-root) *::-moz-selection, :where(.iui-root) *::-moz-selection, :where(.iui-root) * *::-moz-selection{
30
- background-color:hsl(var(--iui-color-foreground-primary-hsl)/var(--iui-opacity-5));
31
- }
32
- :where([data-iui-theme])::selection,
33
- :where([data-iui-theme]) *::selection,
34
- :where(.iui-root)::selection,
35
- :where(.iui-root) *::selection,
36
- :where(.iui-root) *::selection,
37
- :where(.iui-root) * *::selection{
38
- background-color:hsl(var(--iui-color-foreground-primary-hsl)/var(--iui-opacity-5));
39
- }
40
- :where([data-iui-theme])::-webkit-scrollbar,
41
- :where(.iui-root)::-webkit-scrollbar,
42
- :where(.iui-root) *::-webkit-scrollbar{
43
- width:var(--iui-size-xs);
44
- height:var(--iui-size-xs);
45
- }
46
- :where([data-iui-theme])::-webkit-scrollbar-thumb,
47
- :where(.iui-root)::-webkit-scrollbar-thumb,
48
- :where(.iui-root) *::-webkit-scrollbar-thumb{
49
- background-color:hsl(var(--iui-color-foreground-1-hsl)/var(--iui-opacity-4));
50
- border-radius:var(--iui-border-radius-round);
51
- }
52
- :where([data-iui-theme])::-webkit-scrollbar-thumb:hover,
53
- :where(.iui-root)::-webkit-scrollbar-thumb:hover,
54
- :where(.iui-root) *::-webkit-scrollbar-thumb:hover{
55
- background-color:hsl(var(--iui-color-foreground-1-hsl)/var(--iui-opacity-3));
56
- }
57
- :where([data-iui-theme])::-webkit-scrollbar-track, :where([data-iui-theme])::-webkit-scrollbar-corner,
58
- :where(.iui-root)::-webkit-scrollbar-track,
59
- :where(.iui-root)::-webkit-scrollbar-corner,
60
- :where(.iui-root) *::-webkit-scrollbar-track,
61
- :where(.iui-root) *::-webkit-scrollbar-corner{
62
- background-color:transparent;
63
- }
5
+ :where(.iui-root){color:var(--iui-color-text);font-size:var(--iui-font-size-1);line-height:var(--iui-size-l);font-family:var(--iui-font-sans)}:where(body:where(.iui-root)){background-color:var(--iui-color-background-backdrop);margin:0}:where(.iui-root) :where([class*=iui-]):where(:not(.iui-root)),:where(.iui-root) :where([class*=iui-]):where(:not(.iui-root)):before,:where(.iui-root) :where([class*=iui-]):where(:not(.iui-root)):after,:where(.iui-root) :where([class*=iui-]) *,:where(.iui-root) :where([class*=iui-]) :before,:where(.iui-root) :where([class*=iui-]) :after{box-sizing:border-box}:where([data-iui-theme]),:where(.iui-root),:where(.iui-root *){scrollbar-color:hsl(var(--iui-color-foreground-hsl)/var(--iui-opacity-4))transparent;scrollbar-width:thin}:where([data-iui-theme])::selection,:where([data-iui-theme]) ::selection,:where(.iui-root)::selection,:where(.iui-root) ::selection,:where(.iui-root *)::selection,:where(.iui-root *) ::selection{background-color:hsl(var(--iui-color-accent-hsl)/var(--iui-opacity-5))}:where([data-iui-theme])::-webkit-scrollbar,:where(.iui-root)::-webkit-scrollbar,:where(.iui-root *)::-webkit-scrollbar{width:var(--iui-size-xs);height:var(--iui-size-xs)}:where([data-iui-theme])::-webkit-scrollbar-thumb,:where(.iui-root)::-webkit-scrollbar-thumb,:where(.iui-root *)::-webkit-scrollbar-thumb{background-color:hsl(var(--iui-color-foreground-hsl)/var(--iui-opacity-4));border-radius:var(--iui-border-radius-round)}:where([data-iui-theme])::-webkit-scrollbar-thumb:hover,:where(.iui-root)::-webkit-scrollbar-thumb:hover,:where(.iui-root *)::-webkit-scrollbar-thumb:hover{background-color:hsl(var(--iui-color-foreground-hsl)/var(--iui-opacity-3))}:where([data-iui-theme])::-webkit-scrollbar-track,:where([data-iui-theme])::-webkit-scrollbar-corner,:where(.iui-root)::-webkit-scrollbar-track,:where(.iui-root)::-webkit-scrollbar-corner,:where(.iui-root *)::-webkit-scrollbar-track,:where(.iui-root *)::-webkit-scrollbar-corner{background-color:#0000}