@ebay/skin 19.8.0 → 19.8.1

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 (7) hide show
  1. package/dist/bundles/skin-default.css +12 -22
  2. package/dist/bundles/skin-full.css +12 -22
  3. package/dist/bundles/skin-headless.css +6 -16
  4. package/dist/marketsans/marketsans.css +4 -24
  5. package/dist/progress-bar-expressive/progress-bar-expressive.css +4 -12
  6. package/dist/tokens/evo-core.css +8 -8
  7. package/package.json +3 -3
package/dist/bundles/skin-default.css CHANGED
@@ -64,10 +64,10 @@ https://github.com/eBay/skin/blob/master/LICENSE.txt
64
64
  --color-indigo-800:#01193d;
65
65
  --color-blue-100:#f5f9ff;
66
66
  --color-blue-200:#d4e5fe;
67
- --color-blue-300:#93c9ff;
68
- --color-blue-400:#659eff;
69
- --color-blue-500:#3665f3;
70
- --color-blue-600:#382aef;
67
+ --color-blue-300:#84b4fb;
68
+ --color-blue-400:#4d93fc;
69
+ --color-blue-500:#0968f6;
70
+ --color-blue-600:#0049b8;
71
71
  --color-blue-650:#003aa5;
72
72
  --color-blue-700:#002a69;
73
73
  --color-blue-800:#19133a;
@@ -95,11 +95,11 @@ https://github.com/eBay/skin/blob/master/LICENSE.txt
95
95
  --color-green-600:#507d17;
96
96
  --color-green-700:#345110;
97
97
  --color-green-800:#1c2d06;
98
- --color-jade-100:#f7fdfd;
98
+ --color-jade-100:#f7fdfb;
99
99
  --color-jade-200:#d8f8ee;
100
100
  --color-jade-300:#8feace;
101
101
  --color-jade-400:#1ed49e;
102
- --color-jade-500:#1ed49e;
102
+ --color-jade-500:#17c28f;
103
103
  --color-jade-600:#0f805e;
104
104
  --color-jade-700:#055743;
105
105
  --color-jade-800:#002b20;
@@ -434,16 +434,14 @@ https://github.com/eBay/skin/blob/master/LICENSE.txt
434
434
  font-family:Market Sans;
435
435
  font-style:normal;
436
436
  font-weight:400;
437
- src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.eot);
438
- src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.eot?#iefix) format("embedded-opentype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff2) format("woff2"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff) format("woff"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.ttf) format("truetype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.svg#MarketSans-Regular-WebS) format("svg");
437
+ src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff2) format("woff2");
439
438
  }
440
439
  @font-face{
441
440
  font-display:swap;
442
441
  font-family:Market Sans;
443
442
  font-style:normal;
444
443
  font-weight:700;
445
- src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.eot);
446
- src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.eot?#iefix) format("embedded-opentype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff2) format("woff2"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff) format("woff"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.ttf) format("truetype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.svg#MarketSans-Bold-WebS) format("svg");
444
+ src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff2) format("woff2");
447
445
  }
448
446
  body{
449
447
  background-color:var(--color-background-primary);
@@ -9076,10 +9074,10 @@ button.icon-btn.panel-dialog__prev{
9076
9074
  }
9077
9075
  }
