@primer/css 0.0.0-20219200424 → 0.0.0-202192084348

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.
@@ -1,46 +0,0 @@
1
- @import './action-list-helpers-temporary.scss';
2
-
3
- // emtpy divider
4
-
5
- .ActionList-sectionDivider {
6
- height: 1px;
7
- background: $actionList-item-divider;
8
- border: 0;
9
- margin: ($spacer-2 - 1px) ($spacer-2 * -1) $spacer-2;
10
- padding: 0;
11
- list-style: none;
12
- }
13
-
14
- .ActionList-sectionDivider--filled {
15
- margin: $spacer-2 ($spacer-2 * -1);
16
- background: var(--color-canvas-subtle);
17
- border-top: 1px solid var(--color-scale-gray-2);
18
- border-bottom: 1px solid var(--color-scale-gray-2);
19
-
20
- // if no children, treat as divider
21
- &:empty {
22
- height: $spacer-2;
23
- box-sizing: border-box;
24
- }
25
-
26
- &:first-child {
27
- margin-top: 0;
28
- }
29
- }
30
-
31
- // section header
32
-
33
- .ActionList-sectionHeader {
34
- // 32px total height considering 20px line-height
35
- padding: (($spacer-5 - $s-20) / 2) $spacer-2;
36
- font-size: $font-size-small;
37
- font-weight: $font-weight-bold;
38
- color: var(--color-fg-muted);
39
- display: flex;
40
- flex-direction: column;
41
-
42
- .ActionList-sectionHeader--description {
43
- font-size: $font-size-small;
44
- font-weight: $font-weight-normal;
45
- }
46
- }
@@ -1,327 +0,0 @@
1
- @import './action-list-helpers-temporary.scss';
2
-
3
- @mixin focusOutline {
4
- outline: none;
5
- box-shadow: 0 0 0 2px var(--color-accent-fg); // this color breaks convention
6
- position: relative;
7
- z-index: 1;
8
- }
9
-
10
- // <li>
11
- .ActionList-item {
12
- list-style: none;
13
- position: relative;
14
- border-radius: $border-radius-2;
15
-
16
- &:hover,
17
- &:active {
18
- cursor: pointer;
19
-
20
- // a href
21
- .ActionList-item-content {
22
- text-decoration: none;
23
- }
24
- }
25
-
26
- // only hover li without list as children
27
- &:not(.ActionList-item--has-sub-item) {
28
- &:hover {
29
- background-color: $actionList-item-hover-bg;
30
- cursor: pointer;
31
- }
32
-
33
- &:active {
34
- background: $actionList-item-active-bg;
35
-
36
- @media screen and (prefers-reduced-motion: no-preference) {
37
- animation: ActionList-item-active-bg 4s forwards $ease-out-cubic;
38
- }
39
-
40
- @keyframes ActionList-item-active-bg {
41
- 0% {
42
- }
43
- 50% {
44
- transform: scale(1);
45
- box-shadow: inset 0 0 0 rgba(#000, 0.04);
46
- }
47
- 100% {
48
- transform: scale(0.97);
49
- box-shadow: inset 0 3px 9px rgba(#000, 0.04);
50
- }
51
- }
52
- }
53
-
54
- &:hover,
55
- &:active {
56
- // hide dividers
57
- .ActionList-item-content--label:before,
58
- + .ActionList-item .ActionList-item-content--label:before {
59
- visibility: hidden;
60
- }
61
- }
62
- }
63
-
64
- // target contents of li if sub-item (li wraps item label + nested ul)
65
- // collapse styles here
66
- &.ActionList-item--has-sub-item {
67
- // first child
68
- > .ActionList-item-content {
69
- &:hover {
70
- background-color: $actionList-item-hover-bg;
71
- }
72
- }
73
- }
74
-
75
- // active state [aria-current]
76
-
77
- &.ActionList-item--nav-active:not(.ActionList-item--danger) {
78
- background: $actionList-item-selected-bg;
79
- &:before,
80
- + .ActionList-item:before {
81
- visibility: hidden;
82
- }
83
-
84
- // blue accent line
85
- &:after {
86
- content: '';
87
- width: $spacer-1;
88
- height: $spacer-4;
89
- border-radius: $border-radius-1;
90
- position: absolute;
91
- left: -$actionList-item-padding-horizontal;
92
- top: calc(50% - (24px / 2));
93
- background: var(--color-accent-fg);
94
- }
95
- }
96
-
97
- // collapsible item [aria-expanded]
98
-
99
- &[aria-expanded='true'] {
100
- .ActionList-item-content--collapseIcon {
101
- transform: rotate(0deg);
102
- transition: transform linear $actionList-item-checkmark-transition-timing;
103
- }
104
-
105
- .ActionList-item--sub-group {
106
- display: block;
107
- }
108
-
109
- &.ActionList-item--has-sub-item {
110
- > .ActionList-item-content > .ActionList-item-content--label {
111
- font-weight: $font-weight-bold;
112
- }
113
- }
114
- }
115
-
116
- &[aria-expanded='false'] {
117
- .ActionList-item-content--collapseIcon {
118
- transform: rotate(180deg);
119
- transition: transform linear $actionList-item-checkmark-transition-timing;
120
- }
121
-
122
- .ActionList-item--sub-group {
123
- display: none;
124
- }
125
- }
126
-
127
- // checkbox item [aria-checked]
128
-
129
- &[aria-checked='true'] {
130
- .ActionList-item-content--singleSelect {
131
- visibility: visible;
132
- opacity: 1;
133
- transition: visibility 0s linear 0s, opacity $actionList-item-checkmark-transition-timing;
134
- }
135
- }
136
-
137
- &[aria-checked='false'] {
138
- .ActionList-item-content--singleSelect {
139
- visibility: hidden;
140
- opacity: 0;
141
- transition: visibility 0s linear $actionList-item-checkmark-transition-timing,
142
- opacity $actionList-item-checkmark-transition-timing;
143
- }
144
- }
145
-
146
- // variants
147
-
148
- &.ActionList-item--danger {
149
- .ActionList-item-content--label {
150
- color: var(--color-danger-fg);
151
- }
152
-
153
- @media (hover: hover) and (pointer: fine) {
154
- &:hover {
155
- background: var(--color-danger-subtle);
156
- }
157
- }
158
-
159
- &:active {
160
- background: var(--color-danger-subtle);
161
- }
162
- }
163
-
164
- // if nested list exists, remove default padding
165
- .ActionList {
166
- padding: unset;
167
- }
168
- }
169
-
170
- // span or a href
171
- .ActionList-item-content {
172
- display: grid;
173
- grid-template-rows: minmax(20px, max-content); // 20px + 12px padding [32]
174
- grid-template-areas: 'leadingAction leadingVisual label trailingVisual trailingAction';
175
- grid-template-columns: min-content min-content minmax(min-content, auto) min-content min-content;
176
- align-items: center;
177
- padding: $actionList-item-padding-vertical $actionList-item-padding-horizontal;
178
- position: relative;
179
- border-radius: $border-radius-2;
180
- font-weight: $font-weight-normal;
181
- color: var(--color-fg-default);
182
- user-select: none;
183
- transition: $actionList-item-bg-transition;
184
-
185
- // column-gap persists with empty grid-areas, margin applies only when children exist
186
- & > :not(:last-child) {
187
- margin-right: $spacer-2;
188
- }
189
-
190
- &:focus-visible {
191
- @include focusOutline;
192
- }
193
-
194
- // sizes
195
-
196
- &.ActionList-item-content--sizeMedium {
197
- grid-template-rows: minmax(28px, max-content); // 28px + 12px padding [40]
198
- }
199
-
200
- &.ActionList-item-content--sizeLarge {
201
- grid-template-rows: minmax(36px, max-content); // 36px + 12px padding [48]
202
- }
203
-
204
- // On pointer:coarse (mobile), all list items are large
205
- @media (pointer: coarse) {
206
- grid-template-rows: minmax(36px, max-content);
207
- }
208
-
209
- &.ActionList-item-content--blockDescription {
210
- // if leading/trailing visual, align with first line of content
211
- .ActionList-item-content--visual {
212
- place-self: start;
213
- }
214
- }
215
- }
216
-
217
- // place children on grid
218
-
219
- .ActionList-item-content--action-leading {
220
- grid-area: leadingAction;
221
- }
222
-
223
- .ActionList-item-content--visual-leading {
224
- grid-area: leadingVisual;
225
- }
226
-
227
- .ActionList-item-content--label {
228
- grid-area: label;
229
- }
230
-
231
- .ActionList-item-content--visual-trailing {
232
- grid-area: trailingVisual;
233
- }
234
-
235
- .ActionList-item-content--action-trailing {
236
- grid-area: trailingAction;
237
- }
238
-
239
- // wrapper span
240
- .ActionList-item-content--label-blockDescription,
241
- .ActionList-item-content--label-inlineDescription {
242
- grid-area: label;
243
- display: flex;
244
-
245
- .ActionList-item-content--label {
246
- font-weight: $font-weight-bold;
247
- }
248
- }
249
-
250
- // block
251
- .ActionList-item-content--label-blockDescription {
252
- flex-direction: column;
253
-
254
- .ActionList-item-content--description {
255
- margin-top: $spacer-1;
256
- }
257
- }
258
-
259
- // inline
260
- .ActionList-item-content--label-inlineDescription {
261
- flex-direction: row;
262
- align-items: baseline;
263
-
264
- .ActionList-item-content--description {
265
- margin-left: $actionList-item-padding-horizontal;
266
- }
267
- }
268
-
269
- // description
270
- .ActionList-item-content--description {
271
- font-size: $font-size-small;
272
- line-height: $lh-default;
273
- color: var(--color-fg-muted);
274
- }
275
-
276
- // helper for grid alignment with multi-line content
277
- // span wrapping svg or text
278
- .ActionList-item-content--visual,
279
- .ActionList-item-content--action {
280
- min-height: 20px;
281
- display: flex;
282
- align-items: center;
283
- fill: var(--color-fg-muted);
284
- color: var(--color-fg-muted); // if visual is text
285
- }
286
-
287
- // text
288
- .ActionList-item-content--label {
289
- font-weight: $font-weight-normal;
290
- color: var(--color-fg-default);
291
- position: relative; // for pseudo dividers
292
- }
293
-
294
- // nested lists (only supports 1 level currently)
295
- // target ActionList-item--sub-item for padding-left to maintain :active :after state
296
-
297
- .ActionList-item--sub-item > .ActionList-item-content {
298
- font-size: $font-size-small;
299
- }
300
-
301
- // no leading visual
302
- .ActionList-item--sub-group {
303
- .ActionList-item--sub-item {
304
- padding-left: 16px;
305
- }
306
- }
307
-
308
- // has 16px leading visual
309
- .ActionList-item-content--visual--16 + .ActionList-item--sub-group {
310
- .ActionList-item--sub-item {
311
- padding-left: 24px;
312
- }
313
- }
314
-
315
- // has 20px leading visual
316
- .ActionList-item-content--visual--20 + .ActionList-item--sub-group {
317
- .ActionList-item--sub-item {
318
- padding-left: 28px;
319
- }
320
- }
321
-
322
- // has 24px leading visual
323
- .ActionList-item-content--visual--24 + .ActionList-item--sub-group {
324
- .ActionList-item--sub-item {
325
- padding-left: 32px;
326
- }
327
- }
@@ -1,34 +0,0 @@
1
- @import './action-list-helpers-temporary.scss';
2
-
3
- // <ul>
4
- .ActionList {
5
- padding: $actionList-padding;
6
- }
7
-
8
- // dividers
9
-
10
- .ActionList--divided {
11
- .ActionList-item-content--label:before {
12
- content: '';
13
- display: block;
14
- position: absolute;
15
- width: 100%;
16
- height: 1px;
17
- background: $actionList-item-divider;
18
- top: -$actionList-item-padding-vertical;
19
- }
20
-
21
- // hide divider if item is active
22
- .ActionList-item--nav-active {
23
- .ActionList-item-content--label:before,
24
- + .ActionList-item .ActionList-item-content--label:before {
25
- visibility: hidden;
26
- }
27
- }
28
- }
29
-
30
- .ActionList-item:first-of-type .ActionList-item-content--label:before,
31
- .ActionList-sectionDivider + .ActionList-item .ActionList-item-content--label:before,
32
- .ActionList-sectionHeader + .ActionList-item .ActionList-item-content--label:before {
33
- visibility: hidden;
34
- }
@@ -1,4 +0,0 @@
1
- @import '../support/index.scss';
2
- @import './action-list.scss';
3
- @import './action-list-item.scss';
4
- @import './action-list-item-divider.scss';
@@ -1,2 +0,0 @@
1
- .ActionList{padding:8px}.ActionList--divided .ActionList-item-content--label:before{content:"";display:block;position:absolute;width:100%;height:1px;background:#e9e9ed;top:-6px}.ActionList--divided .ActionList-item--nav-active .ActionList-item-content--label:before,.ActionList--divided .ActionList-item--nav-active+.ActionList-item .ActionList-item-content--label:before{visibility:hidden}.ActionList-item:first-of-type .ActionList-item-content--label:before,.ActionList-sectionDivider+.ActionList-item .ActionList-item-content--label:before,.ActionList-sectionHeader+.ActionList-item .ActionList-item-content--label:before{visibility:hidden}.ActionList-item{list-style:none;position:relative;border-radius:6px}.ActionList-item:hover,.ActionList-item:active{cursor:pointer}.ActionList-item:hover .ActionList-item-content,.ActionList-item:active .ActionList-item-content{text-decoration:none}.ActionList-item:not(.ActionList-item--has-sub-item):hover{background-color:#f0f3f5;cursor:pointer}.ActionList-item:not(.ActionList-item--has-sub-item):active{background:#e8ebed}@media screen and (prefers-reduced-motion: no-preference){.ActionList-item:not(.ActionList-item--has-sub-item):active{animation:ActionList-item-active-bg 4s forwards cubic-bezier(0.33, 1, 0.68, 1)}}@keyframes ActionList-item-active-bg{50%{transform:scale(1);box-shadow:inset 0 0 0 rgba(0,0,0,.04)}100%{transform:scale(0.97);box-shadow:inset 0 3px 9px rgba(0,0,0,.04)}}.ActionList-item:not(.ActionList-item--has-sub-item):hover .ActionList-item-content--label:before,.ActionList-item:not(.ActionList-item--has-sub-item):hover+.ActionList-item .ActionList-item-content--label:before,.ActionList-item:not(.ActionList-item--has-sub-item):active .ActionList-item-content--label:before,.ActionList-item:not(.ActionList-item--has-sub-item):active+.ActionList-item .ActionList-item-content--label:before{visibility:hidden}.ActionList-item.ActionList-item--has-sub-item>.ActionList-item-content:hover{background-color:#f0f3f5}.ActionList-item.ActionList-item--nav-active:not(.ActionList-item--danger){background:#f0f3f5}.ActionList-item.ActionList-item--nav-active:not(.ActionList-item--danger):before,.ActionList-item.ActionList-item--nav-active:not(.ActionList-item--danger)+.ActionList-item:before{visibility:hidden}.ActionList-item.ActionList-item--nav-active:not(.ActionList-item--danger):after{content:"";width:4px;height:24px;border-radius:4px;position:absolute;left:-8px;top:calc(50% - 12px);background:var(--color-accent-fg)}.ActionList-item[aria-expanded=true] .ActionList-item-content--collapseIcon{transform:rotate(0deg);transition:transform linear 50ms}.ActionList-item[aria-expanded=true] .ActionList-item--sub-group{display:block}.ActionList-item[aria-expanded=true].ActionList-item--has-sub-item>.ActionList-item-content>.ActionList-item-content--label{font-weight:600}.ActionList-item[aria-expanded=false] .ActionList-item-content--collapseIcon{transform:rotate(180deg);transition:transform linear 50ms}.ActionList-item[aria-expanded=false] .ActionList-item--sub-group{display:none}.ActionList-item[aria-checked=true] .ActionList-item-content--singleSelect{visibility:visible;opacity:1;transition:visibility 0s linear 0s,opacity 50ms}.ActionList-item[aria-checked=false] .ActionList-item-content--singleSelect{visibility:hidden;opacity:0;transition:visibility 0s linear 50ms,opacity 50ms}.ActionList-item.ActionList-item--danger .ActionList-item-content--label{color:var(--color-danger-fg)}@media(hover: hover)and (pointer: fine){.ActionList-item.ActionList-item--danger:hover{background:var(--color-danger-subtle)}}.ActionList-item.ActionList-item--danger:active{background:var(--color-danger-subtle)}.ActionList-item .ActionList{padding:unset}.ActionList-item-content{display:grid;grid-template-rows:minmax(20px, max-content);grid-template-areas:"leadingAction leadingVisual label trailingVisual trailingAction";grid-template-columns:min-content min-content minmax(min-content, auto) min-content min-content;align-items:center;padding:6px 8px;position:relative;border-radius:6px;font-weight:400;color:var(--color-fg-default);-webkit-user-select:none;user-select:none;transition:background 33.333ms linear}.ActionList-item-content>:not(:last-child){margin-right:8px}.ActionList-item-content:focus-visible{outline:none;box-shadow:0 0 0 2px var(--color-accent-fg);position:relative;z-index:1}.ActionList-item-content.ActionList-item-content--sizeMedium{grid-template-rows:minmax(28px, max-content)}.ActionList-item-content.ActionList-item-content--sizeLarge{grid-template-rows:minmax(36px, max-content)}@media(pointer: coarse){.ActionList-item-content{grid-template-rows:minmax(36px, max-content)}}.ActionList-item-content.ActionList-item-content--blockDescription .ActionList-item-content--visual{place-self:start}.ActionList-item-content--action-leading{grid-area:leadingAction}.ActionList-item-content--visual-leading{grid-area:leadingVisual}.ActionList-item-content--label{grid-area:label}.ActionList-item-content--visual-trailing{grid-area:trailingVisual}.ActionList-item-content--action-trailing{grid-area:trailingAction}.ActionList-item-content--label-blockDescription,.ActionList-item-content--label-inlineDescription{grid-area:label;display:flex}.ActionList-item-content--label-blockDescription .ActionList-item-content--label,.ActionList-item-content--label-inlineDescription .ActionList-item-content--label{font-weight:600}.ActionList-item-content--label-blockDescription{flex-direction:column}.ActionList-item-content--label-blockDescription .ActionList-item-content--description{margin-top:4px}.ActionList-item-content--label-inlineDescription{flex-direction:row;align-items:baseline}.ActionList-item-content--label-inlineDescription .ActionList-item-content--description{margin-left:8px}.ActionList-item-content--description{font-size:12px;line-height:1.5;color:var(--color-fg-muted)}.ActionList-item-content--visual,.ActionList-item-content--action{min-height:20px;display:flex;align-items:center;fill:var(--color-fg-muted);color:var(--color-fg-muted)}.ActionList-item-content--label{font-weight:400;color:var(--color-fg-default);position:relative}.ActionList-item--sub-item>.ActionList-item-content{font-size:12px}.ActionList-item--sub-group .ActionList-item--sub-item{padding-left:16px}.ActionList-item-content--visual--16+.ActionList-item--sub-group .ActionList-item--sub-item{padding-left:24px}.ActionList-item-content--visual--20+.ActionList-item--sub-group .ActionList-item--sub-item{padding-left:28px}.ActionList-item-content--visual--24+.ActionList-item--sub-group .ActionList-item--sub-item{padding-left:32px}.ActionList-sectionDivider{height:1px;background:#e9e9ed;border:0;margin:7px -8px 8px;padding:0;list-style:none}.ActionList-sectionDivider--filled{margin:8px -8px;background:var(--color-canvas-subtle);border-top:1px solid var(--color-scale-gray-2);border-bottom:1px solid var(--color-scale-gray-2)}.ActionList-sectionDivider--filled:empty{height:8px;box-sizing:border-box}.ActionList-sectionDivider--filled:first-child{margin-top:0}.ActionList-sectionHeader{padding:6px 8px;font-size:12px;font-weight:600;color:var(--color-fg-muted);display:flex;flex-direction:column}.ActionList-sectionHeader .ActionList-sectionHeader--description{font-size:12px;font-weight:400}
2
- /*# sourceMappingURL=actionlist.css.map */
@@ -1 +0,0 @@
1
- {"version":3,"sources":["file:///home/runner/work/css/css/src/actionlist/index.scss%23sass"],"names":[],"mappings":"AAyiBA,YAAA,WAAA,CAAA,4DAAA,UAAA,CAAA,aAAA,CAAA,iBAAA,CAAA,UAAA,CAAA,UAAA,CAAA,kBAAA,CAAA,QAAA,CAAA,mMAAA,iBAAA,CAAA,2OAAA,iBAAA,CAAA,iBAAA,eAAA,CAAA,iBAAA,CAAA,iBAAA,CAAA,+CAAA,cAAA,CAAA,iGAAA,oBAAA,CAAA,2DAAA,wBAAA,CAAA,cAAA,CAAA,4DAAA,kBAAA,CAAA,0DAAA,4DAAA,8EAAA,CAAA,CAAA,qCAAA,IAAA,kBAAA,CAAA,sCAAA,CAAA,KAAA,qBAAA,CAAA,0CAAA,CAAA,CAAA,4aAAA,iBAAA,CAAA,8EAAA,wBAAA,CAAA,2EAAA,kBAAA,CAAA,qLAAA,iBAAA,CAAA,iFAAA,UAAA,CAAA,SAAA,CAAA,WAAA,CAAA,iBAAA,CAAA,iBAAA,CAAA,SAAA,CAAA,oBAAA,CAAA,iCAAA,CAAA,4EAAA,sBAAA,CAAA,gCAAA,CAAA,iEAAA,aAAA,CAAA,4HAAA,eAAA,CAAA,6EAAA,wBAAA,CAAA,gCAAA,CAAA,kEAAA,YAAA,CAAA,2EAAA,kBAAA,CAAA,SAAA,CAAA,+CAAA,CAAA,4EAAA,iBAAA,CAAA,SAAA,CAAA,iDAAA,CAAA,yEAAA,4BAAA,CAAA,wCAAA,+CAAA,qCAAA,CAAA,CAAA,gDAAA,qCAAA,CAAA,6BAAA,aAAA,CAAA,yBAAA,YAAA,CAAA,4CAAA,CAAA,qFAAA,CAAA,+FAAA,CAAA,kBAAA,CAAA,eAAA,CAAA,iBAAA,CAAA,iBAAA,CAAA,eAAA,CAAA,6BAAA,CAAA,wBAAA,CAAA,gBAAA,CAAA,qCAAA,CAAA,2CAAA,gBAAA,CAAA,uCAAA,YAAA,CAAA,2CAAA,CAAA,iBAAA,CAAA,SAAA,CAAA,6DAAA,4CAAA,CAAA,4DAAA,4CAAA,CAAA,wBAAA,yBAAA,4CAAA,CAAA,CAAA,oGAAA,gBAAA,CAAA,yCAAA,uBAAA,CAAA,yCAAA,uBAAA,CAAA,gCAAA,eAAA,CAAA,0CAAA,wBAAA,CAAA,0CAAA,wBAAA,CAAA,mGAAA,eAAA,CAAA,YAAA,CAAA,mKAAA,eAAA,CAAA,iDAAA,qBAAA,CAAA,uFAAA,cAAA,CAAA,kDAAA,kBAAA,CAAA,oBAAA,CAAA,wFAAA,eAAA,CAAA,sCAAA,cAAA,CAAA,eAAA,CAAA,2BAAA,CAAA,kEAAA,eAAA,CAAA,YAAA,CAAA,kBAAA,CAAA,0BAAA,CAAA,2BAAA,CAAA,gCAAA,eAAA,CAAA,6BAAA,CAAA,iBAAA,CAAA,oDAAA,cAAA,CAAA,uDAAA,iBAAA,CAAA,4FAAA,iBAAA,CAAA,4FAAA,iBAAA,CAAA,4FAAA,iBAAA,CAAA,2BAAA,UAAA,CAAA,kBAAA,CAAA,QAAA,CAAA,mBAAA,CAAA,SAAA,CAAA,eAAA,CAAA,mCAAA,eAAA,CAAA,qCAAA,CAAA,8CAAA,CAAA,iDAAA,CAAA,yCAAA,UAAA,CAAA,qBAAA,CAAA,+CAAA,YAAA,CAAA,0BAAA,eAAA,CAAA,cAAA,CAAA,eAAA,CAAA,2BAAA,CAAA,YAAA,CAAA,qBAAA,CAAA,iEAAA,cAAA,CAAA,eAAA","file":"actionlist.css"}
@@ -1 +0,0 @@
1
- export {cssstats: require('./stats/actionlist.json')}
@@ -1 +0,0 @@
1
- {"size":7274,"gzipSize":1549,"humanizedSize":"7KB","humanizedGzipSize":"2KB","rules":{"total":60,"size":{"graph":[1,7,1,1,3,1,1,2,1,1,2,2,1,1,1,1,8,2,1,1,2,1,3,3,1,1,1,1,13,1,4,1,1,1,1,1,1,1,1,1,2,1,1,1,2,1,3,5,3,1,1,1,1,1,6,4,2,1,6,2],"max":13,"average":2.066666666666667},"selectorByRuleSizes":[{"selector":".ActionList-item-content","declarations":13},{"selector":".ActionList-item.ActionList-item--nav-active:not(.ActionList-item--danger):after","declarations":8},{"selector":".ActionList--divided .ActionList-item-content--label:before","declarations":7},{"selector":".ActionList-sectionHeader","declarations":6},{"selector":".ActionList-sectionDivider","declarations":6},{"selector":".ActionList-item-content--visual,.ActionList-item-content--action","declarations":5},{"selector":".ActionList-sectionDivider--filled","declarations":4},{"selector":".ActionList-item-content:focus-visible","declarations":4},{"selector":".ActionList-item-content--label","declarations":3},{"selector":".ActionList-item-content--description","declarations":3},{"selector":".ActionList-item[aria-checked=false] .ActionList-item-content--singleSelect","declarations":3},{"selector":".ActionList-item[aria-checked=true] .ActionList-item-content--singleSelect","declarations":3},{"selector":".ActionList-item","declarations":3},{"selector":".ActionList-sectionHeader .ActionList-sectionHeader--description","declarations":2},{"selector":".ActionList-sectionDivider--filled:empty","declarations":2},{"selector":".ActionList-item-content--label-inlineDescription","declarations":2},{"selector":".ActionList-item-content--label-blockDescription,.ActionList-item-content--label-inlineDescription","declarations":2},{"selector":".ActionList-item[aria-expanded=false] .ActionList-item-content--collapseIcon","declarations":2},{"selector":".ActionList-item[aria-expanded=true] .ActionList-item-content--collapseIcon","declarations":2},{"selector":"100%","declarations":2},{"selector":"50%","declarations":2},{"selector":".ActionList-item:not(.ActionList-item--has-sub-item):hover","declarations":2},{"selector":".ActionList-sectionDivider--filled:first-child","declarations":1},{"selector":".ActionList-item-content--visual--24+.ActionList-item--sub-group .ActionList-item--sub-item","declarations":1},{"selector":".ActionList-item-content--visual--20+.ActionList-item--sub-group .ActionList-item--sub-item","declarations":1},{"selector":".ActionList-item-content--visual--16+.ActionList-item--sub-group .ActionList-item--sub-item","declarations":1},{"selector":".ActionList-item--sub-group .ActionList-item--sub-item","declarations":1},{"selector":".ActionList-item--sub-item>.ActionList-item-content","declarations":1},{"selector":".ActionList-item-content--label-inlineDescription .ActionList-item-content--description","declarations":1},{"selector":".ActionList-item-content--label-blockDescription .ActionList-item-content--description","declarations":1},{"selector":".ActionList-item-content--label-blockDescription","declarations":1},{"selector":".ActionList-item-content--label-blockDescription .ActionList-item-content--label,.ActionList-item-content--label-inlineDescription .ActionList-item-content--label","declarations":1},{"selector":".ActionList-item-content--action-trailing","declarations":1},{"selector":".ActionList-item-content--visual-trailing","declarations":1},{"selector":".ActionList-item-content--label","declarations":1},{"selector":".ActionList-item-content--visual-leading","declarations":1},{"selector":".ActionList-item-content--action-leading","declarations":1},{"selector":".ActionList-item-content.ActionList-item-content--blockDescription .ActionList-item-content--visual","declarations":1},{"selector":".ActionList-item-content","declarations":1},{"selector":".ActionList-item-content.ActionList-item-content--sizeLarge","declarations":1},{"selector":".ActionList-item-content.ActionList-item-content--sizeMedium","declarations":1},{"selector":".ActionList-item-content>:not(:last-child)","declarations":1},{"selector":".ActionList-item .ActionList","declarations":1},{"selector":".ActionList-item.ActionList-item--danger:active","declarations":1},{"selector":".ActionList-item.ActionList-item--danger:hover","declarations":1},{"selector":".ActionList-item.ActionList-item--danger .ActionList-item-content--label","declarations":1},{"selector":".ActionList-item[aria-expanded=false] .ActionList-item--sub-group","declarations":1},{"selector":".ActionList-item[aria-expanded=true].ActionList-item--has-sub-item>.ActionList-item-content>.ActionList-item-content--label","declarations":1},{"selector":".ActionList-item[aria-expanded=true] .ActionList-item--sub-group","declarations":1},{"selector":".ActionList-item.ActionList-item--nav-active:not(.ActionList-item--danger):before,.ActionList-item.ActionList-item--nav-active:not(.ActionList-item--danger)+.ActionList-item:before","declarations":1},{"selector":".ActionList-item.ActionList-item--nav-active:not(.ActionList-item--danger)","declarations":1},{"selector":".ActionList-item.ActionList-item--has-sub-item>.ActionList-item-content:hover","declarations":1},{"selector":".ActionList-item:not(.ActionList-item--has-sub-item):hover .ActionList-item-content--label:before,.ActionList-item:not(.ActionList-item--has-sub-item):hover+.ActionList-item .ActionList-item-content--label:before,.ActionList-item:not(.ActionList-item--has-sub-item):active .ActionList-item-content--label:before,.ActionList-item:not(.ActionList-item--has-sub-item):active+.ActionList-item .ActionList-item-content--label:before","declarations":1},{"selector":".ActionList-item:not(.ActionList-item--has-sub-item):active","declarations":1},{"selector":".ActionList-item:not(.ActionList-item--has-sub-item):active","declarations":1},{"selector":".ActionList-item:hover .ActionList-item-content,.ActionList-item:active .ActionList-item-content","declarations":1},{"selector":".ActionList-item:hover,.ActionList-item:active","declarations":1},{"selector":".ActionList-item:first-of-type .ActionList-item-content--label:before,.ActionList-sectionDivider+.ActionList-item .ActionList-item-content--label:before,.ActionList-sectionHeader+.ActionList-item .ActionList-item-content--label:before","declarations":1},{"selector":".ActionList--divided .ActionList-item--nav-active .ActionList-item-content--label:before,.ActionList--divided .ActionList-item--nav-active+.ActionList-item .ActionList-item-content--label:before","declarations":1},{"selector":".ActionList","declarations":1}]},"selectors":{"total":70,"type":0,"class":70,"id":0,"pseudoClass":23,"pseudoElement":13,"values":[".ActionList",".ActionList--divided .ActionList-item-content--label:before",".ActionList--divided .ActionList-item--nav-active .ActionList-item-content--label:before",".ActionList--divided .ActionList-item--nav-active+.ActionList-item .ActionList-item-content--label:before",".ActionList-item:first-of-type .ActionList-item-content--label:before",".ActionList-sectionDivider+.ActionList-item .ActionList-item-content--label:before",".ActionList-sectionHeader+.ActionList-item .ActionList-item-content--label:before",".ActionList-item",".ActionList-item:hover",".ActionList-item:active",".ActionList-item:hover .ActionList-item-content",".ActionList-item:active .ActionList-item-content",".ActionList-item:not(.ActionList-item--has-sub-item):hover",".ActionList-item:not(.ActionList-item--has-sub-item):active",".ActionList-item:not(.ActionList-item--has-sub-item):active",".ActionList-item:not(.ActionList-item--has-sub-item):hover .ActionList-item-content--label:before",".ActionList-item:not(.ActionList-item--has-sub-item):hover+.ActionList-item .ActionList-item-content--label:before",".ActionList-item:not(.ActionList-item--has-sub-item):active .ActionList-item-content--label:before",".ActionList-item:not(.ActionList-item--has-sub-item):active+.ActionList-item .ActionList-item-content--label:before",".ActionList-item.ActionList-item--has-sub-item>.ActionList-item-content:hover",".ActionList-item.ActionList-item--nav-active:not(.ActionList-item--danger)",".ActionList-item.ActionList-item--nav-active:not(.ActionList-item--danger):before",".ActionList-item.ActionList-item--nav-active:not(.ActionList-item--danger)+.ActionList-item:before",".ActionList-item.ActionList-item--nav-active:not(.ActionList-item--danger):after",".ActionList-item[aria-expanded=true] .ActionList-item-content--collapseIcon",".ActionList-item[aria-expanded=true] .ActionList-item--sub-group",".ActionList-item[aria-expanded=true].ActionList-item--has-sub-item>.ActionList-item-content>.ActionList-item-content--label",".ActionList-item[aria-expanded=false] .ActionList-item-content--collapseIcon",".ActionList-item[aria-expanded=false] .ActionList-item--sub-group",".ActionList-item[aria-checked=true] .ActionList-item-content--singleSelect",".ActionList-item[aria-checked=false] .ActionList-item-content--singleSelect",".ActionList-item.ActionList-item--danger .ActionList-item-content--label",".ActionList-item.ActionList-item--danger:hover",".ActionList-item.ActionList-item--danger:active",".ActionList-item .ActionList",".ActionList-item-content",".ActionList-item-content>:not(:last-child)",".ActionList-item-content:focus-visible",".ActionList-item-content.ActionList-item-content--sizeMedium",".ActionList-item-content.ActionList-item-content--sizeLarge",".ActionList-item-content",".ActionList-item-content.ActionList-item-content--blockDescription .ActionList-item-content--visual",".ActionList-item-content--action-leading",".ActionList-item-content--visual-leading",".ActionList-item-content--label",".ActionList-item-content--visual-trailing",".ActionList-item-content--action-trailing",".ActionList-item-content--label-blockDescription",".ActionList-item-content--label-inlineDescription",".ActionList-item-content--label-blockDescription .ActionList-item-content--label",".ActionList-item-content--label-inlineDescription .ActionList-item-content--label",".ActionList-item-content--label-blockDescription",".ActionList-item-content--label-blockDescription .ActionList-item-content--description",".ActionList-item-content--label-inlineDescription",".ActionList-item-content--label-inlineDescription .ActionList-item-content--description",".ActionList-item-content--description",".ActionList-item-content--visual",".ActionList-item-content--action",".ActionList-item-content--label",".ActionList-item--sub-item>.ActionList-item-content",".ActionList-item--sub-group .ActionList-item--sub-item",".ActionList-item-content--visual--16+.ActionList-item--sub-group .ActionList-item--sub-item",".ActionList-item-content--visual--20+.ActionList-item--sub-group .ActionList-item--sub-item",".ActionList-item-content--visual--24+.ActionList-item--sub-group .ActionList-item--sub-item",".ActionList-sectionDivider",".ActionList-sectionDivider--filled",".ActionList-sectionDivider--filled:empty",".ActionList-sectionDivider--filled:first-child",".ActionList-sectionHeader",".ActionList-sectionHeader .ActionList-sectionHeader--description"],"specificity":{"max":51,"average":23.614285714285714}},"declarations":{"total":124,"unique":89,"uniqueToTotalRatio":0.717741935483871,"properties":{"padding":["8px","unset","6px 8px","0","6px 8px"],"content":["\"\"","\"\""],"display":["block","block","none","grid","flex","flex","flex"],"position":["absolute","relative","absolute","relative","relative","relative"],"width":["100%","4px"],"height":["1px","24px","1px","8px"],"background":["#e9e9ed","#e8ebed","#f0f3f5","var(--color-accent-fg)","var(--color-danger-subtle)","var(--color-danger-subtle)","#e9e9ed","var(--color-canvas-subtle)"],"top":["-6px","calc(50% - 12px)"],"visibility":["hidden","hidden","hidden","hidden","visible","hidden"],"list-style":["none","none"],"border-radius":["6px","4px","6px"],"cursor":["pointer","pointer"],"text-decoration":["none"],"background-color":["#f0f3f5","#f0f3f5"],"animation":["ActionList-item-active-bg 4s forwards cubic-bezier(0.33, 1, 0.68, 1)"],"transform":["scale(1)","scale(0.97)","rotate(0deg)","rotate(180deg)"],"box-shadow":["inset 0 0 0 rgba(0,0,0,.04)","inset 0 3px 9px rgba(0,0,0,.04)","0 0 0 2px var(--color-accent-fg)"],"left":["-8px"],"transition":["transform linear 50ms","transform linear 50ms","visibility 0s linear 0s,opacity 50ms","visibility 0s linear 50ms,opacity 50ms","background 33.333ms linear"],"font-weight":["600","400","600","400","600","400"],"opacity":["1","0"],"color":["var(--color-danger-fg)","var(--color-fg-default)","var(--color-fg-muted)","var(--color-fg-muted)","var(--color-fg-default)","var(--color-fg-muted)"],"grid-template-rows":["minmax(20px, max-content)","minmax(28px, max-content)","minmax(36px, max-content)","minmax(36px, max-content)"],"grid-template-areas":["\"leadingAction leadingVisual label trailingVisual trailingAction\""],"grid-template-columns":["min-content min-content minmax(min-content, auto) min-content min-content"],"align-items":["center","baseline","center"],"-webkit-user-select":["none"],"user-select":["none"],"margin-right":["8px"],"outline":["none"],"z-index":["1"],"place-self":["start"],"grid-area":["leadingAction","leadingVisual","label","trailingVisual","trailingAction","label"],"flex-direction":["column","row","column"],"margin-top":["4px","0"],"margin-left":["8px"],"font-size":["12px","12px","12px","12px"],"line-height":["1.5"],"min-height":["20px"],"fill":["var(--color-fg-muted)"],"padding-left":["16px","24px","28px","32px"],"border":["0"],"margin":["7px -8px 8px","8px -8px"],"border-top":["1px solid var(--color-scale-gray-2)"],"border-bottom":["1px solid var(--color-scale-gray-2)"],"box-sizing":["border-box"]}},"mediaQueries":{"total":3,"unique":3,"values":["screen and (prefers-reduced-motion: no-preference)","(hover: hover)and (pointer: fine)","(pointer: coarse)"],"contents":[{"value":"screen and (prefers-reduced-motion: no-preference)","rules":{"total":1,"size":{"graph":[1],"max":1,"average":1},"selectorByRuleSizes":[{"selector":".ActionList-item:not(.ActionList-item--has-sub-item):active","declarations":1}]},"selectors":{"total":1,"type":0,"class":1,"id":0,"pseudoClass":1,"pseudoElement":0,"values":[".ActionList-item:not(.ActionList-item--has-sub-item):active"],"specificity":{"max":30,"average":30}},"declarations":{"total":1,"unique":1,"uniqueToTotalRatio":1,"properties":{"animation":["ActionList-item-active-bg 4s forwards cubic-bezier(0.33, 1, 0.68, 1)"]}}},{"value":"(hover: hover)and (pointer: fine)","rules":{"total":1,"size":{"graph":[1],"max":1,"average":1},"selectorByRuleSizes":[{"selector":".ActionList-item.ActionList-item--danger:hover","declarations":1}]},"selectors":{"total":1,"type":0,"class":1,"id":0,"pseudoClass":1,"pseudoElement":0,"values":[".ActionList-item.ActionList-item--danger:hover"],"specificity":{"max":30,"average":30}},"declarations":{"total":1,"unique":1,"uniqueToTotalRatio":1,"properties":{"background":["var(--color-danger-subtle)"]}}},{"value":"(pointer: coarse)","rules":{"total":1,"size":{"graph":[1],"max":1,"average":1},"selectorByRuleSizes":[{"selector":".ActionList-item-content","declarations":1}]},"selectors":{"total":1,"type":0,"class":1,"id":0,"pseudoClass":0,"pseudoElement":0,"values":[".ActionList-item-content"],"specificity":{"max":10,"average":10}},"declarations":{"total":1,"unique":1,"uniqueToTotalRatio":1,"properties":{"grid-template-rows":["minmax(36px, max-content)"]}}}]}}