Skip to content

Commit d1824a3

Browse files
castastrophecastastrophe
committed
fix: full update for css packages
1 parent 7d9526e commit d1824a3

File tree

239 files changed

+21081
-21178
lines changed

Some content is hidden

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

239 files changed

+21081
-21178
lines changed

‎packages/accordion/src/accordion-item-overrides.css

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

1313
/* THIS FILE IS MACHINE GENERATED. DO NOT EDIT */
14+
15+

‎packages/accordion/src/accordion-overrides.css

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,8 @@ governing permissions and limitations under the License.
1212

1313
/* THIS FILE IS MACHINE GENERATED. DO NOT EDIT */
1414
:host {
15-
--spectrum-accordion-divider-color: var(--system-accordion-divider-color);
16-
--spectrum-accordion-item-content-disabled-color: var(--system-accordion-item-content-disabled-color);
17-
--spectrum-accordion-item-content-color: var(--system-accordion-item-content-color);
15+
--spectrum-accordion-divider-color: var(--system-accordion-divider-color);
16+
--spectrum-accordion-item-content-disabled-color: var(--system-accordion-item-content-disabled-color);
17+
--spectrum-accordion-item-content-color: var(--system-accordion-item-content-color);
1818
}
19+

‎packages/accordion/src/spectrum-accordion-item.css

Lines changed: 97 additions & 100 deletions
Original file line numberDiff line numberDiff line change
@@ -12,158 +12,155 @@ governing permissions and limitations under the License.
1212

1313
/* THIS FILE IS MACHINE GENERATED. DO NOT EDIT */
1414
:host {
15-
z-index: inherit;
16-
min-block-size: var(--mod-accordion-item-height, var(--spectrum-accordion-item-height));
17-
min-inline-size: var(--mod-accordion-item-width, var(--spectrum-accordion-item-width));
18-
border-block-end: 1px solid #0000;
19-
border-color: var(--mod-accordion-divider-color, var(--spectrum-accordion-divider-color));
20-
border-width: var(--mod-accordion-divider-thickness, var(--spectrum-divider-thickness-small));
21-
margin: 0;
22-
position: relative;
15+
z-index: inherit;
16+
min-block-size: var(--mod-accordion-item-height, var(--spectrum-accordion-item-height));
17+
min-inline-size: var(--mod-accordion-item-width, var(--spectrum-accordion-item-width));
18+
border-block-end: 1px solid #0000;
19+
border-color: var(--mod-accordion-divider-color, var(--spectrum-accordion-divider-color));
20+
border-width: var(--mod-accordion-divider-thickness, var(--spectrum-divider-thickness-small));
21+
margin: 0;
22+
position: relative;
2323
}
2424

2525
:host(:first-child) {
26-
border-block-start: 1px solid #0000;
27-
border-color: var(--mod-accordion-divider-color, var(--spectrum-accordion-divider-color));
28-
border-width: var(--mod-accordion-divider-thickness, var(--spectrum-divider-thickness-small));
26+
border-block-start: 1px solid #0000;
27+
border-color: var(--mod-accordion-divider-color, var(--spectrum-accordion-divider-color));
28+
border-width: var(--mod-accordion-divider-thickness, var(--spectrum-divider-thickness-small));
2929
}
3030

3131
#heading {
32-
box-sizing: border-box;
33-
margin: 0;
34-
position: relative;
32+
box-sizing: border-box;
33+
margin: 0;
34+
position: relative;
3535
}
3636

3737
.iconContainer {
38-
inline-size: var(--mod-accordion-disclosure-indicator-height, var(--spectrum-accordion-disclosure-indicator-height));
39-
block-size: var(--mod-accordion-disclosure-indicator-height, var(--spectrum-accordion-disclosure-indicator-height));
40-
color: var(--mod-accordion-item-header-color-default, var(--spectrum-accordion-item-header-color-default));
41-
justify-content: center;
42-
align-items: center;
43-
padding-inline-start: var(--mod-accordion-edge-to-disclosure-indicator-space, var(--spectrum-accordion-edge-to-disclosure-indicator-space));
44-
display: flex;
45-
position: absolute;
46-
inset-block-start: max(0px, calc((var(--mod-accordion-min-block-size, var(--spectrum-accordion-min-block-size)) - var(--mod-accordion-disclosure-indicator-height, var(--spectrum-accordion-disclosure-indicator-height))) / 2));
38+
inline-size: var(--mod-accordion-disclosure-indicator-height, var(--spectrum-accordion-disclosure-indicator-height));
39+
block-size: var(--mod-accordion-disclosure-indicator-height, var(--spectrum-accordion-disclosure-indicator-height));
40+
color: var(--mod-accordion-item-header-color-default, var(--spectrum-accordion-item-header-color-default));
41+
justify-content: center;
42+
align-items: center;
43+
padding-inline-start: var(--mod-accordion-edge-to-disclosure-indicator-space, var(--spectrum-accordion-edge-to-disclosure-indicator-space));
44+
display: flex;
45+
position: absolute;
46+
inset-block-start: max(0px, calc((var(--mod-accordion-min-block-size, var(--spectrum-accordion-min-block-size)) - var(--mod-accordion-disclosure-indicator-height, var(--spectrum-accordion-disclosure-indicator-height))) / 2));
4747
}
4848