9078
9076
  :root{
9079
- --progress-bar-expressive-color-1:#e53238;
9080
- --progress-bar-expressive-color-2:#0064d2;
9081
- --progress-bar-expressive-color-3:#f5af02;
9082
- --progress-bar-expressive-color-4:#86b817;
9077
+ --progress-bar-expressive-color-1:var(--color-red-500);
9078
+ --progress-bar-expressive-color-2:var(--color-blue-500);
9079
+ --progress-bar-expressive-color-3:var(--color-yellow-400);
9080
+ --progress-bar-expressive-color-4:var(--color-green-500);
9083
9081
  --progress-bar-expressive-line-border-radius:2px;
9084
9082
  --progress-bar-expressive-line-count:12;
9085
9083
  --progress-bar-expressive-line-gap:var(--spacing-50);
@@ -9101,14 +9099,6 @@ button.icon-btn.panel-dialog__prev{
9101
9099
  --progress-bar-expressive-message-animatein-duration:833ms;
9102
9100
  --progress-bar-expressive-message-animateout-duration:400ms;
9103
9101
  }
9104
- @media (prefers-color-scheme:dark){
9105
- :root{
9106
- --progress-bar-expressive-color-1:#f0343b;
9107
- --progress-bar-expressive-color-2:#0078fc;
9108
- --progress-bar-expressive-color-3:#e8a502;
9109
- --progress-bar-expressive-color-4:#86b817;
9110
- }
9111
- }
9112
9102
 
9113
9103
  .progress-bar-expressive{
9114
9104
  align-items:stretch;
package/dist/bundles/skin-full.css CHANGED
@@ -64,10 +64,10 @@ https://github.com/eBay/skin/blob/master/LICENSE.txt
64
64
  --color-indigo-800:#01193d;
65
65
  --color-blue-100:#f5f9ff;
66
66
  --color-blue-200:#d4e5fe;
67
- --color-blue-300:#93c9ff;
68
- --color-blue-400:#659eff;
69
- --color-blue-500:#3665f3;
70
- --color-blue-600:#382aef;
67
+ --color-blue-300:#84b4fb;
68
+ --color-blue-400:#4d93fc;
69
+ --color-blue-500:#0968f6;
70
+ --color-blue-600:#0049b8;
71
71
  --color-blue-650:#003aa5;
72
72
  --color-blue-700:#002a69;
73
73
  --color-blue-800:#19133a;
@@ -95,11 +95,11 @@ https://github.com/eBay/skin/blob/master/LICENSE.txt
95
95
  --color-green-600:#507d17;
96
96
  --color-green-700:#345110;
97
97
  --color-green-800:#1c2d06;
98
- --color-jade-100:#f7fdfd;
98
+ --color-jade-100:#f7fdfb;
99
99
  --color-jade-200:#d8f8ee;
100
100
  --color-jade-300:#8feace;
101
101
  --color-jade-400:#1ed49e;
102
- --color-jade-500:#1ed49e;
102
+ --color-jade-500:#17c28f;
103
103
  --color-jade-600:#0f805e;
104
104
  --color-jade-700:#055743;
105
105
  --color-jade-800:#002b20;
@@ -637,16 +637,14 @@ https://github.com/eBay/skin/blob/master/LICENSE.txt
637
637
  font-family:Market Sans;
638
638
  font-style:normal;
639
639
  font-weight:400;
640
- src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.eot);
641
- src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.eot?#iefix) format("embedded-opentype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff2) format("woff2"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff) format("woff"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.ttf) format("truetype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.svg#MarketSans-Regular-WebS) format("svg");
640
+ src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff2) format("woff2");
642
641
  }
643
642
  @font-face{
644
643
  font-display:swap;
645
644
  font-family:Market Sans;
646
645
  font-style:normal;
647
646
  font-weight:700;
648
- src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.eot);
649
- src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.eot?#iefix) format("embedded-opentype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff2) format("woff2"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff) format("woff"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.ttf) format("truetype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.svg#MarketSans-Bold-WebS) format("svg");
647
+ src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff2) format("woff2");
650
648
  }
651
649
  body{
652
650
  background-color:var(--color-background-primary);
@@ -9279,10 +9277,10 @@ button.icon-btn.panel-dialog__prev{
9279
9277
  }
9280
9278
  }
9281
9279
  :root{
9282
- --progress-bar-expressive-color-1:#e53238;
9283
- --progress-bar-expressive-color-2:#0064d2;
9284
- --progress-bar-expressive-color-3:#f5af02;
9285
- --progress-bar-expressive-color-4:#86b817;
9280
+ --progress-bar-expressive-color-1:var(--color-red-500);
9281
+ --progress-bar-expressive-color-2:var(--color-blue-500);
9282
+ --progress-bar-expressive-color-3:var(--color-yellow-400);
9283
+ --progress-bar-expressive-color-4:var(--color-green-500);
9286
9284
  --progress-bar-expressive-line-border-radius:2px;
9287
9285
  --progress-bar-expressive-line-count:12;
9288
9286
  --progress-bar-expressive-line-gap:var(--spacing-50);
@@ -9304,14 +9302,6 @@ button.icon-btn.panel-dialog__prev{
9304
9302
  --progress-bar-expressive-message-animatein-duration:833ms;
9305
9303
  --progress-bar-expressive-message-animateout-duration:400ms;
9306
9304
  }
9307
- @media (prefers-color-scheme:dark){
9308
- :root{
9309
- --progress-bar-expressive-color-1:#f0343b;
9310
- --progress-bar-expressive-color-2:#0078fc;
9311
- --progress-bar-expressive-color-3:#e8a502;
9312
- --progress-bar-expressive-color-4:#86b817;
9313
- }
9314
- }
9315
9305
 
9316
9306
  .progress-bar-expressive{
9317
9307
  align-items:stretch;
package/dist/bundles/skin-headless.css CHANGED
@@ -4,16 +4,14 @@
4
4
  font-family:Market Sans;
5
5
  font-style:normal;
6
6
  font-weight:400;
7
- src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.eot);
8
- src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.eot?#iefix) format("embedded-opentype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff2) format("woff2"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff) format("woff"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.ttf) format("truetype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.svg#MarketSans-Regular-WebS) format("svg");
7
+ src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff2) format("woff2");
9
8
  }
