@ebay/skin 18.0.0 → 18.0.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # Skin Changelog
2
2
 
3
+ ## 18.0.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#2361](https://github.com/eBay/skin/pull/2361) [`735ea66`](https://github.com/eBay/skin/commit/735ea66b32299793174f3eaa5fc04a1b444e3573) Thanks [@agliga](https://github.com/agliga)! - fix: added variables.less back into repo
8
+
3
9
  ## 18.0.0
4
10
 
5
11
  ### Major Changes
@@ -0,0 +1,70 @@
1
+ // Responsive Breakpoints
2
+ // The first breakpoint simply indicates minimum support level. It should not be used with media queries.
3
+ // Mobile-first means the default layout applies to mobile and there should be no mimimums even though
4
+ // most mobile devices would be higher in screen width than the smallest viewport width.
5
+
6
+ // The variables with underscores are to be considered constants. They can be read, but should not be modified.
7
+ @_screen-size-XS: 320px;
8
+ @_screen-size-SM: 512px;
9
+ @_screen-size-MD: 768px;
10
+ @_screen-size-LG: 1024px;
11
+ @_screen-size-XL: 1280px;
12
+ @_screen-size-XL2: 1440px;
13
+ @_screen-size-XL3: 1680px;
14
+ @_screen-size-XL4: 1920px;
15
+
16
+ @_page-grid-max-width: 1584px;
17
+ @_page-grid-number-cols-small: 8;
18
+ @_page-grid-number-cols-large: 16;
19
+ @_page-grid-outside-margins-small: 16px;
20
+ @_page-grid-outside-margins-large: 32px;
21
+ @_page-grid-outside-margins-max: 48px;
22
+ @_page-grid-column-gaps-small: var(--spacing-100);
23
+ @_page-grid-column-gaps-large: var(--spacing-200);
24
+ @_page-grid-row-gaps-small: var(--spacing-100);
25
+ @_page-grid-row-gaps-large: var(--spacing-200);
26
+
27
+ @marketsans-url: "https://ir.ebaystatic.com/cr/v/c1/market-sans/v1.0/";
28
+ @marketsans-fontname: "Market Sans";
29
+ @marketsans-filename-regular: "MarketSans-Regular-WebS";
30
+ @marketsans-filename-bold: "MarketSans-SemiBold-WebS";
31
+
32
+ @font-family-default: @marketsans-fontname, Arial, sans-serif;
33
+ // TODO: remove these in next major version
34
+ @font-weight-regular: 500;
35
+ @font-weight-bold: 700;
36
+
37
+ @font-size-12: 0.75rem;
38
+ @font-size-14: 0.875rem;
39
+ @font-size-16: 1rem;
40
+ @font-size-18: 1.125rem; // secret size
41
+ @font-size-20: 1.25rem;
42
+ @font-size-24: 1.5rem;
43
+ @font-size-30: 1.875rem;
44
+ @font-size-36: 2.25rem;
45
+ @font-size-46: 2.875rem;
46
+ @font-size-64: 4rem;
47
+
48
+ @spacing-25: @spacing-100 * 0.25;
49
+ @spacing-50: @spacing-100 * 0.5;
50
+ @spacing-75: @spacing-100 * 0.75;
51
+ @spacing-100: 8px;
52
+ @spacing-125: @spacing-100 * 1.25;
53
+ @spacing-150: @spacing-100 * 1.5;
54
+ @spacing-200: @spacing-100 * 2;
55
+ @spacing-250: @spacing-100 * 2.5;
56
+ @spacing-300: @spacing-100 * 3;
57
+ @spacing-400: @spacing-100 * 4;
58
+ @spacing-450: @spacing-100 * 4.5;
59
+ @spacing-600: @spacing-100 * 6;
60
+ @spacing-700: @spacing-100 * 7;
61
+ @spacing-800: @spacing-100 * 8;
62
+
63
+ @font-size-giant-3: @font-size-46;
64
+ @font-size-giant-2: @font-size-36;
65
+ @font-size-giant-1: @font-size-30;
66
+ @font-size-large-2: @font-size-24;
67
+ @font-size-large-1: @font-size-20;
68
+ @font-size-medium: @font-size-16;
69
+ @font-size-regular: @font-size-14;
70
+ @font-size-small: @font-size-12;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@ebay/skin",
3
3
  "description": "Skin - CSS modules that represent the brand eBay",