49-
.iconContainer:dir(rtl),
50-
:host([dir="rtl"]) .iconContainer {
51-
transform: scaleX(-1);
49+
.iconContainer:dir(rtl), :host([dir="rtl"]) .iconContainer {
50+
transform: scaleX(-1);
5251
}
5352

5453
#content {
55-
padding-block: var(--mod-accordion-item-content-area-top-to-content, var(--spectrum-accordion-item-content-area-top-to-content)) var(--mod-accordion-item-content-area-bottom-to-content, var(--spectrum-accordion-item-content-area-bottom-to-content));
56-
padding-inline: var(--mod-accordion-component-edge-to-text, var(--spectrum-accordion-component-edge-to-text)) var(--mod-accordion-component-edge-to-text, var(--spectrum-accordion-component-edge-to-text));
57-
color: var(--mod-accordion-item-content-color, var(--spectrum-accordion-item-content-color));
58-
font-weight: var(--mod-accordion-item-content-font-weight, var(--spectrum-accordion-item-content-font-weight));
59-
font-style: var(--mod-accordion-item-content-font-style, var(--spectrum-accordion-item-content-font-style));
60-
font-size: var(--mod-accordion-item-content-font-size, var(--spectrum-accordion-item-content-font-size));
61-
font-family: var(--mod-accordion-item-content-font, var(--spectrum-accordion-item-content-font));
62-
line-height: var(--mod-accordion-item-content-line-height, var(--spectrum-accordion-item-content-line-height));
63-
display: none;
54+
padding-block: var(--mod-accordion-item-content-area-top-to-content, var(--spectrum-accordion-item-content-area-top-to-content)) var(--mod-accordion-item-content-area-bottom-to-content, var(--spectrum-accordion-item-content-area-bottom-to-content));
55+
padding-inline: var(--mod-accordion-component-edge-to-text, var(--spectrum-accordion-component-edge-to-text)) var(--mod-accordion-component-edge-to-text, var(--spectrum-accordion-component-edge-to-text));
56+
color: var(--mod-accordion-item-content-color, var(--spectrum-accordion-item-content-color));
57+
font-weight: var(--mod-accordion-item-content-font-weight, var(--spectrum-accordion-item-content-font-weight));
58+
font-style: var(--mod-accordion-item-content-font-style, var(--spectrum-accordion-item-content-font-style));
59+
font-size: var(--mod-accordion-item-content-font-size, var(--spectrum-accordion-item-content-font-size));
60+
font-family: var(--mod-accordion-item-content-font, var(--spectrum-accordion-item-content-font));
61+
line-height: var(--mod-accordion-item-content-line-height, var(--spectrum-accordion-item-content-line-height));
62+
display: none;
6463
}
6564

