Skip to content

Commit 491dbcb

Browse files
pfultonpfulton
committed
fix: restore files to pre-formatted state
1 parent cb87e41 commit 491dbcb

File tree

204 files changed

+18435
-27969
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

204 files changed

+18435
-27969
lines changed

‎components/accordion/index.css

Lines changed: 127 additions & 116 deletions
Original file line numberDiff line numberDiff line change
@@ -12,146 +12,157 @@ governing permissions and limitations under the License.
1212

1313
/* https://git.corp.adobe.com/Spectrum/spectrum-origins/pull/60 */
1414
.spectrum-Accordion {
15-
/* Subtract the size of the border since it's on the item itself */
16-
--spectrum-accordion-item-height-actual: calc(
17-
var(--spectrum-accordion-item-height) -
18-
var(--spectrum-accordion-item-border-size)
19-
);
20-
--spectrum-accordion-item-title-padding-y: var(
21-
--spectrum-global-dimension-size-150
22-
);
23-
--spectrum-accordion-animation-duration: var(
24-
--spectrum-global-animation-duration-100
25-
);
15+
/* Subtract the size of the border since it's on the item itself */
16+
--spectrum-accordion-item-height-actual: calc(
17+
var(--spectrum-accordion-item-height) -
18+
var(--spectrum-accordion-item-border-size)
19+
);
20+
--spectrum-accordion-item-title-padding-y: var(
21+
--spectrum-global-dimension-size-150
22+
);
23+
--spectrum-accordion-animation-duration: var(
24+
--spectrum-global-animation-duration-100
25+
);
2626
}
2727

2828
.spectrum-Accordion {
29-
display: block;
30-
list-style: none;
31-
padding: 0;
32-
margin: 0;
29+
display: block;
30+
list-style: none;
31+
padding: 0;
32+
margin: 0;
3333
}
3434

3535
.spectrum-Accordion-itemIndicator {
36-
display: block;
36+
display: block;
3737

38-
position: absolute;
39-
inset-inline-start: var(--spectrum-accordion-item-padding-x);
40-
inset-block-start: calc(50% - var(--spectrum-accordion-icon-height) / 2);
38+
position: absolute;
39+
inset-inline-start: var(--spectrum-accordion-item-padding-x);
40+
inset-block-start: calc(
41+
50% -
42+
var(--spectrum-accordion-icon-height) / 2
43+
);
4144

42-
transition: transform ease var(--spectrum-accordion-animation-duration);
43-
transform: logical rotate(0deg);
45+
transition: transform ease var(--spectrum-accordion-animation-duration);
46+
transform: logical rotate(0deg);
4447
}
4548

4649
.spectrum-Accordion-item {
47-
z-index: inherit;
48-
position: relative;
50+
z-index: inherit;
51+
position: relative;
4952

50-
display: list-item;
51-
margin: 0;
53+
display: list-item;
54+
margin: 0;
5255

53-
border-block-end: var(--spectrum-accordion-item-border-size) solid transparent;
56+
border-block-end: var(--spectrum-accordion-item-border-size) solid transparent;
5457

55-
&:first-of-type {
56-
border-block-start: var(--spectrum-accordion-item-border-size) solid
57-
transparent;
58-
}
58+
&:first-of-type {
59+
border-block-start: var(--spectrum-accordion-item-border-size) solid
60+
transparent;
61+
}
5962
}
6063

6164
.spectrum-Accordion-itemHeading {
62-
margin: 0;
63-
position: relative;
64-
box-sizing: border-box;
65+
margin: 0;
66+
position: relative;
67+
box-sizing: border-box;
6568
}
6669