4
- "version": "18.0.0",
4
+ "version": "18.0.1",
5
5
  "license": "MIT",
6
6
  "main": "./index.js",
7
7
  "maintainers": [
@@ -0,0 +1,70 @@
1
+ // Responsive Breakpoints
2
+ // The first breakpoint simply indicates minimum support level. It should not be used with media queries.
3
+ // Mobile-first means the default layout applies to mobile and there should be no mimimums even though
4
+ // most mobile devices would be higher in screen width than the smallest viewport width.
5
+
6
+ // The variables with underscores are to be considered constants. They can be read, but should not be modified.
7
+ @_screen-size-XS: 320px;
8
+ @_screen-size-SM: 512px;
9
+ @_screen-size-MD: 768px;
10
+ @_screen-size-LG: 1024px;
11
+ @_screen-size-XL: 1280px;
12
+ @_screen-size-XL2: 1440px;
13
+ @_screen-size-XL3: 1680px;
14
+ @_screen-size-XL4: 1920px;
15
+
16
+ @_page-grid-max-width: 1584px;
17
+ @_page-grid-number-cols-small: 8;
18
+ @_page-grid-number-cols-large: 16;
19
+ @_page-grid-outside-margins-small: 16px;
20
+ @_page-grid-outside-margins-large: 32px;
21
+ @_page-grid-outside-margins-max: 48px;
22
+ @_page-grid-column-gaps-small: var(--spacing-100);
23
+ @_page-grid-column-gaps-large: var(--spacing-200);
24
+ @_page-grid-row-gaps-small: var(--spacing-100);
25
+ @_page-grid-row-gaps-large: var(--spacing-200);
26
+
27
+ @marketsans-url: "https://ir.ebaystatic.com/cr/v/c1/market-sans/v1.0/";
28
+ @marketsans-fontname: "Market Sans";
29
+ @marketsans-filename-regular: "MarketSans-Regular-WebS";
30
+ @marketsans-filename-bold: "MarketSans-SemiBold-WebS";
31
+
32
+ @font-family-default: @marketsans-fontname, Arial, sans-serif;
33
+ // TODO: remove these in next major version
34
+ @font-weight-regular: 500;
35
+ @font-weight-bold: 700;
36
+
37
+ @font-size-12: 0.75rem;
38
+ @font-size-14: 0.875rem;
39
+ @font-size-16: 1rem;
40
+ @font-size-18: 1.125rem; // secret size
41
+ @font-size-20: 1.25rem;
42
+ @font-size-24: 1.5rem;
43
+ @font-size-30: 1.875rem;
44
+ @font-size-36: 2.25rem;
45
+ @font-size-46: 2.875rem;
46
+ @font-size-64: 4rem;
47
+
48
+ @spacing-25: @spacing-100 * 0.25;
49
+ @spacing-50: @spacing-100 * 0.5;
50
+ @spacing-75: @spacing-100 * 0.75;
51
+ @spacing-100: 8px;
52
+ @spacing-125: @spacing-100 * 1.25;
53
+ @spacing-150: @spacing-100 * 1.5;
54
+ @spacing-200: @spacing-100 * 2;
55
+ @spacing-250: @spacing-100 * 2.5;
56
+ @spacing-300: @spacing-100 * 3;
57
+ @spacing-400: @spacing-100 * 4;
58
+ @spacing-450: @spacing-100 * 4.5;
59
+ @spacing-600: @spacing-100 * 6;
60
+ @spacing-700: @spacing-100 * 7;
61
+ @spacing-800: @spacing-100 * 8;
62
+
63
+ @font-size-giant-3: @font-size-46;
64
+ @font-size-giant-2: @font-size-36;
65
+ @font-size-giant-1: @font-size-30;
66
+ @font-size-large-2: @font-size-24;
67
+ @font-size-large-1: @font-size-20;
68
+ @font-size-medium: @font-size-16;
69
+ @font-size-regular: @font-size-14;
70
+ @font-size-small: @font-size-12;