10
9
  @font-face{
11
10
  font-display:swap;
12
11
  font-family:Market Sans;
13
12
  font-style:normal;
14
13
  font-weight:700;
15
- src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.eot);
16
- src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.eot?#iefix) format("embedded-opentype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff2) format("woff2"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff) format("woff"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.ttf) format("truetype"), url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.svg#MarketSans-Bold-WebS) format("svg");
14
+ src:url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff2) format("woff2");
17
15
  }
18
16
  body{
19
17
  background-color:var(--color-background-primary);
@@ -8646,10 +8644,10 @@ button.icon-btn.panel-dialog__prev{
8646
8644
  }
8647
8645
  }
8648
8646
  :root{
8649
- --progress-bar-expressive-color-1:#e53238;
8650
- --progress-bar-expressive-color-2:#0064d2;
8651
- --progress-bar-expressive-color-3:#f5af02;
8652
- --progress-bar-expressive-color-4:#86b817;
8647
+ --progress-bar-expressive-color-1:var(--color-red-500);
8648
+ --progress-bar-expressive-color-2:var(--color-blue-500);
8649
+ --progress-bar-expressive-color-3:var(--color-yellow-400);
8650
+ --progress-bar-expressive-color-4:var(--color-green-500);
8653
8651
  --progress-bar-expressive-line-border-radius:2px;
8654
8652
  --progress-bar-expressive-line-count:12;
8655
8653
  --progress-bar-expressive-line-gap:var(--spacing-50);
@@ -8671,14 +8669,6 @@ button.icon-btn.panel-dialog__prev{
8671
8669
  --progress-bar-expressive-message-animatein-duration:833ms;
8672
8670
  --progress-bar-expressive-message-animateout-duration:400ms;
8673
8671
  }
8674
- @media (prefers-color-scheme:dark){
8675
- :root{
8676
- --progress-bar-expressive-color-1:#f0343b;
8677
- --progress-bar-expressive-color-2:#0078fc;
8678
- --progress-bar-expressive-color-3:#e8a502;
8679
- --progress-bar-expressive-color-4:#86b817;
8680
- }
8681
- }
8682
8672
 
8683
8673
  .progress-bar-expressive{
8684
8674
  align-items:stretch;
package/dist/marketsans/marketsans.css CHANGED
@@ -3,34 +3,14 @@
3
3
  font-family: Market Sans;
4
4
  font-style: normal;
5
5
  font-weight: 400;
6
- src: url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.eot);
7
- src:
8
- url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.eot?#iefix)
9
- format("embedded-opentype"),
10
- url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff2)
11
- format("woff2"),
12
- url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff)
13
- format("woff"),
14
- url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.ttf)
15
- format("truetype"),
16
- url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.svg#MarketSans-Regular-WebS)
17
- format("svg");
6
+ src: url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Regular-WebS.woff2)
7
+ format("woff2");
18
8
  }
19
9
  @font-face {
20
10
  font-display: swap;
21
11
  font-family: Market Sans;
22
12
  font-style: normal;
23
13
  font-weight: 700;
24
- src: url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.eot);
25
- src:
26
- url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.eot?#iefix)
27
- format("embedded-opentype"),
28
- url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff2)
29
- format("woff2"),
30
- url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff)
31
- format("woff"),
32
- url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.ttf)
33
- format("truetype"),
34
- url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.svg#MarketSans-Bold-WebS)
35
- format("svg");
14
+ src: url(https://ir.ebaystatic.com/cr/v/c1/market-sans/v2.0/MarketSans-Bold-WebS.woff2)
15
+ format("woff2");
36
16
  }