6770
.spectrum-Accordion-itemHeader {
68-
position: relative;
69-
70-
display: flex;
71-
align-items: center;
72-
justify-content: flex-start;
73-
74-
box-sizing: border-box;
75-
/* left padding takes into account the icon's size as well as the focus state's left border */
76-
padding-block: var(--spectrum-accordion-item-title-padding-y);
77-
/* using icon-height instead of icon-width for space with rotating the icon */
78-
padding-inline-start: calc(
79-
var(--spectrum-accordion-item-padding-x) +
80-
var(--spectrum-accordion-icon-height) + var(--spectrum-accordion-icon-gap) +
81-
var(--spectrum-accordion-item-border-left-size)
82-
);
83-
padding-inline-end: var(--spectrum-accordion-item-padding-x);
84-
margin: 0;
85-
86-
min-block-size: calc(100% - var(--spectrum-accordion-item-border-size));
87-
88-
font-size: var(--spectrum-accordion-item-title-text-size);
89-
line-height: var(--spectrum-accordion-text-line-height);
90-
text-transform: uppercase;
91-
letter-spacing: calc(var(--spectrum-accordion-item-title-tracking) / 100);
92-
93-
text-overflow: ellipsis;
94-
cursor: pointer;
95-
font-weight: 500;
96-
97-
/* reset styling if button element is used */
98-
-webkit-appearance: none;
99-
-moz-appearance: none;
100-
appearance: none;
101-
background-color: inherit;
102-
border: 0;
103-
font-family: inherit;
104-
text-align: start;
105-
inline-size: 100%;
106-
107-
&:focus {
108-
outline: none;
109-
110-
&::after {
111-
content: "";
112-
113-
position: absolute;
114-
inset-inline-start: 0;
115-
inset-block-start: calc(-1 * var(--spectrum-accordion-item-border-size));
116-
inset-block-end: calc(-1 * var(--spectrum-accordion-item-border-size));
117-
118-
inline-size: var(--spectrum-accordion-item-border-left-size);
119-
}
120-
}
71+
position: relative;
72+
73+
display: flex;
74+
align-items: center;
75+
justify-content: flex-start;
76+
77+
box-sizing: border-box;
78+
/* left padding takes into account the icon's size as well as the focus state's left border */
79+
padding-block: var(--spectrum-accordion-item-title-padding-y);
80+
/* using icon-height instead of icon-width for space with rotating the icon */
81+
padding-inline-start: calc(
82+
var(--spectrum-accordion-item-padding-x) +
83+
var(--spectrum-accordion-icon-height) + var(--spectrum-accordion-icon-gap) +
84+
var(--spectrum-accordion-item-border-left-size)
85+
);
86+
padding-inline-end: var(--spectrum-accordion-item-padding-x);
87+
margin: 0;
88+
89+
min-block-size: calc(
90+
100% -
91+
var(--spectrum-accordion-item-border-size)
92+
);
93+
94+
font-size: var(--spectrum-accordion-item-title-text-size);
95+
line-height: var(--spectrum-accordion-text-line-height);
96+
text-transform: uppercase;
97+
letter-spacing: calc(
98+
var(--spectrum-accordion-item-title-tracking) / 100
99+
);
100+
101+
text-overflow: ellipsis;
102+
cursor: pointer;
103+
font-weight: 500;
104+
105+
/* reset styling if button element is used */
106+
-webkit-appearance: none;
107+
-moz-appearance: none;
108+
appearance: none;
109+
background-color: inherit;
110+
border: 0;
111+
font-family: inherit;
112+
text-align: start;
113+
inline-size: 100%;
114+
115+
&:focus {
116+
outline: none;
117+
118+
&::after {
119+
content: "";
120+
121+
position: absolute;
122+
inset-inline-start: 0;
123+
inset-block-start: calc(-1 * var(--spectrum-accordion-item-border-size));
124+
inset-block-end: calc(-1 * var(--spectrum-accordion-item-border-size));
125+
126+
inline-size: var(--spectrum-accordion-item-border-left-size);
127+
}
128+
}
121129
}
122130

123131
.spectrum-Accordion-itemContent {
124-
padding-block: 0 var(--spectrum-accordion-item-content-padding);
125-
padding-inline: var(--spectrum-accordion-item-content-padding)
126-
var(--spectrum-accordion-item-content-padding);
127-
display: none;
132+
padding-block: 0 var(--spectrum-accordion-item-content-padding);
133+
padding-inline: var(--spectrum-accordion-item-content-padding)
134+
var(--spectrum-accordion-item-content-padding);
135+
display: none;
128136
}
129137