6665
#header {
67-
box-sizing: border-box;
68-
padding-block: var(--mod-accordion-item-header-top-to-text-space, var(--spectrum-accordion-item-header-top-to-text-space)) var(--mod-accordion-item-header-bottom-to-text-space, var(--spectrum-accordion-item-header-bottom-to-text-space));
69-
min-block-size: var(--mod-accordion-min-block-size, var(--spectrum-accordion-min-block-size));
70-
line-height: var(--mod-accordion-item-header-line-height, var(--spectrum-accordion-item-header-line-height));
71-
text-overflow: ellipsis;
72-
cursor: pointer;
73-
font-size: var(--mod-accordion-item-header-font-size, var(--spectrum-accordion-item-header-font-size));
74-
font-weight: var(--mod-accordion-item-header-font-weight, var(--spectrum-accordion-item-header-font-weight));
75-
font-style: var(--mod-accordion-item-header-font-style, var(--spectrum-accordion-item-header-font-style));
76-
font-family: var(--mod-accordion-item-header-font, var(--spectrum-accordion-item-header-font));
77-
appearance: none;
78-
text-align: start;
79-
inline-size: 100%;
80-
color: var(--mod-accordion-item-header-color-default, var(--spectrum-accordion-item-header-color-default));
81-
background-color: var(--mod-accordion-background-color-default, var(--spectrum-accordion-background-color-default));
82-
border: 0;
83-
justify-content: flex-start;
84-
align-items: center;
85-
padding-inline-start: calc(var(--mod-accordion-disclosure-indicator-to-text-space, var(--spectrum-accordion-disclosure-indicator-to-text-space)) + var(--mod-accordion-disclosure-indicator-height, var(--spectrum-accordion-disclosure-indicator-height)));
86-
padding-inline-end: var(--mod-accordion-edge-to-text-space, var(--spectrum-accordion-edge-to-text-space));
87-
display: flex;
88-
position: relative;
66+
box-sizing: border-box;
67+
padding-block: var(--mod-accordion-item-header-top-to-text-space, var(--spectrum-accordion-item-header-top-to-text-space)) var(--mod-accordion-item-header-bottom-to-text-space, var(--spectrum-accordion-item-header-bottom-to-text-space));
68+
min-block-size: var(--mod-accordion-min-block-size, var(--spectrum-accordion-min-block-size));
69+
line-height: var(--mod-accordion-item-header-line-height, var(--spectrum-accordion-item-header-line-height));
70+
text-overflow: ellipsis;
71+
cursor: pointer;
72+
font-size: var(--mod-accordion-item-header-font-size, var(--spectrum-accordion-item-header-font-size));
73+
font-weight: var(--mod-accordion-item-header-font-weight, var(--spectrum-accordion-item-header-font-weight));
74+
font-style: var(--mod-accordion-item-header-font-style, var(--spectrum-accordion-item-header-font-style));
75+
font-family: var(--mod-accordion-item-header-font, var(--spectrum-accordion-item-header-font));
76+
appearance: none;
77+
text-align: start;
78+
inline-size: 100%;
79+
color: var(--mod-accordion-item-header-color-default, var(--spectrum-accordion-item-header-color-default));
80+
background-color: var(--mod-accordion-background-color-default, var(--spectrum-accordion-background-color-default));
81+
border: 0;
82+
justify-content: flex-start;
83+
align-items: center;
84+
padding-inline-start: calc(var(--mod-accordion-disclosure-indicator-to-text-space, var(--spectrum-accordion-disclosure-indicator-to-text-space)) + var(--mod-accordion-disclosure-indicator-height, var(--spectrum-accordion-disclosure-indicator-height)));
85+
padding-inline-end: var(--mod-accordion-edge-to-text-space, var(--spectrum-accordion-edge-to-text-space));
86+
display: flex;
87+
position: relative;
8988
}
9089

9190
#header:focus {
92-
outline: none;
91+
outline: none;
9392
}
9493

9594
#header:focus:after {
96-
content: "";
97-
position: absolute;
98-
inset-inline-start: 0;
95+
content: "";
96+
position: absolute;
97+
inset-inline-start: 0;
9998
}
10099

101100
#header:focus-visible {
102-
border-radius: var(--mod-accordion-corner-radius, var(--spectrum-accordion-corner-radius));
103-
outline: var(--mod-accordion-focus-indicator-thickness, var(--spectrum-accordion-focus-indicator-thickness)) solid var(--mod-accordion-focus-indicator-color, var(--spectrum-accordion-focus-indicator-color));
104-
background-color: var(--mod-accordion-background-color-key-focus, var(--spectrum-accordion-background-color-key-focus));
105-
color: var(--mod-accordion-item-header-color-key-focus, var(--spectrum-accordion-item-header-color-key-focus));
106-
outline-offset: calc(var(--mod-accordion-focus-indicator-gap, var(--spectrum-accordion-focus-indicator-gap)) * -1);
101+
border-radius: var(--mod-accordion-corner-radius, var(--spectrum-accordion-corner-radius));
102+
outline: var(--mod-accordion-focus-indicator-thickness, var(--spectrum-accordion-focus-indicator-thickness)) solid var(--mod-accordion-focus-indicator-color, var(--spectrum-accordion-focus-indicator-color));
103+
background-color: var(--mod-accordion-background-color-key-focus, var(--spectrum-accordion-background-color-key-focus));
104+
color: var(--mod-accordion-item-header-color-key-focus, var(--spectrum-accordion-item-header-color-key-focus));
105+
outline-offset: calc(var(--mod-accordion-focus-indicator-gap, var(--spectrum-accordion-focus-indicator-gap)) * -1);
107106
}
108107

