@ebay/skin 19.22.0 → 19.24.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.
- package/dialog.browser.json +1 -0
- package/dialog.css +1 -0
- package/dialog.js +1 -0
- package/dialog.mjs +1 -0
- package/dist/accordion/accordion.css +8 -3
- package/dist/details/details.css +1 -3
- package/dist/dialog/dialog.css +237 -0
- package/dist/svg/icon/icon-arrows-expand-16.svg +2 -2
- package/dist/svg/icon/icon-arrows-expand-24.svg +2 -2
- package/dist/svg/icon/icon-feedback-error-16.svg +2 -2
- package/dist/svg/icon/icon-feedback-error-24.svg +2 -2
- package/dist/svg/icons.svg +8 -8
- package/dist/video/video.css +7 -0
- package/index.browser.json +1 -0
- package/index.css +1 -0
- package/index.js +1 -0
- package/index.mjs +1 -0
- package/package.json +2 -2
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{ "dependencies": ["require: ./dialog.js"] }
|
package/dialog.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
@import "./dist/dialog/dialog.css";
|
package/dialog.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
require('./dist/dialog/dialog.css');
|
package/dialog.mjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import './dist/dialog/dialog.css';
|
|
@@ -16,18 +16,23 @@ ul.accordion summary.details__summary {
|
|
|
16
16
|
border-radius: 0;
|
|
17
17
|
display: flex;
|
|
18
18
|
font-size: var(--font-size-medium);
|
|
19
|
-
justify-content: space-between;
|
|
20
19
|
min-height: 48px;
|
|
21
20
|
padding: 12px 16px;
|
|
22
21
|
}
|
|
23
22
|
|
|
23
|
+
ul.accordion .details__label {
|
|
24
|
+
flex: 1;
|
|
25
|
+
min-width: 0;
|
|
26
|
+
}
|
|
27
|
+
|
|
24
28
|
ul.accordion details {
|
|
25
29
|
overflow: hidden;
|
|
26
30
|
}
|
|
27
31
|
|
|
28
32
|
ul.accordion details .details__content {
|
|
29
|
-
margin: 0 16px
|
|
33
|
+
margin: 0 16px;
|
|
30
34
|
overflow: hidden;
|
|
35
|
+
padding-block-end: 6px;
|
|
31
36
|
}
|
|
32
37
|
|
|
33
38
|
ul.accordion
|
|
@@ -82,7 +87,7 @@ ul.accordion--large summary.details__summary {
|
|
|
82
87
|
overflow: clip;
|
|
83
88
|
transition:
|
|
84
89
|
height var(--motion-duration-medium-3) var(--motion-easing-standard),
|
|
85
|
-
content-visibility var(--motion-duration-medium-
|
|
90
|
+
content-visibility var(--motion-duration-medium-3)
|
|
86
91
|
var(--motion-easing-continuous) allow-discrete,
|
|
87
92
|
opacity var(--motion-duration-medium-2)
|
|
88
93
|
var(--motion-easing-continuous);
|
package/dist/details/details.css
CHANGED
|
@@ -39,6 +39,7 @@ summary.details__summary {
|
|
|
39
39
|
display: inline-flex;
|
|
40
40
|
font-size: var(--font-size-body);
|
|
41
41
|
font-weight: var(--font-weight-600);
|
|
42
|
+
gap: var(--spacing-100);
|
|
42
43
|
list-style-position: inside;
|
|
43
44
|
list-style-type: none;
|
|
44
45
|
padding: 12px 8px;
|
|
@@ -57,9 +58,6 @@ summary.details__summary--small {
|
|
|
57
58
|
font-size: var(--font-size-small);
|
|
58
59
|
padding: 4px 8px;
|
|
59
60
|
}
|
|
60
|
-
span.details__icon {
|
|
61
|
-
margin-inline-start: 8px;
|
|
62
|
-
}
|
|
63
61
|
span.details__icon[hidden] {
|
|
64
62
|
display: inline-flex;
|
|
65
63
|
}
|
|
@@ -0,0 +1,237 @@
|
|
|
1
|
+
:root {
|
|
2
|
+
--dialog-scrim-color-hide: rgb(17 24 32 / 0);
|
|
3
|
+
--dialog-scrim-color-show: rgb(17 24 32 / 0.7);
|
|
4
|
+
--dialog-lightbox-max-width: 616px;
|
|
5
|
+
--dialog-max-width: 616px;
|
|
6
|
+
--dialog-wide-max-width: 896px;
|
|
7
|
+
--dialog-narrow-max-width: 480px;
|
|
8
|
+
--dialog-scrim-color: rgb(17 24 32 / 0.7);
|
|
9
|
+
scrollbar-gutter: stable;
|
|
10
|
+
}
|
|
11
|
+
@keyframes dialog-open-scrim {
|
|
12
|
+
0% {
|
|
13
|
+
background: transparent;
|
|
14
|
+
}
|
|
15
|
+
to {
|
|
16
|
+
background-color: var(--dialog-scrim-color);
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
@keyframes dialog-close-scrim {
|
|
20
|
+
0% {
|
|
21
|
+
background-color: var(--dialog-scrim-color);
|
|
22
|
+
}
|
|
23
|
+
to {
|
|
24
|
+
background: transparent;
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
@keyframes dialog-open-scale {
|
|
28
|
+
0% {
|
|
29
|
+
scale: 0.75;
|
|
30
|
+
}
|
|
31
|
+
to {
|
|
32
|
+
scale: 1;
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
@keyframes dialog-close-scale {
|
|
36
|
+
0% {
|
|
37
|
+
scale: 1;
|
|
38
|
+
}
|
|
39
|
+
to {
|
|
40
|
+
scale: 0.75;
|
|
41
|
+
}
|
|
42
|
+
}
|
|
43
|
+
@keyframes dialog-open-opacity {
|
|
44
|
+
0% {
|
|
45
|
+
opacity: 0;
|
|
46
|
+
}
|
|
47
|
+
to {
|
|
48
|
+
opacity: 1;
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
@keyframes dialog-close-opacity {
|
|
52
|
+
0% {
|
|
53
|
+
opacity: 1;
|
|
54
|
+
}
|
|
55
|
+
to {
|
|
56
|
+
opacity: 0;
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
body:has(.dialog[open]) {
|
|
60
|
+
overflow: hidden !important;
|
|
61
|
+
}
|
|
62
|
+
.dialog {
|
|
63
|
+
background-color: var(--color-background-primary);
|
|
64
|
+
border: none;
|
|
65
|
+
border-radius: var(--border-radius-150);
|
|
66
|
+
color: var(--color-foreground-primary);
|
|
67
|
+
flex-direction: column;
|
|
68
|
+
max-height: 90%;
|
|
69
|
+
max-width: 88%;
|
|
70
|
+
min-height: 55px;
|
|
71
|
+
min-width: 208px;
|
|
72
|
+
padding: 0;
|
|
73
|
+
}
|
|
74
|
+
.dialog__header {
|
|
75
|
+
display: flex;
|
|
76
|
+
flex-shrink: 0;
|
|
77
|
+
margin: var(--spacing-200) var(--spacing-200) 0;
|
|
78
|
+
position: relative;
|
|
79
|
+
}
|
|
80
|
+
.dialog__header h1,
|
|
81
|
+
.dialog__header h2,
|
|
82
|
+
.dialog__header h3,
|
|
83
|
+
.dialog__header h4,
|
|
84
|
+
.dialog__header h5,
|
|
85
|
+
.dialog__header h6 {
|
|
86
|
+
align-self: center;
|
|
87
|
+
flex: 1 1 auto;
|
|
88
|
+
margin: 0;
|
|
89
|
+
overflow-wrap: anywhere;
|
|
90
|
+
}
|
|
91
|
+
.dialog__header > :last-child:not(:only-child) {
|
|
92
|
+
flex-shrink: 0;
|
|
93
|
+
margin-inline-start: var(--spacing-200);
|
|
94
|
+
}
|
|
95
|
+
.dialog__main {
|
|
96
|
+
box-sizing: border-box;
|
|
97
|
+
flex: 1 1 auto;
|
|
98
|
+
overflow: auto;
|
|
99
|
+
padding: var(--spacing-200);
|
|
100
|
+
position: relative;
|
|
101
|
+
}
|
|
102
|
+
.dialog__main > :first-child {
|
|
103
|
+
margin-top: 0;
|
|
104
|
+
}
|
|
105
|
+
.dialog__main > :last-child {
|
|
106
|
+
margin-bottom: 0;
|
|
107
|
+
}
|
|
108
|
+
.dialog__footer {
|
|
109
|
+
display: flex;
|
|
110
|
+
flex-direction: column;
|
|
111
|
+
justify-content: center;
|
|
112
|
+
padding: var(--spacing-200);
|
|
113
|
+
position: relative;
|
|
114
|
+
}
|
|
115
|
+
.dialog__footer > :not(:first-child) {
|
|
116
|
+
margin-top: var(--spacing-200);
|
|
117
|
+
}
|
|
118
|
+
.dialog__image {
|
|
119
|
+
background-position: 50%;
|
|
120
|
+
background-repeat: no-repeat;
|
|
121
|
+
background-size: cover;
|
|
122
|
+
border-radius: var(--border-radius-100) var(--border-radius-100) 0 0;
|
|
123
|
+
height: 218px;
|
|
124
|
+
position: absolute;
|
|
125
|
+
width: 100%;
|
|
126
|
+
}
|
|
127
|
+
.dialog--expressive .dialog__header > * {
|
|
128
|
+
margin-top: 218px;
|
|
129
|
+
}
|
|
130
|
+
button.icon-btn.dialog__close,
|
|
131
|
+
button.icon-btn.dialog__prev {
|
|
132
|
+
align-self: flex-start;
|
|
133
|
+
border: 0;
|
|
134
|
+
flex-shrink: 0;
|
|
135
|
+
height: 32px;
|
|
136
|
+
min-width: 32px;
|
|
137
|
+
position: relative;
|
|
138
|
+
width: 32px;
|
|
139
|
+
z-index: 1;
|
|
140
|
+
}
|
|
141
|
+
button.icon-btn.dialog__prev {
|
|
142
|
+
margin-inline-end: var(--spacing-200);
|
|
143
|
+
}
|
|
144
|
+
.dialog--expressive button.icon-btn.dialog__close,
|
|
145
|
+
.dialog--expressive button.icon-btn.dialog__prev {
|
|
146
|
+
margin: 0;
|
|
147
|
+
}
|
|
148
|
+
.dialog--expressive button.icon-btn.dialog__prev + * {
|
|
149
|
+
margin-inline-start: -32px;
|
|
150
|
+
}
|
|
151
|
+
.dialog--expressive .dialog__header {
|
|
152
|
+
margin: var(--spacing-300) var(--spacing-300) 0;
|
|
153
|
+
}
|
|
154
|
+
.dialog--expressive .dialog__footer,
|
|
155
|
+
.dialog--expressive .dialog__main {
|
|
156
|
+
padding: var(--spacing-200) var(--spacing-300);
|
|
157
|
+
}
|
|
158
|
+
.dialog[open] {
|
|
159
|
+
display: flex;
|
|
160
|
+
}
|
|
161
|
+
.dialog[open].dialog--close::backdrop {
|
|
162
|
+
animation: dialog-close-scrim var(--motion-duration-short-3)
|
|
163
|
+
var(--motion-easing-continuous) forwards;
|
|
164
|
+
}
|
|
165
|
+
.dialog[open]::backdrop {
|
|
166
|
+
animation: dialog-open-scrim var(--motion-duration-short-3)
|
|
167
|
+
var(--motion-easing-continuous) forwards;
|
|
168
|
+
}
|
|
169
|
+
.dialog[open].dialog--close {
|
|
170
|
+
animation:
|
|
171
|
+
dialog-close-scale var(--motion-duration-medium-3)
|
|
172
|
+
var(--motion-easing-soft-exit),
|
|
173
|
+
dialog-close-opacity var(--motion-duration-short-3)
|
|
174
|
+
var(--motion-easing-continuous);
|
|
175
|
+
transition:
|
|
176
|
+
display var(--motion-duration-short-3) allow-discrete,
|
|
177
|
+
overlay var(--motion-duration-short-3) allow-discrete;
|
|
178
|
+
}
|
|
179
|
+
.dialog[open] {
|
|
180
|
+
animation:
|
|
181
|
+
dialog-open-scale var(--motion-duration-medium-3)
|
|
182
|
+
var(--motion-easing-standard),
|
|
183
|
+
dialog-open-opacity var(--motion-duration-short-3)
|
|
184
|
+
var(--motion-easing-continuous);
|
|
185
|
+
}
|
|
186
|
+
.dialog--large {
|
|
187
|
+
height: 98%;
|
|
188
|
+
max-height: 98%;
|
|
189
|
+
width: 95%;
|
|
190
|
+
}
|
|
191
|
+
@media (min-width: 512px) {
|
|
192
|
+
.dialog {
|
|
193
|
+
border-radius: var(--border-radius-100);
|
|
194
|
+
}
|
|
195
|
+
.dialog--wide {
|
|
196
|
+
max-width: 88%;
|
|
197
|
+
}
|
|
198
|
+
.dialog--wide .dialog__image {
|
|
199
|
+
height: 256px;
|
|
200
|
+
}
|
|
201
|
+
.dialog--wide.dialog--expressive .dialog__header > * {
|
|
202
|
+
margin-top: 256px;
|
|
203
|
+
}
|
|
204
|
+
.dialog__footer {
|
|
205
|
+
flex-direction: row;
|
|
206
|
+
justify-content: flex-end;
|
|
207
|
+
}
|
|
208
|
+
.dialog__footer > :not(:first-child) {
|
|
209
|
+
margin-left: var(--spacing-100);
|
|
210
|
+
margin-top: 0;
|
|
211
|
+
}
|
|
212
|
+
.dialog--large {
|
|
213
|
+
align-self: center;
|
|
214
|
+
height: 70%;
|
|
215
|
+
max-height: 95%;
|
|
216
|
+
}
|
|
217
|
+
}
|
|
218
|
+
@media (min-width: 768px) {
|
|
219
|
+
.dialog {
|
|
220
|
+
max-width: var(--dialog-max-width);
|
|
221
|
+
}
|
|
222
|
+
.dialog--narrow {
|
|
223
|
+
max-width: var(--dialog-narrow-max-width);
|
|
224
|
+
}
|
|
225
|
+
.dialog--wide {
|
|
226
|
+
max-width: var(--dialog-wide-max-width);
|
|
227
|
+
max-width: 88%;
|
|
228
|
+
}
|
|
229
|
+
}
|
|
230
|
+
@media (min-width: 1024px) {
|
|
231
|
+
.dialog--wide {
|
|
232
|
+
max-width: var(--dialog-wide-max-width);
|
|
233
|
+
}
|
|
234
|
+
}
|
|
235
|
+
[dir="rtl"] button.icon-btn.dialog__prev .icon--16 {
|
|
236
|
+
transform: rotate(180deg);
|
|
237
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
<svg viewBox="0 0
|
|
1
|
+
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
|
|
2
2
|
<path
|
|
3
3
|
fill-rule="evenodd"
|
|
4
4
|
clip-rule="evenodd"
|
|
5
|
-
d="M1
|
|
5
|
+
d="M1 14a1 1 0 0 0 1 1h4a1 1 0 1 0 0-2H4.414l2.793-2.793a1 1 0 0 0-1.414-1.414L3 11.586V10a1 1 0 0 0-2 0v4Zm7.793-6.793a1 1 0 0 0 1.414 0L13 4.414V6a1 1 0 1 0 2 0V2a1 1 0 0 0-1-1h-4a1 1 0 1 0 0 2h1.586L8.793 5.793a1 1 0 0 0 0 1.414Z"
|
|
6
6
|
/>
|
|
7
7
|
</svg>
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
<svg viewBox="0 0
|
|
1
|
+
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
|
2
2
|
<path
|
|
3
3
|
fill-rule="evenodd"
|
|
4
4
|
clip-rule="evenodd"
|
|
5
|
-
d="M1
|
|
5
|
+
d="M1 22a1 1 0 0 0 1 1h7a1 1 0 1 0 0-2H4.414l6.293-6.293a1 1 0 0 0-1.414-1.414L3 19.586V15a1 1 0 1 0-2 0v7Zm12.293-11.293a1 1 0 0 0 1.414 0L21 4.414V9a1 1 0 1 0 2 0V2a1 1 0 0 0-1-1h-7a1 1 0 1 0 0 2h4.586l-6.293 6.293a1 1 0 0 0 0 1.414Z"
|
|
6
6
|
/>
|
|
7
7
|
</svg>
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
<svg viewBox="0 0
|
|
1
|
+
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
|
|
2
2
|
<path
|
|
3
3
|
fill-rule="evenodd"
|
|
4
4
|
clip-rule="evenodd"
|
|
5
|
-
d="
|
|
5
|
+
d="M0 2.5A2.5 2.5 0 0 1 2.5 0h8A2.5 2.5 0 0 1 13 2.5V5a1 1 0 1 1-2 0V2.5a.5.5 0 0 0-.5-.5h-8a.5.5 0 0 0-.5.5v11a.5.5 0 0 0 .5.5H6a1 1 0 1 1 0 2H2.5A2.5 2.5 0 0 1 0 13.5v-11ZM4 4a1 1 0 0 0 0 2h4a1 1 0 0 0 0-2H4ZM3 8a1 1 0 0 1 1-1h2a1 1 0 0 1 0 2H4a1 1 0 0 1-1-1Zm9 0a4 4 0 1 0 0 8 4 4 0 0 0 0-8Zm.665 2.5a.665.665 0 1 0-1.33 0v1.16a.665.665 0 1 0 1.33 0V10.5ZM12 14.33A.665.665 0 1 0 12 13a.665.665 0 0 0 0 1.33Z"
|
|
6
6
|
/>
|
|
7
7
|
</svg>
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
<svg viewBox="0 0
|
|
1
|
+
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
|
2
2
|
<path
|
|
3
3
|
fill-rule="evenodd"
|
|
4
4
|
clip-rule="evenodd"
|
|
5
|
-
d="
|
|
5
|
+
d="M5 1a3 3 0 0 0-3 3v16a3 3 0 0 0 3 3h6a1 1 0 1 0 0-2H5a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v5a1 1 0 1 0 2 0V4a3 3 0 0 0-3-3H5Zm1 6a1 1 0 0 1 1-1h7a1 1 0 1 1 0 2H7a1 1 0 0 1-1-1Zm1 3a1 1 0 1 0 0 2h5a1 1 0 1 0 0-2H7Zm-1 5a1 1 0 0 1 1-1h2a1 1 0 1 1 0 2H7a1 1 0 0 1-1-1Zm18 2.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0Zm-4.8-2.235a.7.7 0 1 0-1.4 0V17.3a.7.7 0 1 0 1.4 0v-2.035Zm-.7 5.185a.725.725 0 1 0 0-1.45.725.725 0 0 0 0 1.45Z"
|
|
6
6
|
/>
|
|
7
7
|
</svg>
|
package/dist/svg/icons.svg
CHANGED
|
@@ -891,18 +891,18 @@
|
|
|
891
891
|
fill="#191919"
|
|
892
892
|
/>
|
|
893
893
|
</symbol>
|
|
894
|
-
<symbol viewBox="0 0
|
|
894
|
+
<symbol viewBox="0 0 16 16" id="icon-arrows-expand-16">
|
|
895
895
|
<path
|
|
896
896
|
fill-rule="evenodd"
|
|
897
897
|
clip-rule="evenodd"
|
|
898
|
-
d="M1
|
|
898
|
+
d="M1 14a1 1 0 0 0 1 1h4a1 1 0 1 0 0-2H4.414l2.793-2.793a1 1 0 0 0-1.414-1.414L3 11.586V10a1 1 0 0 0-2 0v4Zm7.793-6.793a1 1 0 0 0 1.414 0L13 4.414V6a1 1 0 1 0 2 0V2a1 1 0 0 0-1-1h-4a1 1 0 1 0 0 2h1.586L8.793 5.793a1 1 0 0 0 0 1.414Z"
|
|
899
899
|
/>
|
|
900
900
|
</symbol>
|
|
901
|
-
<symbol viewBox="0 0
|
|
901
|
+
<symbol viewBox="0 0 24 24" id="icon-arrows-expand-24">
|
|
902
902
|
<path
|
|
903
903
|
fill-rule="evenodd"
|
|
904
904
|
clip-rule="evenodd"
|
|
905
|
-
d="M1
|
|
905
|
+
d="M1 22a1 1 0 0 0 1 1h7a1 1 0 1 0 0-2H4.414l6.293-6.293a1 1 0 0 0-1.414-1.414L3 19.586V15a1 1 0 1 0-2 0v7Zm12.293-11.293a1 1 0 0 0 1.414 0L21 4.414V9a1 1 0 1 0 2 0V2a1 1 0 0 0-1-1h-7a1 1 0 1 0 0 2h4.586l-6.293 6.293a1 1 0 0 0 0 1.414Z"
|
|
906
906
|
/>
|
|
907
907
|
</symbol>
|
|
908
908
|
<symbol viewBox="0 0 16 16" id="icon-article-16">
|
|
@@ -4427,18 +4427,18 @@
|
|
|
4427
4427
|
d="M5 1a3 3 0 0 0-3 3v16a3 3 0 0 0 3 3h2a1 1 0 1 0 0-2H5a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v3a1 1 0 1 0 2 0V4a3 3 0 0 0-3-3H5Zm1 6a1 1 0 0 1 1-1h7a1 1 0 1 1 0 2H7a1 1 0 0 1-1-1Zm1 3a1 1 0 1 0 0 2h5a1 1 0 1 0 0-2H7Zm-1 5a1 1 0 0 1 1-1h2a1 1 0 1 1 0 2H7a1 1 0 0 1-1-1Zm17.195-4.999a2.75 2.75 0 0 0-3.889 0l-7.344 7.344a2 2 0 0 0-.433.648l-1.217 2.93c-.512 1.236.726 2.474 1.96 1.961l2.932-1.217c.242-.1.462-.247.647-.433l7.344-7.344a2.75 2.75 0 0 0 0-3.889Zm-2.474 1.414a.75.75 0 0 1 1.06 1.06l-7.344 7.345-1.814.753.753-1.813 7.345-7.345Z"
|
|
4428
4428
|
/>
|
|
4429
4429
|
</symbol>
|
|
4430
|
-
<symbol viewBox="0 0
|
|
4430
|
+
<symbol viewBox="0 0 16 16" id="icon-feedback-error-16">
|
|
4431
4431
|
<path
|
|
4432
4432
|
fill-rule="evenodd"
|
|
4433
4433
|
clip-rule="evenodd"
|
|
4434
|
-
d="
|
|
4434
|
+
d="M0 2.5A2.5 2.5 0 0 1 2.5 0h8A2.5 2.5 0 0 1 13 2.5V5a1 1 0 1 1-2 0V2.5a.5.5 0 0 0-.5-.5h-8a.5.5 0 0 0-.5.5v11a.5.5 0 0 0 .5.5H6a1 1 0 1 1 0 2H2.5A2.5 2.5 0 0 1 0 13.5v-11ZM4 4a1 1 0 0 0 0 2h4a1 1 0 0 0 0-2H4ZM3 8a1 1 0 0 1 1-1h2a1 1 0 0 1 0 2H4a1 1 0 0 1-1-1Zm9 0a4 4 0 1 0 0 8 4 4 0 0 0 0-8Zm.665 2.5a.665.665 0 1 0-1.33 0v1.16a.665.665 0 1 0 1.33 0V10.5ZM12 14.33A.665.665 0 1 0 12 13a.665.665 0 0 0 0 1.33Z"
|
|
4435
4435
|
/>
|
|
4436
4436
|
</symbol>
|
|
4437
|
-
<symbol viewBox="0 0
|
|
4437
|
+
<symbol viewBox="0 0 24 24" id="icon-feedback-error-24">
|
|
4438
4438
|
<path
|
|
4439
4439
|
fill-rule="evenodd"
|
|
4440
4440
|
clip-rule="evenodd"
|
|
4441
|
-
d="
|
|
4441
|
+
d="M5 1a3 3 0 0 0-3 3v16a3 3 0 0 0 3 3h6a1 1 0 1 0 0-2H5a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v5a1 1 0 1 0 2 0V4a3 3 0 0 0-3-3H5Zm1 6a1 1 0 0 1 1-1h7a1 1 0 1 1 0 2H7a1 1 0 0 1-1-1Zm1 3a1 1 0 1 0 0 2h5a1 1 0 1 0 0-2H7Zm-1 5a1 1 0 0 1 1-1h2a1 1 0 1 1 0 2H7a1 1 0 0 1-1-1Zm18 2.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0Zm-4.8-2.235a.7.7 0 1 0-1.4 0V17.3a.7.7 0 1 0 1.4 0v-2.035Zm-.7 5.185a.725.725 0 1 0 0-1.45.725.725 0 0 0 0 1.45Z"
|
|
4442
4442
|
/>
|
|
4443
4443
|
</symbol>
|
|
4444
4444
|
<symbol viewBox="0 0 16 16" id="icon-feedback-negative-16">
|
package/dist/video/video.css
CHANGED
|
@@ -51,6 +51,13 @@
|
|
|
51
51
|
justify-content: center;
|
|
52
52
|
width: 100%;
|
|
53
53
|
}
|
|
54
|
+
.video-player .shaka-play-button-container .shaka-play-button {
|
|
55
|
+
background: none;
|
|
56
|
+
border: 0;
|
|
57
|
+
cursor: pointer;
|
|
58
|
+
margin: 0;
|
|
59
|
+
padding: 0;
|
|
60
|
+
}
|
|
54
61
|
.video-player--with-nav .shaka-controls-container {
|
|
55
62
|
pointer-events: none;
|
|
56
63
|
}
|
package/index.browser.json
CHANGED
package/index.css
CHANGED
package/index.js
CHANGED
package/index.mjs
CHANGED
|
@@ -17,6 +17,7 @@ import './dist/confirm-dialog/confirm-dialog.css';
|
|
|
17
17
|
import './dist/cta-button/cta-button.css';
|
|
18
18
|
import './dist/date-textbox/date-textbox.css';
|
|
19
19
|
import './dist/details/details.css';
|
|
20
|
+
import './dist/dialog/dialog.css';
|
|
20
21
|
import './dist/donut-chart/donut-chart.css';
|
|
21
22
|
import './dist/drawer-dialog/drawer-dialog.css';
|
|
22
23
|
import './dist/education-notice/education-notice.css';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ebay/skin",
|
|
3
|
-
"version": "19.
|
|
3
|
+
"version": "19.24.0",
|
|
4
4
|
"description": "Skin - CSS modules that represent the brand eBay",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"eBay",
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"snapshots:all": "npm run copy:assetsToStorybook && percy storybook:start --include '.*'",
|
|
62
62
|
"snapshots:all:dry": "percy storybook:start --dry-run --include '.*'",
|
|
63
63
|
"snapshots:dry": "percy storybook:start --dry-run --include \"$(echo $STORIES)\"",
|
|
64
|
-
"start": "
|
|
64
|
+
"start": "npm run storybook",
|
|
65
65
|
"storybook": "npm run copy:assetsToStorybook && storybook dev -c .storybook --no-open",
|
|
66
66
|
"test": "npm run build",
|
|
67
67
|
"verify": "tsx scripts verify"
|