package/dist/progress-bar-expressive/progress-bar-expressive.css CHANGED
@@ -1,8 +1,8 @@
1
1
  :root {
2
- --progress-bar-expressive-color-1: #e53238;
3
- --progress-bar-expressive-color-2: #0064d2;
4
- --progress-bar-expressive-color-3: #f5af02;
5
- --progress-bar-expressive-color-4: #86b817;
2
+ --progress-bar-expressive-color-1: var(--color-red-500);
3
+ --progress-bar-expressive-color-2: var(--color-blue-500);
4
+ --progress-bar-expressive-color-3: var(--color-yellow-400);
5
+ --progress-bar-expressive-color-4: var(--color-green-500);
6
6
  --progress-bar-expressive-line-border-radius: 2px;
7
7
  --progress-bar-expressive-line-count: 12;
8
8
  --progress-bar-expressive-line-gap: var(--spacing-50);
@@ -24,14 +24,6 @@
24
24
  --progress-bar-expressive-message-animatein-duration: 833ms;
25
25
  --progress-bar-expressive-message-animateout-duration: 400ms;
26
26
  }
27
- @media (prefers-color-scheme: dark) {
28
- :root {
29
- --progress-bar-expressive-color-1: #f0343b;
30
- --progress-bar-expressive-color-2: #0078fc;
31
- --progress-bar-expressive-color-3: #e8a502;
32
- --progress-bar-expressive-color-4: #86b817;
33
- }
34
- }
35
27
 
36
28
  .progress-bar-expressive {
37
29
  align-items: stretch;
package/dist/tokens/evo-core.css CHANGED
@@ -57,10 +57,10 @@
57
57
  --color-indigo-800: #01193d;
58
58
  --color-blue-100: #f5f9ff;
59
59
  --color-blue-200: #d4e5fe;
60
- --color-blue-300: #93c9ff;
61
- --color-blue-400: #659eff;
62
- --color-blue-500: #3665f3;
63
- --color-blue-600: #382aef;
60
+ --color-blue-300: #84b4fb;
61
+ --color-blue-400: #4d93fc;
62
+ --color-blue-500: #0968f6;
63
+ --color-blue-600: #0049b8;
64
64
  --color-blue-650: #003aa5;
65
65
  --color-blue-700: #002a69;
66
66
  --color-blue-800: #19133a;
@@ -88,11 +88,11 @@
88
88
  --color-green-600: #507d17;
89
89
  --color-green-700: #345110;
90
90
  --color-green-800: #1c2d06;
91
- --color-jade-100: #f7fdfd;
91
+ --color-jade-100: #f7fdfb;
92
92
  --color-jade-200: #d8f8ee;
93
93
  --color-jade-300: #8feace;
94
94
  --color-jade-400: #1ed49e;
95
- --color-jade-500: #1ed49e;
95
+ --color-jade-500: #17c28f;
96
96
  --color-jade-600: #0f805e;
97
97
  --color-jade-700: #055743;
98
98
  --color-jade-800: #002b20;
@@ -182,8 +182,8 @@
182
182
  --font-size-giant-2: var(--font-size-36);
183
183
  --font-size-giant-3: var(--font-size-46);
184
184
  --font-size-giant-4: var(--font-size-64);
185
- /*
186
- Ratio of 20px (base line height) / 14px (body font)
185
+ /*
186
+ Ratio of 20px (base line height) / 14px (body font)
187
187
  This needs to be unitless for optimal scaling
188
188
  */
189
189
  --font-line-height-250: 1.4286;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ebay/skin",
3
- "version": "19.8.0",
3
+ "version": "19.8.1",
4
4
  "description": "Skin - CSS modules that represent the brand eBay",
5
5
  "keywords": [
6
6
  "eBay",
@@ -67,7 +67,7 @@
67
67
  "snapshots:execute": "npm run build:snapshots && percy storybook ./.storybook-percy --include",
68
68
  "snapshots:execute:dry": "percy storybook ./.storybook-percy --dry-run --include",
69
69
  "start": "marko-run",
70
- "storybook": "npm run copy:assetsToStorybook && storybook dev -c .storybook",
70
+ "storybook": "npm run copy:assetsToStorybook && storybook dev -c .storybook --no-open",
71
71
  "test": "npm run build",
72
72
  "verify": "node scripts verify",
73
73
  "version": "npm run build"
@@ -83,7 +83,7 @@
83
83
  "extends @ebay/browserslist-config"
84
84
  ],
85
85
  "devDependencies": {
86
- "@marko/run-adapter-static": "^2.0.0"
86
+ "@marko/run-adapter-static": "^2.0.1"
87
87
  },
88
88
  "publishConfig": {
89
89
  "registry": "https://registry.npmjs.org"