109108
#header:active {
110-
background-color: var(--mod-accordion-background-color-down, var(--spectrum-accordion-background-color-down));
111-
color: var(--mod-accordion-item-header-color-down, var(--spectrum-accordion-item-header-color-down));
109+
background-color: var(--mod-accordion-background-color-down, var(--spectrum-accordion-background-color-down));
110+
color: var(--mod-accordion-item-header-color-down, var(--spectrum-accordion-item-header-color-down));
112111
}
113112

114-
:host([disabled]) #header,
115-
:host([disabled]) #header:focus-visible {
116-
color: var(--mod-accordion-item-header-disabled-color, var(--spectrum-accordion-item-header-disabled-color));
117-
background-color: initial;
113+
:host([disabled]) #header, :host([disabled]) #header:focus-visible {
114+
color: var(--mod-accordion-item-header-disabled-color, var(--spectrum-accordion-item-header-disabled-color));
115+
background-color: initial;
118116
}
119117

120118
@media (hover: hover) {
121-
#header:hover {
122-
background-color: var(--mod-accordion-background-color-hover, var(--spectrum-accordion-background-color-hover));
123-
}
119+
#header:hover {
120+
background-color: var(--mod-accordion-background-color-hover, var(--spectrum-accordion-background-color-hover));
121+
}
124122

125-
#header:hover,
126-
#header:hover + .iconContainer {
127-
color: var(--mod-accordion-item-header-color-hover, var(--spectrum-accordion-item-header-color-hover));
128-
}
123+
#header:hover, #header:hover + .iconContainer {
124+
color: var(--mod-accordion-item-header-color-hover, var(--spectrum-accordion-item-header-color-hover));
125+
}
129126

130-
:host([open]) #header:hover {
131-
background-color: var(--mod-accordion-background-color-hover, var(--spectrum-accordion-background-color-hover));
132-
}
127+
:host([open]) #header:hover {
128+
background-color: var(--mod-accordion-background-color-hover, var(--spectrum-accordion-background-color-hover));
129+
}
133130

134-
:host([disabled]) #header:hover {
135-
color: var(--mod-accordion-item-header-disabled-color, var(--spectrum-accordion-item-header-disabled-color));
136-
background-color: initial;
137-
}
131+
:host([disabled]) #header:hover {
132+
color: var(--mod-accordion-item-header-disabled-color, var(--spectrum-accordion-item-header-disabled-color));
133+
background-color: initial;
134+
}
138135
}
139136

140137
:host([disabled]) #header + .iconContainer {
141-
color: var(--mod-accordion-item-header-disabled-color, var(--spectrum-accordion-item-header-disabled-color));
138+
color: var(--mod-accordion-item-header-disabled-color, var(--spectrum-accordion-item-header-disabled-color));
142139
}
143140

144141
:host([disabled]) #content {
145-
color: var(--mod-accordion-item-content-disabled-color, var(--spectrum-accordion-item-content-disabled-color));
142+
color: var(--mod-accordion-item-content-disabled-color, var(--spectrum-accordion-item-content-disabled-color));
146143
}
147144

148145
@media (forced-colors: active) {
149-
#header:after {
150-
forced-color-adjust: none;
151-
content: "";
152-
position: absolute;
153-
inset-inline-start: 0;
154-
}
146+
#header:after {
147+
forced-color-adjust: none;
148+
content: "";
149+
position: absolute;
150+
inset-inline-start: 0;
151+
}
155152
}
156153

157-
:host([open]) > #heading > .iconContainer > .indicator,
158-
:host([open]) > .iconContainer > .indicator {
159-
transform: rotate(90deg);
160-
transform: var(--spectrum-logical-rotation,) rotate(90deg);
154+
:host([open]) > #heading > .iconContainer > .indicator, :host([open]) > .iconContainer > .indicator {
155+
transform: rotate(90deg);
156+
transform: var(--spectrum-logical-rotation, ) rotate(90deg);
161157
}
162158

163159
:host([open]) > #content {
164-
display: block;
160+
display: block;
165161
}
166162

167163
:host([disabled]) #header {
168-
cursor: default;
164+
cursor: default;
169165
}
166+

0 commit comments

Comments
 (0)