@penskemediacorp/larva-tokens 0.5.1 → 0.5.4

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.
@@ -0,0 +1,230 @@
1
+
2
+ :root {
3
+ --border-color-grey-lightest: rgb(239, 239, 239);
4
+ --border-color-brand-secondary-light: rgb(165, 133, 83);
5
+ --border-color-grey-light: rgb(204, 204, 204);
6
+ --border-color-grey-dark: rgb(102, 102, 102);
7
+ --border-color-brand-secondary-dark: rgb(122, 89, 45);
8
+ --border-color-brand-secondary: rgb(0, 0, 0);
9
+ --border-color-grey: rgb(118, 118, 118);
10
+ --border-color-brand-primary-light: rgb(215, 25, 32);
11
+ --border-color-white: rgb(255, 255, 255);
12
+ --border-color-brand-primary-dark: rgb(215, 25, 32);
13
+ --border-color-brand-primary: rgb(215, 25, 32);
14
+ --background-color-grey-light: rgb(204, 204, 204);
15
+ --background-color-grey-lightest: rgb(239, 239, 239);
16
+ --background-color-brand-secondary-dark: rgb(122, 89, 45);
17
+ --background-color-brand-secondary-light: rgb(165, 133, 83);
18
+ --background-color-grey-dark: rgb(102, 102, 102);
19
+ --background-color-grey: rgb(118, 118, 118);
20
+ /* The background color of the main body of the site. */
21
+ --background-color-body: rgb(255, 255, 255);
22
+ --background-color-brand-secondary: rgb(122, 89, 45);
23
+ --background-color-black: rgb(0, 0, 0);
24
+ --background-color-brand-primary-light: rgb(215, 25, 32);
25
+ --background-color-brand-primary-dark: rgb(215, 25, 32);
26
+ --background-color-white: rgb(255, 255, 255);
27
+ /* The primary brand color. This should be dark in hue, and have sufficient contrast with white text. */
28
+ --background-color-brand-primary: rgb(215, 25, 32);
29
+ --background-color-grey-darkest: rgb(64, 64, 64);
30
+ --color-brand-secondary: rgb(122, 89, 45);
31
+ --color-black: rgb(0, 0, 0);
32
+ --color-brand-primary-light: rgb(215, 25, 32);
33
+ --color-brand-primary-dark: rgb(215, 25, 32);
34
+ --color-white: rgb(255, 255, 255);
35
+ --color-brand-primary: rgb(215, 25, 32);
36
+ --color-grey-light: rgb(204, 204, 204);
37
+ --color-brand-secondary-dark: rgb(122, 89, 45);
38
+ --color-brand-secondary-light: rgb(165, 133, 83);
39
+ --color-grey-dark: rgb(102, 102, 102);
40
+ --color-grey: rgb(118, 118, 118);
41
+ /* The webfont, loaded async */
42
+ --font-family-primary-fancy: 'Publico Headline Bold', serif;
43
+ /* The webfont, loaded async */
44
+ --font-family-primary: serif;
45
+ /* The webfont, loaded async */
46
+ --font-family-secondary-fancy: 'Publico Headline Roman', serif;
47
+ /* Fallback for secondary-fancy */
48
+ --font-family-secondary: serif;
49
+ --font-family-body: Georgia, Helvetica, sans-serif;
50
+ --font-family-basic: sans-serif;
51
+ --font-weight-light: 300;
52
+ --font-weight-normal: 400;
53
+ --font-weight-bold: 700;
54
+ --line-height-small: 1.1;
55
+ --line-height-normal: 1.35;
56
+ --line-height-copy: 1.5;
57
+ --line-height-large: 1.85;
58
+ /* Used for margins and padding only. */
59
+ --spacing-00: 0;
60
+ /* Used for margins and padding only. */
61
+ --spacing-025: 0.25rem;
62
+ /* Used for margins and padding only. */
63
+ --spacing-050: 0.5rem;
64
+ /* Used for margins and padding only. */
65
+ --spacing-075: 0.75rem;
66
+ /* Used for margins and padding only. */
67
+ --spacing-1: 1rem;
68
+ /* Used for margins and padding only. */
69
+ --spacing-125: 1.25rem;
70
+ /* Used for margins and padding only. */
71
+ --spacing-150: 1.5rem;
72
+ /* Used for margins and padding only. */
73
+ --spacing-2: 2rem;
74
+ --primary-xl-font-size-desktop: 58px;
75
+ --primary-l-font-size-mobile: 34px;
76
+ --body-s-font-size-desktop: initial;
77
+ --primary-s-font-size-desktop: 36px;
78
+ --primary-xxs-font-size-desktop: 24px;
79
+ --accent-l-font-size-desktop: 58px;
80
+ --accent-m-font-size-desktop: initial;
81
+ --primary-xxxs-font-size-desktop: 20px;
82
+ --primary-xs-font-size-desktop: 26px;
83
+ --secondary-s-font-size-mobile: 11px;
84
+ --accent-regular-xxs-font-size-desktop: 18px;
85
+ --secondary-m-font-size-mobile: 11px;
86
+ --accent-xxs-font-size-desktop: 18px;
87
+ --accent-s-font-size-desktop: initial;
88
+ --secondary-regular-m-font-size-desktop: initial;
89
+ --secondary-l-font-size-mobile: 17px;
90
+ --secondary-l-font-size-desktop: 30px;
91
+ --secondary-regular-m-font-size-mobile: 15px;
92
+ --accent-xxs-font-size-mobile: 14px;
93
+ --secondary-m-font-size-desktop: 14px;
94
+ --accent-s-font-size-mobile: 23px;
95
+ --accent-regular-xxs-font-size-mobile: 14px;
96
+ --primary-xs-font-size-mobile: 18px;
97
+ --primary-xxxs-font-size-mobile: 19px;
98
+ --accent-m-font-size-mobile: 26px;
99
+ --secondary-s-font-size-desktop: 12px;
100
+ --accent-l-font-size-mobile: 40px;
101
+ --primary-xxs-font-size-mobile: 22px;
102
+ --primary-s-font-size-mobile: 23px;
103
+ --body-s-font-size-mobile: 16px;
104
+ --primary-l-font-size-desktop: 45px;
105
+ --primary-xl-font-size-mobile: 37px;
106
+ --accent-xs-font-size-mobile: 18px;
107
+ --primary-m-font-size-mobile: 32px;
108
+ --body-m-font-size-desktop: initial;
109
+ --body-m-font-size-mobile: 18px;
110
+ --primary-m-font-size-desktop: 36px;
111
+ --accent-xs-font-size-desktop: 23px;
112
+ --secondary-s-letter-spacing-mobile: normal;
113
+ --secondary-m-letter-spacing-desktop: normal;
114
+ --secondary-l-letter-spacing-desktop: normal;
115
+ --primary-l-letter-spacing-mobile: normal;
116
+ --secondary-regular-m-letter-spacing-desktop: normal;
117
+ --accent-xs-letter-spacing-mobile: 0.52px;
118
+ --accent-s-letter-spacing-desktop: normal;
119
+ --accent-xxs-letter-spacing-desktop: .52px;
120
+ --body-m-letter-spacing-mobile: normal;
121
+ --primary-m-letter-spacing-mobile: normal;
122
+ --primary-xl-letter-spacing-mobile: normal;
123
+ --accent-regular-xxs-letter-spacing-desktop: 0.52px;
124
+ --body-s-letter-spacing-mobile: normal;
125
+ --primary-s-letter-spacing-mobile: normal;
126
+ --primary-xs-letter-spacing-desktop: normal;
127
+ --primary-xxs-letter-spacing-mobile: normal;
128
+ --primary-xxxs-letter-spacing-desktop: normal;
129
+ --accent-m-letter-spacing-desktop: normal;
130
+ --accent-l-letter-spacing-desktop: 1.66px;
131
+ --accent-l-letter-spacing-mobile: 1.14px;
132
+ --accent-m-letter-spacing-mobile: .74px;
133
+ --primary-xxxs-letter-spacing-mobile: normal;
134
+ --primary-xxs-letter-spacing-desktop: normal;
135
+ --primary-xs-letter-spacing-mobile: normal;
136
+ --primary-s-letter-spacing-desktop: normal;
137
+ --body-s-letter-spacing-desktop: normal;
138
+ --accent-regular-xxs-letter-spacing-mobile: 0.4px;
139
+ --primary-xl-letter-spacing-desktop: normal;
140
+ --accent-xs-letter-spacing-desktop: 0.66px;
141
+ --accent-xxs-letter-spacing-mobile: .4px;
142
+ --primary-m-letter-spacing-desktop: normal;
143
+ --body-m-letter-spacing-desktop: normal;
144
+ --accent-s-letter-spacing-mobile: .66px;
145
+ --secondary-regular-m-letter-spacing-mobile: normal;
146
+ --primary-l-letter-spacing-desktop: normal;
147
+ --secondary-l-letter-spacing-mobile: normal;
148
+ --secondary-m-letter-spacing-mobile: normal;
149
+ --secondary-s-letter-spacing-desktop: normal;
150
+ --primary-xs-font-weight-mobile: 700;
151
+ --primary-xxxs-font-weight-mobile: 700;
152
+ --accent-m-font-weight-mobile: 300;
153
+ --accent-regular-xxs-font-weight-desktop: initial;
154
+ --accent-l-font-weight-mobile: 300;
155
+ --primary-xxs-font-weight-mobile: 700;
156
+ --primary-s-font-weight-mobile: 700;
157
+ --body-s-font-weight-mobile: initial;
158
+ --accent-xxs-font-weight-desktop: initial;
159
+ --accent-s-font-weight-desktop: initial;
160
+ --secondary-regular-m-font-weight-desktop: initial;
161
+ --primary-xl-font-weight-mobile: 700;
162
+ --secondary-l-font-weight-desktop: initial;
163
+ --body-m-font-weight-mobile: initial;
164
+ --accent-xs-font-weight-mobile: 300;
165
+ --secondary-m-font-weight-desktop: initial;
166
+ --primary-m-font-weight-mobile: 700;
167
+ --primary-l-font-weight-mobile: 700;
168
+ --secondary-s-font-weight-desktop: initial;
169
+ --secondary-s-font-weight-mobile: 600;
170
+ --primary-l-font-weight-desktop: 700;
171
+ --body-m-font-weight-desktop: initial;
172
+ --primary-m-font-weight-desktop: 700;
173
+ --accent-xs-font-weight-desktop: initial;
174
+ --secondary-m-font-weight-mobile: 600;
175
+ --primary-xl-font-weight-desktop: 700;
176
+ --secondary-l-font-weight-mobile: 600;
177
+ --secondary-regular-m-font-weight-mobile: initial;
178
+ --accent-s-font-weight-mobile: 300;
179
+ --accent-xxs-font-weight-mobile: 300;
180
+ --body-s-font-weight-desktop: initial;
181
+ --primary-s-font-weight-desktop: 700;
182
+ --primary-xxs-font-weight-desktop: 700;
183
+ --accent-regular-xxs-font-weight-mobile: 400;
184
+ --accent-l-font-weight-desktop: initial;
185
+ --accent-m-font-weight-desktop: initial;
186
+ --primary-xxxs-font-weight-desktop: 700;
187
+ --primary-xs-font-weight-desktop: 700;
188
+ --accent-xs-line-height-desktop: 24px;
189
+ --body-m-line-height-desktop: initial;
190
+ --primary-m-line-height-desktop: 40px;
191
+ --primary-xl-line-height-desktop: 57px;
192
+ --primary-s-line-height-desktop: 38px;
193
+ --primary-xxs-line-height-desktop: 27px;
194
+ --secondary-s-line-height-mobile: 14px;
195
+ --body-s-line-height-desktop: initial;
196
+ --accent-l-line-height-desktop: 50px;
197
+ --primary-xxxs-line-height-desktop: 23px;
198
+ --primary-xs-line-height-desktop: 29px;
199
+ --accent-m-line-height-desktop: initial;
200
+ --accent-regular-xxs-line-height-desktop: 26px;
201
+ --secondary-m-line-height-mobile: 15px;
202
+ --secondary-l-line-height-mobile: 21px;
203
+ --accent-s-line-height-desktop: initial;
204
+ --accent-xxs-line-height-desktop: 18px;
205
+ --secondary-regular-m-line-height-mobile: 15px;
206
+ --secondary-regular-m-line-height-desktop: initial;
207
+ --accent-s-line-height-mobile: 23px;
208
+ --accent-xxs-line-height-mobile: 0.4px;
209
+ --secondary-l-line-height-desktop: 35px;
210
+ --secondary-m-line-height-desktop: 17px;
211
+ --accent-regular-xxs-line-height-mobile: 14px;
212
+ --primary-xs-line-height-mobile: 21px;
213
+ --primary-xxxs-line-height-mobile: 21px;
214
+ --accent-m-line-height-mobile: 26px;
215
+ --accent-l-line-height-mobile: 36px;
216
+ --secondary-s-line-height-desktop: 17px;
217
+ --primary-xxs-line-height-mobile: 23px;
218
+ --primary-s-line-height-mobile: 28px;
219
+ --body-s-line-height-mobile: 22px;
220
+ --primary-xl-line-height-mobile: 37px;
221
+ --primary-m-line-height-mobile: 35px;
222
+ --body-m-line-height-mobile: 24px;
223
+ --accent-xs-line-height-mobile: 19px;
224
+ --primary-l-line-height-desktop: 42px;
225
+ --primary-l-line-height-mobile: 31px;
226
+ --font-family-accent: Verdana, serif;
227
+ --font-family-accent-fancy: Verdana, sans-serif;
228
+ --font-family-basic-fancy: 'Graphik Semibold', sans-serif;
229
+ --font-family-body-fancy: Georgia, Helvetica, sans-serif;
230
+ }
@@ -0,0 +1,215 @@
1
+ {
2
+ "BORDER_COLOR_GREY_LIGHTEST": "rgb(239, 239, 239)",
3
+ "BORDER_COLOR_BRAND_SECONDARY_LIGHT": "rgb(165, 133, 83)",
4
+ "BORDER_COLOR_GREY_LIGHT": "rgb(204, 204, 204)",
5
+ "BORDER_COLOR_GREY_DARK": "rgb(102, 102, 102)",
6
+ "BORDER_COLOR_BRAND_SECONDARY_DARK": "rgb(122, 89, 45)",
7
+ "BORDER_COLOR_BRAND_SECONDARY": "rgb(0, 0, 0)",
8
+ "BORDER_COLOR_GREY": "rgb(118, 118, 118)",
9
+ "BORDER_COLOR_BRAND_PRIMARY_LIGHT": "rgb(215, 25, 32)",
10
+ "BORDER_COLOR_WHITE": "rgb(255, 255, 255)",
11
+ "BORDER_COLOR_BRAND_PRIMARY_DARK": "rgb(215, 25, 32)",
12
+ "BORDER_COLOR_BRAND_PRIMARY": "rgb(215, 25, 32)",
13
+ "BACKGROUND_COLOR_GREY_LIGHT": "rgb(204, 204, 204)",
14
+ "BACKGROUND_COLOR_GREY_LIGHTEST": "rgb(239, 239, 239)",
15
+ "BACKGROUND_COLOR_BRAND_SECONDARY_DARK": "rgb(122, 89, 45)",
16
+ "BACKGROUND_COLOR_BRAND_SECONDARY_LIGHT": "rgb(165, 133, 83)",
17
+ "BACKGROUND_COLOR_GREY_DARK": "rgb(102, 102, 102)",
18
+ "BACKGROUND_COLOR_GREY": "rgb(118, 118, 118)",
19
+ "BACKGROUND_COLOR_BODY": "rgb(255, 255, 255)",
20
+ "BACKGROUND_COLOR_BRAND_SECONDARY": "rgb(122, 89, 45)",
21
+ "BACKGROUND_COLOR_BLACK": "rgb(0, 0, 0)",
22
+ "BACKGROUND_COLOR_BRAND_PRIMARY_LIGHT": "rgb(215, 25, 32)",
23
+ "BACKGROUND_COLOR_BRAND_PRIMARY_DARK": "rgb(215, 25, 32)",
24
+ "BACKGROUND_COLOR_WHITE": "rgb(255, 255, 255)",
25
+ "BACKGROUND_COLOR_BRAND_PRIMARY": "rgb(215, 25, 32)",
26
+ "BACKGROUND_COLOR_GREY_DARKEST": "rgb(64, 64, 64)",
27
+ "COLOR_BRAND_SECONDARY": "rgb(122, 89, 45)",
28
+ "COLOR_BLACK": "rgb(0, 0, 0)",
29
+ "COLOR_BRAND_PRIMARY_LIGHT": "rgb(215, 25, 32)",
30
+ "COLOR_BRAND_PRIMARY_DARK": "rgb(215, 25, 32)",
31
+ "COLOR_WHITE": "rgb(255, 255, 255)",
32
+ "COLOR_BRAND_PRIMARY": "rgb(215, 25, 32)",
33
+ "COLOR_GREY_LIGHT": "rgb(204, 204, 204)",
34
+ "COLOR_BRAND_SECONDARY_DARK": "rgb(122, 89, 45)",
35
+ "COLOR_BRAND_SECONDARY_LIGHT": "rgb(165, 133, 83)",
36
+ "COLOR_GREY_DARK": "rgb(102, 102, 102)",
37
+ "COLOR_GREY": "rgb(118, 118, 118)",
38
+ "FONT_FAMILY_PRIMARY_FANCY": "'Publico Headline Bold', serif",
39
+ "FONT_FAMILY_PRIMARY": "serif",
40
+ "FONT_FAMILY_SECONDARY_FANCY": "'Publico Headline Roman', serif",
41
+ "FONT_FAMILY_SECONDARY": "serif",
42
+ "FONT_FAMILY_BODY": "Georgia, Helvetica, sans-serif",
43
+ "FONT_FAMILY_BASIC": "sans-serif",
44
+ "FONT_WEIGHT_LIGHT": "300",
45
+ "FONT_WEIGHT_NORMAL": "400",
46
+ "FONT_WEIGHT_BOLD": "700",
47
+ "LINE_HEIGHT_SMALL": "1.1",
48
+ "LINE_HEIGHT_NORMAL": "1.35",
49
+ "LINE_HEIGHT_COPY": "1.5",
50
+ "LINE_HEIGHT_LARGE": "1.85",
51
+ "SPACING_00": "0",
52
+ "SPACING_025": "0.25rem",
53
+ "SPACING_050": "0.5rem",
54
+ "SPACING_075": "0.75rem",
55
+ "SPACING_1": "1rem",
56
+ "SPACING_125": "1.25rem",
57
+ "SPACING_150": "1.5rem",
58
+ "SPACING_2": "2rem",
59
+ "PRIMARY_XL_FONT_SIZE_DESKTOP": "58px",
60
+ "PRIMARY_L_FONT_SIZE_MOBILE": "34px",
61
+ "BODY_S_FONT_SIZE_DESKTOP": "initial",
62
+ "PRIMARY_S_FONT_SIZE_DESKTOP": "36px",
63
+ "PRIMARY_XXS_FONT_SIZE_DESKTOP": "24px",
64
+ "ACCENT_L_FONT_SIZE_DESKTOP": "58px",
65
+ "ACCENT_M_FONT_SIZE_DESKTOP": "initial",
66
+ "PRIMARY_XXXS_FONT_SIZE_DESKTOP": "20px",
67
+ "PRIMARY_XS_FONT_SIZE_DESKTOP": "26px",
68
+ "SECONDARY_S_FONT_SIZE_MOBILE": "11px",
69
+ "ACCENT_REGULAR_XXS_FONT_SIZE_DESKTOP": "18px",
70
+ "SECONDARY_M_FONT_SIZE_MOBILE": "11px",
71
+ "ACCENT_XXS_FONT_SIZE_DESKTOP": "18px",
72
+ "ACCENT_S_FONT_SIZE_DESKTOP": "initial",
73
+ "SECONDARY_REGULAR_M_FONT_SIZE_DESKTOP": "initial",
74
+ "SECONDARY_L_FONT_SIZE_MOBILE": "17px",
75
+ "SECONDARY_L_FONT_SIZE_DESKTOP": "30px",
76
+ "SECONDARY_REGULAR_M_FONT_SIZE_MOBILE": "15px",
77
+ "ACCENT_XXS_FONT_SIZE_MOBILE": "14px",
78
+ "SECONDARY_M_FONT_SIZE_DESKTOP": "14px",
79
+ "ACCENT_S_FONT_SIZE_MOBILE": "23px",
80
+ "ACCENT_REGULAR_XXS_FONT_SIZE_MOBILE": "14px",
81
+ "PRIMARY_XS_FONT_SIZE_MOBILE": "18px",
82
+ "PRIMARY_XXXS_FONT_SIZE_MOBILE": "19px",
83
+ "ACCENT_M_FONT_SIZE_MOBILE": "26px",
84
+ "SECONDARY_S_FONT_SIZE_DESKTOP": "12px",
85
+ "ACCENT_L_FONT_SIZE_MOBILE": "40px",
86
+ "PRIMARY_XXS_FONT_SIZE_MOBILE": "22px",
87
+ "PRIMARY_S_FONT_SIZE_MOBILE": "23px",
88
+ "BODY_S_FONT_SIZE_MOBILE": "16px",
89
+ "PRIMARY_L_FONT_SIZE_DESKTOP": "45px",
90
+ "PRIMARY_XL_FONT_SIZE_MOBILE": "37px",
91
+ "ACCENT_XS_FONT_SIZE_MOBILE": "18px",
92
+ "PRIMARY_M_FONT_SIZE_MOBILE": "32px",
93
+ "BODY_M_FONT_SIZE_DESKTOP": "initial",
94
+ "BODY_M_FONT_SIZE_MOBILE": "18px",
95
+ "PRIMARY_M_FONT_SIZE_DESKTOP": "36px",
96
+ "ACCENT_XS_FONT_SIZE_DESKTOP": "23px",
97
+ "SECONDARY_S_LETTER_SPACING_MOBILE": "normal",
98
+ "SECONDARY_M_LETTER_SPACING_DESKTOP": "normal",
99
+ "SECONDARY_L_LETTER_SPACING_DESKTOP": "normal",
100
+ "PRIMARY_L_LETTER_SPACING_MOBILE": "normal",
101
+ "SECONDARY_REGULAR_M_LETTER_SPACING_DESKTOP": "normal",
102
+ "ACCENT_XS_LETTER_SPACING_MOBILE": "0.52px",
103
+ "ACCENT_S_LETTER_SPACING_DESKTOP": "normal",
104
+ "ACCENT_XXS_LETTER_SPACING_DESKTOP": ".52px",
105
+ "BODY_M_LETTER_SPACING_MOBILE": "normal",
106
+ "PRIMARY_M_LETTER_SPACING_MOBILE": "normal",
107
+ "PRIMARY_XL_LETTER_SPACING_MOBILE": "normal",
108
+ "ACCENT_REGULAR_XXS_LETTER_SPACING_DESKTOP": "0.52px",
109
+ "BODY_S_LETTER_SPACING_MOBILE": "normal",
110
+ "PRIMARY_S_LETTER_SPACING_MOBILE": "normal",
111
+ "PRIMARY_XS_LETTER_SPACING_DESKTOP": "normal",
112
+ "PRIMARY_XXS_LETTER_SPACING_MOBILE": "normal",
113
+ "PRIMARY_XXXS_LETTER_SPACING_DESKTOP": "normal",
114
+ "ACCENT_M_LETTER_SPACING_DESKTOP": "normal",
115
+ "ACCENT_L_LETTER_SPACING_DESKTOP": "1.66px",
116
+ "ACCENT_L_LETTER_SPACING_MOBILE": "1.14px",
117
+ "ACCENT_M_LETTER_SPACING_MOBILE": ".74px",
118
+ "PRIMARY_XXXS_LETTER_SPACING_MOBILE": "normal",
119
+ "PRIMARY_XXS_LETTER_SPACING_DESKTOP": "normal",
120
+ "PRIMARY_XS_LETTER_SPACING_MOBILE": "normal",
121
+ "PRIMARY_S_LETTER_SPACING_DESKTOP": "normal",
122
+ "BODY_S_LETTER_SPACING_DESKTOP": "normal",
123
+ "ACCENT_REGULAR_XXS_LETTER_SPACING_MOBILE": "0.4px",
124
+ "PRIMARY_XL_LETTER_SPACING_DESKTOP": "normal",
125
+ "ACCENT_XS_LETTER_SPACING_DESKTOP": "0.66px",
126
+ "ACCENT_XXS_LETTER_SPACING_MOBILE": ".4px",
127
+ "PRIMARY_M_LETTER_SPACING_DESKTOP": "normal",
128
+ "BODY_M_LETTER_SPACING_DESKTOP": "normal",
129
+ "ACCENT_S_LETTER_SPACING_MOBILE": ".66px",
130
+ "SECONDARY_REGULAR_M_LETTER_SPACING_MOBILE": "normal",
131
+ "PRIMARY_L_LETTER_SPACING_DESKTOP": "normal",
132
+ "SECONDARY_L_LETTER_SPACING_MOBILE": "normal",
133
+ "SECONDARY_M_LETTER_SPACING_MOBILE": "normal",
134
+ "SECONDARY_S_LETTER_SPACING_DESKTOP": "normal",
135
+ "PRIMARY_XS_FONT_WEIGHT_MOBILE": "700",
136
+ "PRIMARY_XXXS_FONT_WEIGHT_MOBILE": "700",
137
+ "ACCENT_M_FONT_WEIGHT_MOBILE": "300",
138
+ "ACCENT_REGULAR_XXS_FONT_WEIGHT_DESKTOP": "initial",
139
+ "ACCENT_L_FONT_WEIGHT_MOBILE": "300",
140
+ "PRIMARY_XXS_FONT_WEIGHT_MOBILE": "700",
141
+ "PRIMARY_S_FONT_WEIGHT_MOBILE": "700",
142
+ "BODY_S_FONT_WEIGHT_MOBILE": "initial",
143
+ "ACCENT_XXS_FONT_WEIGHT_DESKTOP": "initial",
144
+ "ACCENT_S_FONT_WEIGHT_DESKTOP": "initial",
145
+ "SECONDARY_REGULAR_M_FONT_WEIGHT_DESKTOP": "initial",
146
+ "PRIMARY_XL_FONT_WEIGHT_MOBILE": "700",
147
+ "SECONDARY_L_FONT_WEIGHT_DESKTOP": "initial",
148
+ "BODY_M_FONT_WEIGHT_MOBILE": "initial",
149
+ "ACCENT_XS_FONT_WEIGHT_MOBILE": "300",
150
+ "SECONDARY_M_FONT_WEIGHT_DESKTOP": "initial",
151
+ "PRIMARY_M_FONT_WEIGHT_MOBILE": "700",
152
+ "PRIMARY_L_FONT_WEIGHT_MOBILE": "700",
153
+ "SECONDARY_S_FONT_WEIGHT_DESKTOP": "initial",
154
+ "SECONDARY_S_FONT_WEIGHT_MOBILE": "600",
155
+ "PRIMARY_L_FONT_WEIGHT_DESKTOP": "700",
156
+ "BODY_M_FONT_WEIGHT_DESKTOP": "initial",
157
+ "PRIMARY_M_FONT_WEIGHT_DESKTOP": "700",
158
+ "ACCENT_XS_FONT_WEIGHT_DESKTOP": "initial",
159
+ "SECONDARY_M_FONT_WEIGHT_MOBILE": "600",
160
+ "PRIMARY_XL_FONT_WEIGHT_DESKTOP": "700",
161
+ "SECONDARY_L_FONT_WEIGHT_MOBILE": "600",
162
+ "SECONDARY_REGULAR_M_FONT_WEIGHT_MOBILE": "initial",
163
+ "ACCENT_S_FONT_WEIGHT_MOBILE": "300",
164
+ "ACCENT_XXS_FONT_WEIGHT_MOBILE": "300",
165
+ "BODY_S_FONT_WEIGHT_DESKTOP": "initial",
166
+ "PRIMARY_S_FONT_WEIGHT_DESKTOP": "700",
167
+ "PRIMARY_XXS_FONT_WEIGHT_DESKTOP": "700",
168
+ "ACCENT_REGULAR_XXS_FONT_WEIGHT_MOBILE": "400",
169
+ "ACCENT_L_FONT_WEIGHT_DESKTOP": "initial",
170
+ "ACCENT_M_FONT_WEIGHT_DESKTOP": "initial",
171
+ "PRIMARY_XXXS_FONT_WEIGHT_DESKTOP": "700",
172
+ "PRIMARY_XS_FONT_WEIGHT_DESKTOP": "700",
173
+ "ACCENT_XS_LINE_HEIGHT_DESKTOP": "24px",
174
+ "BODY_M_LINE_HEIGHT_DESKTOP": "initial",
175
+ "PRIMARY_M_LINE_HEIGHT_DESKTOP": "40px",
176
+ "PRIMARY_XL_LINE_HEIGHT_DESKTOP": "57px",
177
+ "PRIMARY_S_LINE_HEIGHT_DESKTOP": "38px",
178
+ "PRIMARY_XXS_LINE_HEIGHT_DESKTOP": "27px",
179
+ "SECONDARY_S_LINE_HEIGHT_MOBILE": "14px",
180
+ "BODY_S_LINE_HEIGHT_DESKTOP": "initial",
181
+ "ACCENT_L_LINE_HEIGHT_DESKTOP": "50px",
182
+ "PRIMARY_XXXS_LINE_HEIGHT_DESKTOP": "23px",
183
+ "PRIMARY_XS_LINE_HEIGHT_DESKTOP": "29px",
184
+ "ACCENT_M_LINE_HEIGHT_DESKTOP": "initial",
185
+ "ACCENT_REGULAR_XXS_LINE_HEIGHT_DESKTOP": "26px",
186
+ "SECONDARY_M_LINE_HEIGHT_MOBILE": "15px",
187
+ "SECONDARY_L_LINE_HEIGHT_MOBILE": "21px",
188
+ "ACCENT_S_LINE_HEIGHT_DESKTOP": "initial",
189
+ "ACCENT_XXS_LINE_HEIGHT_DESKTOP": "18px",
190
+ "SECONDARY_REGULAR_M_LINE_HEIGHT_MOBILE": "15px",
191
+ "SECONDARY_REGULAR_M_LINE_HEIGHT_DESKTOP": "initial",
192
+ "ACCENT_S_LINE_HEIGHT_MOBILE": "23px",
193
+ "ACCENT_XXS_LINE_HEIGHT_MOBILE": "0.4px",
194
+ "SECONDARY_L_LINE_HEIGHT_DESKTOP": "35px",
195
+ "SECONDARY_M_LINE_HEIGHT_DESKTOP": "17px",
196
+ "ACCENT_REGULAR_XXS_LINE_HEIGHT_MOBILE": "14px",
197
+ "PRIMARY_XS_LINE_HEIGHT_MOBILE": "21px",
198
+ "PRIMARY_XXXS_LINE_HEIGHT_MOBILE": "21px",
199
+ "ACCENT_M_LINE_HEIGHT_MOBILE": "26px",
200
+ "ACCENT_L_LINE_HEIGHT_MOBILE": "36px",
201
+ "SECONDARY_S_LINE_HEIGHT_DESKTOP": "17px",
202
+ "PRIMARY_XXS_LINE_HEIGHT_MOBILE": "23px",
203
+ "PRIMARY_S_LINE_HEIGHT_MOBILE": "28px",
204
+ "BODY_S_LINE_HEIGHT_MOBILE": "22px",
205
+ "PRIMARY_XL_LINE_HEIGHT_MOBILE": "37px",
206
+ "PRIMARY_M_LINE_HEIGHT_MOBILE": "35px",
207
+ "BODY_M_LINE_HEIGHT_MOBILE": "24px",
208
+ "ACCENT_XS_LINE_HEIGHT_MOBILE": "19px",
209
+ "PRIMARY_L_LINE_HEIGHT_DESKTOP": "42px",
210
+ "PRIMARY_L_LINE_HEIGHT_MOBILE": "31px",
211
+ "FONT_FAMILY_ACCENT": "Verdana, serif",
212
+ "FONT_FAMILY_ACCENT_FANCY": "Verdana, sans-serif",
213
+ "FONT_FAMILY_BASIC_FANCY": "'Graphik Semibold', sans-serif",
214
+ "FONT_FAMILY_BODY_FANCY": "Georgia, Helvetica, sans-serif"
215
+ }
@@ -0,0 +1,230 @@
1
+
2
+ $rollingstone-2022-map: (
3
+ 'border-color-grey-lightest': (rgb(239, 239, 239)),
4
+ 'border-color-brand-secondary-light': (rgb(165, 133, 83)),
5
+ 'border-color-grey-light': (rgb(204, 204, 204)),
6
+ 'border-color-grey-dark': (rgb(102, 102, 102)),
7
+ 'border-color-brand-secondary-dark': (rgb(122, 89, 45)),
8
+ 'border-color-brand-secondary': (rgb(0, 0, 0)),
9
+ 'border-color-grey': (rgb(118, 118, 118)),
10
+ 'border-color-brand-primary-light': (rgb(215, 25, 32)),
11
+ 'border-color-white': (rgb(255, 255, 255)),
12
+ 'border-color-brand-primary-dark': (rgb(215, 25, 32)),
13
+ 'border-color-brand-primary': (rgb(215, 25, 32)),
14
+ 'background-color-grey-light': (rgb(204, 204, 204)),
15
+ 'background-color-grey-lightest': (rgb(239, 239, 239)),
16
+ 'background-color-brand-secondary-dark': (rgb(122, 89, 45)),
17
+ 'background-color-brand-secondary-light': (rgb(165, 133, 83)),
18
+ 'background-color-grey-dark': (rgb(102, 102, 102)),
19
+ 'background-color-grey': (rgb(118, 118, 118)),
20
+ /* The background color of the main body of the site. */
21
+ 'background-color-body': (rgb(255, 255, 255)),
22
+ 'background-color-brand-secondary': (rgb(122, 89, 45)),
23
+ 'background-color-black': (rgb(0, 0, 0)),
24
+ 'background-color-brand-primary-light': (rgb(215, 25, 32)),
25
+ 'background-color-brand-primary-dark': (rgb(215, 25, 32)),
26
+ 'background-color-white': (rgb(255, 255, 255)),
27
+ /* The primary brand color. This should be dark in hue, and have sufficient contrast with white text. */
28
+ 'background-color-brand-primary': (rgb(215, 25, 32)),
29
+ 'background-color-grey-darkest': (rgb(64, 64, 64)),
30
+ 'color-brand-secondary': (rgb(122, 89, 45)),
31
+ 'color-black': (rgb(0, 0, 0)),
32
+ 'color-brand-primary-light': (rgb(215, 25, 32)),
33
+ 'color-brand-primary-dark': (rgb(215, 25, 32)),
34
+ 'color-white': (rgb(255, 255, 255)),
35
+ 'color-brand-primary': (rgb(215, 25, 32)),
36
+ 'color-grey-light': (rgb(204, 204, 204)),
37
+ 'color-brand-secondary-dark': (rgb(122, 89, 45)),
38
+ 'color-brand-secondary-light': (rgb(165, 133, 83)),
39
+ 'color-grey-dark': (rgb(102, 102, 102)),
40
+ 'color-grey': (rgb(118, 118, 118)),
41
+ /* The webfont, loaded async */
42
+ 'font-family-primary-fancy': ('Publico Headline Bold', serif),
43
+ /* The webfont, loaded async */
44
+ 'font-family-primary': (serif),
45
+ /* The webfont, loaded async */
46
+ 'font-family-secondary-fancy': ('Publico Headline Roman', serif),
47
+ /* Fallback for secondary-fancy */
48
+ 'font-family-secondary': (serif),
49
+ 'font-family-body': (Georgia, Helvetica, sans-serif),
50
+ 'font-family-basic': (sans-serif),
51
+ 'font-weight-light': (300),
52
+ 'font-weight-normal': (400),
53
+ 'font-weight-bold': (700),
54
+ 'line-height-small': (1.1),
55
+ 'line-height-normal': (1.35),
56
+ 'line-height-copy': (1.5),
57
+ 'line-height-large': (1.85),
58
+ /* Used for margins and padding only. */
59
+ 'spacing-00': (0),
60
+ /* Used for margins and padding only. */
61
+ 'spacing-025': (0.25rem),
62
+ /* Used for margins and padding only. */
63
+ 'spacing-050': (0.5rem),
64
+ /* Used for margins and padding only. */
65
+ 'spacing-075': (0.75rem),
66
+ /* Used for margins and padding only. */
67
+ 'spacing-1': (1rem),
68
+ /* Used for margins and padding only. */
69
+ 'spacing-125': (1.25rem),
70
+ /* Used for margins and padding only. */
71
+ 'spacing-150': (1.5rem),
72
+ /* Used for margins and padding only. */
73
+ 'spacing-2': (2rem),
74
+ 'primary-xl-font-size-desktop': (58px),
75
+ 'primary-l-font-size-mobile': (34px),
76
+ 'body-s-font-size-desktop': (initial),
77
+ 'primary-s-font-size-desktop': (36px),
78
+ 'primary-xxs-font-size-desktop': (24px),
79
+ 'accent-l-font-size-desktop': (58px),
80
+ 'accent-m-font-size-desktop': (initial),
81
+ 'primary-xxxs-font-size-desktop': (20px),
82
+ 'primary-xs-font-size-desktop': (26px),
83
+ 'secondary-s-font-size-mobile': (11px),
84
+ 'accent-regular-xxs-font-size-desktop': (18px),
85
+ 'secondary-m-font-size-mobile': (11px),
86
+ 'accent-xxs-font-size-desktop': (18px),
87
+ 'accent-s-font-size-desktop': (initial),
88
+ 'secondary-regular-m-font-size-desktop': (initial),
89
+ 'secondary-l-font-size-mobile': (17px),
90
+ 'secondary-l-font-size-desktop': (30px),
91
+ 'secondary-regular-m-font-size-mobile': (15px),
92
+ 'accent-xxs-font-size-mobile': (14px),
93
+ 'secondary-m-font-size-desktop': (14px),
94
+ 'accent-s-font-size-mobile': (23px),
95
+ 'accent-regular-xxs-font-size-mobile': (14px),
96
+ 'primary-xs-font-size-mobile': (18px),
97
+ 'primary-xxxs-font-size-mobile': (19px),
98
+ 'accent-m-font-size-mobile': (26px),
99
+ 'secondary-s-font-size-desktop': (12px),
100
+ 'accent-l-font-size-mobile': (40px),
101
+ 'primary-xxs-font-size-mobile': (22px),
102
+ 'primary-s-font-size-mobile': (23px),
103
+ 'body-s-font-size-mobile': (16px),
104
+ 'primary-l-font-size-desktop': (45px),
105
+ 'primary-xl-font-size-mobile': (37px),
106
+ 'accent-xs-font-size-mobile': (18px),
107
+ 'primary-m-font-size-mobile': (32px),
108
+ 'body-m-font-size-desktop': (initial),
109
+ 'body-m-font-size-mobile': (18px),
110
+ 'primary-m-font-size-desktop': (36px),
111
+ 'accent-xs-font-size-desktop': (23px),
112
+ 'secondary-s-letter-spacing-mobile': (normal),
113
+ 'secondary-m-letter-spacing-desktop': (normal),
114
+ 'secondary-l-letter-spacing-desktop': (normal),
115
+ 'primary-l-letter-spacing-mobile': (normal),
116
+ 'secondary-regular-m-letter-spacing-desktop': (normal),
117
+ 'accent-xs-letter-spacing-mobile': (0.52px),
118
+ 'accent-s-letter-spacing-desktop': (normal),
119
+ 'accent-xxs-letter-spacing-desktop': (.52px),
120
+ 'body-m-letter-spacing-mobile': (normal),
121
+ 'primary-m-letter-spacing-mobile': (normal),
122
+ 'primary-xl-letter-spacing-mobile': (normal),
123
+ 'accent-regular-xxs-letter-spacing-desktop': (0.52px),
124
+ 'body-s-letter-spacing-mobile': (normal),
125
+ 'primary-s-letter-spacing-mobile': (normal),
126
+ 'primary-xs-letter-spacing-desktop': (normal),
127
+ 'primary-xxs-letter-spacing-mobile': (normal),
128
+ 'primary-xxxs-letter-spacing-desktop': (normal),
129
+ 'accent-m-letter-spacing-desktop': (normal),
130
+ 'accent-l-letter-spacing-desktop': (1.66px),
131
+ 'accent-l-letter-spacing-mobile': (1.14px),
132
+ 'accent-m-letter-spacing-mobile': (.74px),
133
+ 'primary-xxxs-letter-spacing-mobile': (normal),
134
+ 'primary-xxs-letter-spacing-desktop': (normal),
135
+ 'primary-xs-letter-spacing-mobile': (normal),
136
+ 'primary-s-letter-spacing-desktop': (normal),
137
+ 'body-s-letter-spacing-desktop': (normal),
138
+ 'accent-regular-xxs-letter-spacing-mobile': (0.4px),
139
+ 'primary-xl-letter-spacing-desktop': (normal),
140
+ 'accent-xs-letter-spacing-desktop': (0.66px),
141
+ 'accent-xxs-letter-spacing-mobile': (.4px),
142
+ 'primary-m-letter-spacing-desktop': (normal),
143
+ 'body-m-letter-spacing-desktop': (normal),
144
+ 'accent-s-letter-spacing-mobile': (.66px),
145
+ 'secondary-regular-m-letter-spacing-mobile': (normal),
146
+ 'primary-l-letter-spacing-desktop': (normal),
147
+ 'secondary-l-letter-spacing-mobile': (normal),
148
+ 'secondary-m-letter-spacing-mobile': (normal),
149
+ 'secondary-s-letter-spacing-desktop': (normal),
150
+ 'primary-xs-font-weight-mobile': (700),
151
+ 'primary-xxxs-font-weight-mobile': (700),
152
+ 'accent-m-font-weight-mobile': (300),
153
+ 'accent-regular-xxs-font-weight-desktop': (initial),
154
+ 'accent-l-font-weight-mobile': (300),
155
+ 'primary-xxs-font-weight-mobile': (700),
156
+ 'primary-s-font-weight-mobile': (700),
157
+ 'body-s-font-weight-mobile': (initial),
158
+ 'accent-xxs-font-weight-desktop': (initial),
159
+ 'accent-s-font-weight-desktop': (initial),
160
+ 'secondary-regular-m-font-weight-desktop': (initial),
161
+ 'primary-xl-font-weight-mobile': (700),
162
+ 'secondary-l-font-weight-desktop': (initial),
163
+ 'body-m-font-weight-mobile': (initial),
164
+ 'accent-xs-font-weight-mobile': (300),
165
+ 'secondary-m-font-weight-desktop': (initial),
166
+ 'primary-m-font-weight-mobile': (700),
167
+ 'primary-l-font-weight-mobile': (700),
168
+ 'secondary-s-font-weight-desktop': (initial),
169
+ 'secondary-s-font-weight-mobile': (600),
170
+ 'primary-l-font-weight-desktop': (700),
171
+ 'body-m-font-weight-desktop': (initial),
172
+ 'primary-m-font-weight-desktop': (700),
173
+ 'accent-xs-font-weight-desktop': (initial),
174
+ 'secondary-m-font-weight-mobile': (600),
175
+ 'primary-xl-font-weight-desktop': (700),
176
+ 'secondary-l-font-weight-mobile': (600),
177
+ 'secondary-regular-m-font-weight-mobile': (initial),
178
+ 'accent-s-font-weight-mobile': (300),
179
+ 'accent-xxs-font-weight-mobile': (300),
180
+ 'body-s-font-weight-desktop': (initial),
181
+ 'primary-s-font-weight-desktop': (700),
182
+ 'primary-xxs-font-weight-desktop': (700),
183
+ 'accent-regular-xxs-font-weight-mobile': (400),
184
+ 'accent-l-font-weight-desktop': (initial),
185
+ 'accent-m-font-weight-desktop': (initial),
186
+ 'primary-xxxs-font-weight-desktop': (700),
187
+ 'primary-xs-font-weight-desktop': (700),
188
+ 'accent-xs-line-height-desktop': (24px),
189
+ 'body-m-line-height-desktop': (initial),
190
+ 'primary-m-line-height-desktop': (40px),
191
+ 'primary-xl-line-height-desktop': (57px),
192
+ 'primary-s-line-height-desktop': (38px),
193
+ 'primary-xxs-line-height-desktop': (27px),
194
+ 'secondary-s-line-height-mobile': (14px),
195
+ 'body-s-line-height-desktop': (initial),
196
+ 'accent-l-line-height-desktop': (50px),
197
+ 'primary-xxxs-line-height-desktop': (23px),
198
+ 'primary-xs-line-height-desktop': (29px),
199
+ 'accent-m-line-height-desktop': (initial),
200
+ 'accent-regular-xxs-line-height-desktop': (26px),
201
+ 'secondary-m-line-height-mobile': (15px),
202
+ 'secondary-l-line-height-mobile': (21px),
203
+ 'accent-s-line-height-desktop': (initial),
204
+ 'accent-xxs-line-height-desktop': (18px),
205
+ 'secondary-regular-m-line-height-mobile': (15px),
206
+ 'secondary-regular-m-line-height-desktop': (initial),
207
+ 'accent-s-line-height-mobile': (23px),
208
+ 'accent-xxs-line-height-mobile': (0.4px),
209
+ 'secondary-l-line-height-desktop': (35px),
210
+ 'secondary-m-line-height-desktop': (17px),
211
+ 'accent-regular-xxs-line-height-mobile': (14px),
212
+ 'primary-xs-line-height-mobile': (21px),
213
+ 'primary-xxxs-line-height-mobile': (21px),
214
+ 'accent-m-line-height-mobile': (26px),
215
+ 'accent-l-line-height-mobile': (36px),
216
+ 'secondary-s-line-height-desktop': (17px),
217
+ 'primary-xxs-line-height-mobile': (23px),
218
+ 'primary-s-line-height-mobile': (28px),
219
+ 'body-s-line-height-mobile': (22px),
220
+ 'primary-xl-line-height-mobile': (37px),
221
+ 'primary-m-line-height-mobile': (35px),
222
+ 'body-m-line-height-mobile': (24px),
223
+ 'accent-xs-line-height-mobile': (19px),
224
+ 'primary-l-line-height-desktop': (42px),
225
+ 'primary-l-line-height-mobile': (31px),
226
+ 'font-family-accent': (Verdana, serif),
227
+ 'font-family-accent-fancy': (Verdana, sans-serif),
228
+ 'font-family-basic-fancy': ('Graphik Semibold', sans-serif),
229
+ 'font-family-body-fancy': (Georgia, Helvetica, sans-serif),
230
+ );