130138
.spectrum-Accordion-item {
131-
&.is-open {
132-
> .spectrum-Accordion-itemHeading {
133-
> .spectrum-Accordion-itemIndicator {
134-
transform: logical rotate(90deg);
135-
}
136-
}
137-
138-
> .spectrum-Accordion-itemIndicator {
139-
transform: logical rotate(90deg);
140-
}
141-
142-
> .spectrum-Accordion-itemHeader::after {
143-
/* No bottom border when open, so be less tall */
144-
block-size: calc(100% - var(--spectrum-accordion-item-border-size));
145-
}
146-
147-
> .spectrum-Accordion-itemContent {
148-
display: block;
149-
}
150-
}
151-
152-
&.is-disabled {
153-
.spectrum-Accordion-itemHeader {
154-
cursor: default;
155-
}
156-
}
139+
&.is-open {
140+
> .spectrum-Accordion-itemHeading {
141+
> .spectrum-Accordion-itemIndicator {
142+
transform: logical rotate(90deg);
143+
}
144+
}
145+
146+
> .spectrum-Accordion-itemIndicator {
147+
transform: logical rotate(90deg);
148+
}
149+
150+
> .spectrum-Accordion-itemHeader::after {
151+
/* No bottom border when open, so be less tall */
152+
block-size: calc(
153+
100% -
154+
var(--spectrum-accordion-item-border-size)
155+
);
156+
}
157+
158+
> .spectrum-Accordion-itemContent {
159+
display: block;
160+
}
161+
}
162+
163+
&.is-disabled {
164+
.spectrum-Accordion-itemHeader {
165+
cursor: default;
166+
}
167+
}
157168
}

‎components/accordion/skin.css

Lines changed: 40 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -11,63 +11,63 @@ governing permissions and limitations under the License.
1111
*/
1212

1313
.spectrum-Accordion-item {
14-
border-color: var(--spectrum-accordion-border-color);
14+
border-color: var(--spectrum-accordion-border-color);
1515
}
1616

1717
.spectrum-Accordion-itemIndicator {
18-
color: var(--spectrum-accordion-icon-color);
18+
color: var(--spectrum-accordion-icon-color);
1919
}
2020

2121
.spectrum-Accordion-itemHeader {
22-
color: var(--spectrum-accordion-text-color);
22+
color: var(--spectrum-accordion-text-color);
2323

24-
&:hover {
25-
color: var(--spectrum-accordion-text-color-hover);
24+
&:hover {
25+
color: var(--spectrum-accordion-text-color-hover);
2626

27-
background-color: var(--spectrum-accordion-item-background-color-hover);
27+
background-color: var(--spectrum-accordion-item-background-color-hover);
2828

29-
+ .spectrum-Accordion-itemIndicator {
30-
color: var(--spectrum-accordion-icon-color-hover);
31-
}
32-
}
29+
+ .spectrum-Accordion-itemIndicator {
30+
color: var(--spectrum-accordion-icon-color-hover);
31+
}
32+
}
3333

34-
&:focus-ring {
35-
&:after {
36-
background-color: var(
37-
--spectrum-accordion-item-border-left-color-key-focus
38-
);
39-
}
40-
}
34+
&:focus-ring {
35+
&:after {
36+
background-color: var(
37+
--spectrum-accordion-item-border-left-color-key-focus
38+
);
39+
}
40+
}
4141
}
4242

4343
.spectrum-Accordion-item {
44-
&.is-open {
45-
.spectrum-Accordion-itemHeader {
46-
&:hover {
47-
background-color: transparent;
48-
}
49-
}
50-
}
44+
&.is-open {
45+
.spectrum-Accordion-itemHeader {
46+
&:hover {
47+
background-color: transparent;
48+
}
49+
}
50+
}
5151
}
5252

5353
.spectrum-Accordion-item.is-disabled {
54-
.spectrum-Accordion-itemHeader {
55-
&,
56-
&:hover,
57-
&:focus-ring {
58-
color: var(--spectrum-accordion-text-color-disabled);
59-
background-color: transparent;
60-
}
54+
.spectrum-Accordion-itemHeader {
55+
&,
56+
&:hover,
57+
&:focus-ring {
58+
color: var(--spectrum-accordion-text-color-disabled);
59+
background-color: transparent;
60+
}
6161

62-
+ .spectrum-Accordion-itemIndicator {
63-
color: var(--spectrum-accordion-icon-color-disabled);
64-
}
65-
}
62+
+ .spectrum-Accordion-itemIndicator {
63+
color: var(--spectrum-accordion-icon-color-disabled);
64+
}
65+
}
6666
}
6767
@media (forced-colors: active) {
68-
.spectrum-Accordion-itemHeader {
69-
&:focus-ring {
70-
outline: 3px solid CanvasText;
71-
}
72-
}
68+
.spectrum-Accordion-itemHeader {
69+
&:focus-ring {
70+
outline: 3px solid CanvasText;
71+
}
72+
}
7373
}

0 commit comments

Comments
 (0)