@new-ui/typography 0.2.0 → 0.2.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/dist/index.css CHANGED
@@ -1,261 +1,2 @@
1
- :root {
2
- --system-ui: system-ui, sans-serif;
3
- --old-style:
4
- 'Iowan Old Style', 'Palatino Linotype', 'URW Palladio L', p052, serif;
5
- --monospace-code:
6
- ui-monospace, 'Cascadia Code', 'Source Code Pro', menlo, consolas, monospace;
7
- --handwritten:
8
- 'Segoe Print', 'Bradley Hand', chilanka, tscu_comic, casual, cursive;
9
- --mobile-heading-01: 2rem;
10
- --mobile-heading-02: 1.75rem;
11
- --mobile-heading-03: 1.5rem;
12
- --mobile-heading-04: 1.25rem;
13
- --mobile-heading-05: 1.125rem;
14
- --mobile-heading-06: 1rem;
15
- --mobile-body-xl: 1rem;
16
- --mobile-body: 0.875rem;
17
- --mobile-body-sm: 0.75rem;
18
- --mobile-caption: 0.75rem;
19
- --mobile-helper-text: 0.75rem;
20
- --mobile-code: 0.875rem;
21
- --lh-mobile-heading-01: 2.5rem;
22
- --lh-mobile-heading-02: 2.25rem;
23
- --lh-mobile-heading-03: 1.875rem;
24
- --lh-mobile-heading-04: 1.75rem;
25
- --lh-mobile-heading-05: 1.625rem;
26
- --lh-mobile-heading-06: 1.5rem;
27
- --lh-mobile-body-xl: 1.5rem;
28
- --lh-mobile-body: 1.25rem;
29
- --lh-mobile-body-sm: 1rem;
30
- --lh-mobile-caption: 1rem;
31
- --lh-mobile-helper-text: 1rem;
32
- --lh-mobile-code: 1.25rem;
33
- --mobile-tracking-heading-01: -0.05rem;
34
- --mobile-tracking-heading-02: -0.025rem;
35
- --mobile-tracking-heading-03: -0.025rem;
36
- --desktop-heading-01: 3.375rem;
37
- --desktop-heading-02: 2.625rem;
38
- --desktop-heading-03: 2rem;
39
- --desktop-heading-04: 1.75rem;
40
- --desktop-heading-05: 1.25rem;
41
- --desktop-heading-06: 1.125rem;
42
- --desktop-body-xl: 1.125rem;
43
- --desktop-body: 1rem;
44
- --desktop-body-sm: 0.875rem;
45
- --desktop-caption: 0.75rem;
46
- --desktop-helper-text: 0.75rem;
47
- --desktop-code: 0.875rem;
48
- --lh-desktop-heading-01: 4rem;
49
- --lh-desktop-heading-02: 3.125rem;
50
- --lh-desktop-heading-03: 2.5rem;
51
- --lh-desktop-heading-04: 2.25rem;
52
- --lh-desktop-heading-05: 1.75rem;
53
- --lh-desktop-heading-06: 1.625rem;
54
- --lh-desktop-body-xl: 1.625rem;
55
- --lh-desktop-body: 1.5rem;
56
- --lh-desktop-body-sm: 1.25rem;
57
- --lh-desktop-caption: 1rem;
58
- --lh-desktop-helper-text: 1rem;
59
- --lh-desktop-code: 1.25rem;
60
- --desktop-tracking-heading-01: -0.075rem;
61
- --desktop-tracking-heading-02: -0.05rem;
62
- --desktop-tracking-heading-03: -0.025rem;
63
- }
64
- .nu-u-fw-bold {
65
- font-weight: 700;
66
- }
67
- .nu-u-fw-semi-bold {
68
- font-weight: 500;
69
- }
70
- .nu-u-fw-normal {
71
- font-weight: 400;
72
- }
73
- .nu-u-text--uppercase {
74
- text-transform: uppercase;
75
- }
76
- .nu-u-text--lowercase {
77
- text-transform: lowercase;
78
- }
79
- .nu-u-text--capitalize {
80
- text-transform: capitalize;
81
- }
82
- .nu-u-text--underline {
83
- text-decoration: underline;
84
- }
85
- .nu-u-text--left {
86
- text-align: left;
87
- }
88
- .nu-u-text--right {
89
- text-align: right;
90
- }
91
- .nu-u-text--center {
92
- text-align: center;
93
- }
94
- .nu-u-text--justify {
95
- text-align: justify;
96
- }
97
- .nu-u-serif {
98
- font-family:
99
- Didot,
100
- Bodoni MT,
101
- Noto Serif Display,
102
- URW Palladio L,
103
- P052,
104
- Sylfaen,
105
- serif;
106
- }
107
- .nu-u-sans-serif {
108
- font-family:
109
- Inter,
110
- Roboto,
111
- Helvetica Neue,
112
- Arial Nova,
113
- Nimbus Sans,
114
- Arial,
115
- sans-serif;
116
- }
117
- .nu-u-code {
118
- font-family:
119
- ui-monospace,
120
- Cascadia Code,
121
- Source Code Pro,
122
- Menlo,
123
- Consolas,
124
- DejaVu Sans Mono,
125
- monospace;
126
- }
127
- .nu-c-h1 {
128
- font-weight: 700;
129
- font-size: var(--desktop-heading-01);
130
- line-height: var(--lh-desktop-heading-01);
131
- letter-spacing: var(--desktop-tracking-heading-01);
132
- }
133
- @media screen and (width<=37.5rem) {
134
- .nu-c-h1 {
135
- font-size: var(--mobile-heading-01);
136
- line-height: var(--lh-mobile-heading-01);
137
- letter-spacing: var(--mobile-tracking-heading-01);
138
- }
139
- }
140
- .nu-c-h2 {
141
- font-weight: 700;
142
- font-size: var(--desktop-heading-02);
143
- line-height: var(--lh-desktop-heading-02);
144
- letter-spacing: var(--desktop-tracking-heading-02);
145
- }
146
- @media screen and (width<=37.5rem) {
147
- .nu-c-h2 {
148
- font-size: var(--mobile-heading-02);
149
- line-height: var(--lh-mobile-heading-02);
150
- letter-spacing: var(--mobile-tracking-heading-02);
151
- }
152
- }
153
- .nu-c-h3 {
154
- font-weight: 700;
155
- font-size: var(--desktop-heading-03);
156
- line-height: var(--lh-desktop-heading-03);
157
- letter-spacing: var(--desktop-tracking-heading-03);
158
- }
159
- @media screen and (width<=37.5rem) {
160
- .nu-c-h3 {
161
- font-size: var(--mobile-heading-03);
162
- line-height: var(--lh-mobile-heading-03);
163
- letter-spacing: var(--mobile-tracking-heading-03);
164
- }
165
- }
166
- .nu-c-h4 {
167
- font-weight: 700;
168
- font-size: var(--desktop-heading-04);
169
- line-height: var(--lh-desktop-heading-04);
170
- }
171
- @media screen and (width<=37.5rem) {
172
- .nu-c-h4 {
173
- font-size: var(--mobile-heading-04);
174
- line-height: var(--lh-mobile-heading-04);
175
- }
176
- }
177
- .nu-c-h5 {
178
- font-weight: 700;
179
- font-size: var(--desktop-heading-05);
180
- line-height: var(--lh-desktop-heading-05);
181
- }
182
- @media screen and (width<=37.5rem) {
183
- .nu-c-h5 {
184
- font-size: var(--mobile-heading-05);
185
- line-height: var(--lh-mobile-heading-05);
186
- }
187
- }
188
- .nu-c-h6 {
189
- font-weight: 500;
190
- font-size: var(--desktop-heading-06);
191
- line-height: var(--lh-desktop-heading-06);
192
- }
193
- @media screen and (width<=37.5rem) {
194
- .nu-c-h6 {
195
- font-size: var(--mobile-heading-06);
196
- line-height: var(--lh-mobile-heading-06);
197
- }
198
- }
199
- .nu-c-fs-lead {
200
- font-size: var(--desktop-body-xl);
201
- line-height: var(--lh-desktop-body-xl);
202
- }
203
- @media screen and (width<=37.5rem) {
204
- .nu-c-fs-lead {
205
- font-size: var(--mobile-body-xl);
206
- line-height: var(--lh-mobile-body-xl);
207
- }
208
- }
209
- .nu-c-fs-normal {
210
- font-size: var(--desktop-body);
211
- line-height: var(--lh-desktop-body);
212
- }
213
- @media screen and (width<=37.5rem) {
214
- .nu-c-fs-normal {
215
- font-size: var(--mobile-body);
216
- line-height: var(--lh-mobile-body);
217
- }
218
- }
219
- .nu-c-fs-small {
220
- font-size: var(--desktop-body-sm);
221
- line-height: var(--lh-desktop-body-sm);
222
- }
223
- @media screen and (width<=37.5rem) {
224
- .nu-c-fs-small {
225
- font-size: var(--mobile-body-sm);
226
- line-height: var(--lh-mobile-body-sm);
227
- }
228
- }
229
- .nu-c-caption {
230
- text-transform: uppercase;
231
- font-weight: 500;
232
- font-size: var(--desktop-caption);
233
- line-height: var(--lh-desktop-caption);
234
- }
235
- @media screen and (width<=37.5rem) {
236
- .nu-c-caption {
237
- font-size: var(--mobile-caption);
238
- line-height: var(--lh-mobile-caption);
239
- }
240
- }
241
- .nu-c-helper-text {
242
- font-size: var(--desktop-helper-text);
243
- line-height: var(--lh-desktop-helper-text);
244
- }
245
- @media screen and (width<=37.5rem) {
246
- .nu-c-helper-text {
247
- font-size: var(--mobile-helper-text);
248
- line-height: var(--lh-mobile-helper-text);
249
- }
250
- }
251
- .nu-c-code {
252
- font-size: var(--desktop-code);
253
- line-height: var(--desktop-code);
254
- }
255
- @media screen and (width<=37.5rem) {
256
- .nu-c-code {
257
- font-size: var(--mobile-code);
258
- line-height: var(--mobile-code);
259
- }
260
- }
1
+ :root{--system-ui:system-ui, sans-serif;--old-style:"Iowan Old Style", "Palatino Linotype", "URW Palladio L", p052, serif;--monospace-code:ui-monospace, "Cascadia Code", "Source Code Pro", menlo, consolas, monospace;--handwritten:"Segoe Print", "Bradley Hand", chilanka, tscu_comic, casual, cursive;--mobile-heading-01:2rem;--mobile-heading-02:1.75rem;--mobile-heading-03:1.5rem;--mobile-heading-04:1.25rem;--mobile-heading-05:1.125rem;--mobile-heading-06:1rem;--mobile-body-xl:1rem;--mobile-body:.875rem;--mobile-body-sm:.75rem;--mobile-caption:.75rem;--mobile-helper-text:.75rem;--mobile-code:.875rem;--lh-mobile-heading-01:2.5rem;--lh-mobile-heading-02:2.25rem;--lh-mobile-heading-03:1.875rem;--lh-mobile-heading-04:1.75rem;--lh-mobile-heading-05:1.625rem;--lh-mobile-heading-06:1.5rem;--lh-mobile-body-xl:1.5rem;--lh-mobile-body:1.25rem;--lh-mobile-body-sm:1rem;--lh-mobile-caption:1rem;--lh-mobile-helper-text:1rem;--lh-mobile-code:1.25rem;--mobile-tracking-heading-01:-.05rem;--mobile-tracking-heading-02:-.025rem;--mobile-tracking-heading-03:-.025rem;--desktop-heading-01:3.375rem;--desktop-heading-02:2.625rem;--desktop-heading-03:2rem;--desktop-heading-04:1.75rem;--desktop-heading-05:1.25rem;--desktop-heading-06:1.125rem;--desktop-body-xl:1.125rem;--desktop-body:1rem;--desktop-body-sm:.875rem;--desktop-caption:.75rem;--desktop-helper-text:.75rem;--desktop-code:.875rem;--lh-desktop-heading-01:4rem;--lh-desktop-heading-02:3.125rem;--lh-desktop-heading-03:2.5rem;--lh-desktop-heading-04:2.25rem;--lh-desktop-heading-05:1.75rem;--lh-desktop-heading-06:1.625rem;--lh-desktop-body-xl:1.625rem;--lh-desktop-body:1.5rem;--lh-desktop-body-sm:1.25rem;--lh-desktop-caption:1rem;--lh-desktop-helper-text:1rem;--lh-desktop-code:1.25rem;--desktop-tracking-heading-01:-.075rem;--desktop-tracking-heading-02:-.05rem;--desktop-tracking-heading-03:-.025rem}.nu-u-fw-bold{font-weight:700}.nu-u-fw-semi-bold{font-weight:500}.nu-u-fw-normal{font-weight:400}.nu-u-text--uppercase{text-transform:uppercase}.nu-u-text--lowercase{text-transform:lowercase}.nu-u-text--capitalize{text-transform:capitalize}.nu-u-text--underline{text-decoration:underline}.nu-u-text--left{text-align:left}.nu-u-text--right{text-align:right}.nu-u-text--center{text-align:center}.nu-u-text--justify{text-align:justify}.nu-u-serif{font-family:Didot,Bodoni MT,Noto Serif Display,URW Palladio L,P052,Sylfaen,serif}.nu-u-sans-serif{font-family:Inter,Roboto,Helvetica Neue,Arial Nova,Nimbus Sans,Arial,sans-serif}.nu-u-code{font-family:var(--monospace-code)}.nu-c-h1{font-weight:700;font-size:var(--desktop-heading-01);line-height:var(--lh-desktop-heading-01);letter-spacing:var(--desktop-tracking-heading-01)}@media screen and (width<=37.5rem){.nu-c-h1{font-size:var(--mobile-heading-01);line-height:var(--lh-mobile-heading-01);letter-spacing:var(--mobile-tracking-heading-01)}}.nu-c-h2{font-weight:700;font-size:var(--desktop-heading-02);line-height:var(--lh-desktop-heading-02);letter-spacing:var(--desktop-tracking-heading-02)}@media screen and (width<=37.5rem){.nu-c-h2{font-size:var(--mobile-heading-02);line-height:var(--lh-mobile-heading-02);letter-spacing:var(--mobile-tracking-heading-02)}}.nu-c-h3{font-weight:700;font-size:var(--desktop-heading-03);line-height:var(--lh-desktop-heading-03);letter-spacing:var(--desktop-tracking-heading-03)}@media screen and (width<=37.5rem){.nu-c-h3{font-size:var(--mobile-heading-03);line-height:var(--lh-mobile-heading-03);letter-spacing:var(--mobile-tracking-heading-03)}}.nu-c-h4{font-weight:700;font-size:var(--desktop-heading-04);line-height:var(--lh-desktop-heading-04)}@media screen and (width<=37.5rem){.nu-c-h4{font-size:var(--mobile-heading-04);line-height:var(--lh-mobile-heading-04)}}.nu-c-h5{font-weight:700;font-size:var(--desktop-heading-05);line-height:var(--lh-desktop-heading-05)}@media screen and (width<=37.5rem){.nu-c-h5{font-size:var(--mobile-heading-05);line-height:var(--lh-mobile-heading-05)}}.nu-c-h6{font-weight:500;font-size:var(--desktop-heading-06);line-height:var(--lh-desktop-heading-06)}@media screen and (width<=37.5rem){.nu-c-h6{font-size:var(--mobile-heading-06);line-height:var(--lh-mobile-heading-06)}}.nu-c-fs-lead{font-size:var(--desktop-body-xl);line-height:var(--lh-desktop-body-xl)}@media screen and (width<=37.5rem){.nu-c-fs-lead{font-size:var(--mobile-body-xl);line-height:var(--lh-mobile-body-xl)}}.nu-c-fs-normal{font-size:var(--desktop-body);line-height:var(--lh-desktop-body)}@media screen and (width<=37.5rem){.nu-c-fs-normal{font-size:var(--mobile-body);line-height:var(--lh-mobile-body)}}.nu-c-fs-small{font-size:var(--desktop-body-sm);line-height:var(--lh-desktop-body-sm)}@media screen and (width<=37.5rem){.nu-c-fs-small{font-size:var(--mobile-body-sm);line-height:var(--lh-mobile-body-sm)}}.nu-c-caption{text-transform:uppercase;font-weight:500;font-size:var(--desktop-caption);line-height:var(--lh-desktop-caption)}@media screen and (width<=37.5rem){.nu-c-caption{font-size:var(--mobile-caption);line-height:var(--lh-mobile-caption)}}.nu-c-helper-text{font-size:var(--desktop-helper-text);line-height:var(--lh-desktop-helper-text)}@media screen and (width<=37.5rem){.nu-c-helper-text{font-size:var(--mobile-helper-text);line-height:var(--lh-mobile-helper-text)}}.nu-c-code{font-family:var(--monospace-code);font-size:var(--desktop-code);line-height:var(--desktop-code)}@media screen and (width<=37.5rem){.nu-c-code{font-size:var(--mobile-code);line-height:var(--mobile-code)}}
261
2
  /*# sourceMappingURL=index.css.map */
@@ -1 +1 @@
1
- {"mappings":"ACAA,+yDCCA,8BAIA,mCAIA,gCAKA,+CAIA,+CAIA,iDAIA,gDAIA,iCAIA,mCAIA,qCAIA,uCAKA,6FAMA,iGAMA,4GCxDA,wJAME,mCANF,sIAaA,wJAME,mCANF,sIAaA,wJAME,mCANF,sIAaA,sGAKE,mCALF,qFAWA,sGAKE,mCALF,qFAWA,sGAKE,mCALF,qFAWA,qFAIE,mCAJF,oFAUA,iFAIE,mCAJF,gFAUA,sFAIE,mCAJF,qFAUA,8HAME,mCANF,oFAYA,iGAIE,mCAJF,gGAUA,yEAIE,mCAJF","sources":["index.css","src/_fonts.scss","src/_utilities.scss","src/_components.scss"],"sourcesContent":[":root {\n --system-ui: system-ui, sans-serif;\n --old-style: \"Iowan Old Style\", \"Palatino Linotype\", \"URW Palladio L\", p052, serif;\n --monospace-code: ui-monospace, \"Cascadia Code\", \"Source Code Pro\", menlo, consolas, monospace;\n --handwritten: \"Segoe Print\", \"Bradley Hand\", chilanka, tscu_comic, casual, cursive;\n --mobile-heading-01: 2rem;\n --mobile-heading-02: 1.75rem;\n --mobile-heading-03: 1.5rem;\n --mobile-heading-04: 1.25rem;\n --mobile-heading-05: 1.125rem;\n --mobile-heading-06: 1rem;\n --mobile-body-xl: 1rem;\n --mobile-body: .875rem;\n --mobile-body-sm: .75rem;\n --mobile-caption: .75rem;\n --mobile-helper-text: .75rem;\n --mobile-code: .875rem;\n --lh-mobile-heading-01: 2.5rem;\n --lh-mobile-heading-02: 2.25rem;\n --lh-mobile-heading-03: 1.875rem;\n --lh-mobile-heading-04: 1.75rem;\n --lh-mobile-heading-05: 1.625rem;\n --lh-mobile-heading-06: 1.5rem;\n --lh-mobile-body-xl: 1.5rem;\n --lh-mobile-body: 1.25rem;\n --lh-mobile-body-sm: 1rem;\n --lh-mobile-caption: 1rem;\n --lh-mobile-helper-text: 1rem;\n --lh-mobile-code: 1.25rem;\n --mobile-tracking-heading-01: -.05rem;\n --mobile-tracking-heading-02: -.025rem;\n --mobile-tracking-heading-03: -.025rem;\n --desktop-heading-01: 3.375rem;\n --desktop-heading-02: 2.625rem;\n --desktop-heading-03: 2rem;\n --desktop-heading-04: 1.75rem;\n --desktop-heading-05: 1.25rem;\n --desktop-heading-06: 1.125rem;\n --desktop-body-xl: 1.125rem;\n --desktop-body: 1rem;\n --desktop-body-sm: .875rem;\n --desktop-caption: .75rem;\n --desktop-helper-text: .75rem;\n --desktop-code: .875rem;\n --lh-desktop-heading-01: 4rem;\n --lh-desktop-heading-02: 3.125rem;\n --lh-desktop-heading-03: 2.5rem;\n --lh-desktop-heading-04: 2.25rem;\n --lh-desktop-heading-05: 1.75rem;\n --lh-desktop-heading-06: 1.625rem;\n --lh-desktop-body-xl: 1.625rem;\n --lh-desktop-body: 1.5rem;\n --lh-desktop-body-sm: 1.25rem;\n --lh-desktop-caption: 1rem;\n --lh-desktop-helper-text: 1rem;\n --lh-desktop-code: 1.25rem;\n --desktop-tracking-heading-01: -.075rem;\n --desktop-tracking-heading-02: -.05rem;\n --desktop-tracking-heading-03: -.025rem;\n}\n\n.nu-u-fw-bold {\n font-weight: 700;\n}\n\n.nu-u-fw-semi-bold {\n font-weight: 500;\n}\n\n.nu-u-fw-normal {\n font-weight: 400;\n}\n\n.nu-u-text--uppercase {\n text-transform: uppercase;\n}\n\n.nu-u-text--lowercase {\n text-transform: lowercase;\n}\n\n.nu-u-text--capitalize {\n text-transform: capitalize;\n}\n\n.nu-u-text--underline {\n text-decoration: underline;\n}\n\n.nu-u-text--left {\n text-align: left;\n}\n\n.nu-u-text--right {\n text-align: right;\n}\n\n.nu-u-text--center {\n text-align: center;\n}\n\n.nu-u-text--justify {\n text-align: justify;\n}\n\n.nu-u-serif {\n font-family: Didot, Bodoni MT, Noto Serif Display, URW Palladio L, P052, Sylfaen, serif;\n}\n\n.nu-u-sans-serif {\n font-family: Inter, Roboto, Helvetica Neue, Arial Nova, Nimbus Sans, Arial, sans-serif;\n}\n\n.nu-u-code {\n font-family: ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;\n}\n\n.nu-c-h1 {\n font-weight: 700;\n font-size: var(--desktop-heading-01);\n line-height: var(--lh-desktop-heading-01);\n letter-spacing: var(--desktop-tracking-heading-01);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-h1 {\n font-size: var(--mobile-heading-01);\n line-height: var(--lh-mobile-heading-01);\n letter-spacing: var(--mobile-tracking-heading-01);\n }\n}\n\n.nu-c-h2 {\n font-weight: 700;\n font-size: var(--desktop-heading-02);\n line-height: var(--lh-desktop-heading-02);\n letter-spacing: var(--desktop-tracking-heading-02);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-h2 {\n font-size: var(--mobile-heading-02);\n line-height: var(--lh-mobile-heading-02);\n letter-spacing: var(--mobile-tracking-heading-02);\n }\n}\n\n.nu-c-h3 {\n font-weight: 700;\n font-size: var(--desktop-heading-03);\n line-height: var(--lh-desktop-heading-03);\n letter-spacing: var(--desktop-tracking-heading-03);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-h3 {\n font-size: var(--mobile-heading-03);\n line-height: var(--lh-mobile-heading-03);\n letter-spacing: var(--mobile-tracking-heading-03);\n }\n}\n\n.nu-c-h4 {\n font-weight: 700;\n font-size: var(--desktop-heading-04);\n line-height: var(--lh-desktop-heading-04);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-h4 {\n font-size: var(--mobile-heading-04);\n line-height: var(--lh-mobile-heading-04);\n }\n}\n\n.nu-c-h5 {\n font-weight: 700;\n font-size: var(--desktop-heading-05);\n line-height: var(--lh-desktop-heading-05);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-h5 {\n font-size: var(--mobile-heading-05);\n line-height: var(--lh-mobile-heading-05);\n }\n}\n\n.nu-c-h6 {\n font-weight: 500;\n font-size: var(--desktop-heading-06);\n line-height: var(--lh-desktop-heading-06);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-h6 {\n font-size: var(--mobile-heading-06);\n line-height: var(--lh-mobile-heading-06);\n }\n}\n\n.nu-c-fs-lead {\n font-size: var(--desktop-body-xl);\n line-height: var(--lh-desktop-body-xl);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-fs-lead {\n font-size: var(--mobile-body-xl);\n line-height: var(--lh-mobile-body-xl);\n }\n}\n\n.nu-c-fs-normal {\n font-size: var(--desktop-body);\n line-height: var(--lh-desktop-body);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-fs-normal {\n font-size: var(--mobile-body);\n line-height: var(--lh-mobile-body);\n }\n}\n\n.nu-c-fs-small {\n font-size: var(--desktop-body-sm);\n line-height: var(--lh-desktop-body-sm);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-fs-small {\n font-size: var(--mobile-body-sm);\n line-height: var(--lh-mobile-body-sm);\n }\n}\n\n.nu-c-caption {\n text-transform: uppercase;\n font-weight: 500;\n font-size: var(--desktop-caption);\n line-height: var(--lh-desktop-caption);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-caption {\n font-size: var(--mobile-caption);\n line-height: var(--lh-mobile-caption);\n }\n}\n\n.nu-c-helper-text {\n font-size: var(--desktop-helper-text);\n line-height: var(--lh-desktop-helper-text);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-helper-text {\n font-size: var(--mobile-helper-text);\n line-height: var(--lh-mobile-helper-text);\n }\n}\n\n.nu-c-code {\n font-size: var(--desktop-code);\n line-height: var(--desktop-code);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-code {\n font-size: var(--mobile-code);\n line-height: var(--mobile-code);\n }\n}\n/*# sourceMappingURL=index.css.map */\n",":root {\n /* System Font Stacks */\n --system-ui: system-ui, sans-serif;\n --old-style:\n 'Iowan Old Style', 'Palatino Linotype', 'URW Palladio L', p052, serif;\n --monospace-code:\n ui-monospace, 'Cascadia Code', 'Source Code Pro', menlo, consolas, monospace;\n --handwritten:\n 'Segoe Print', 'Bradley Hand', chilanka, tscu_comic, casual, cursive;\n}\n","/* Font Weights */\n.nu-u-fw-bold {\n font-weight: 700;\n}\n\n.nu-u-fw-semi-bold {\n font-weight: 500;\n}\n\n.nu-u-fw-normal {\n font-weight: 400;\n}\n\n/* Utilities */\n.nu-u-text--uppercase {\n text-transform: uppercase;\n}\n\n.nu-u-text--lowercase {\n text-transform: lowercase;\n}\n\n.nu-u-text--capitalize {\n text-transform: capitalize;\n}\n\n.nu-u-text--underline {\n text-decoration: underline;\n}\n\n.nu-u-text--left {\n text-align: left;\n}\n\n.nu-u-text--right {\n text-align: right;\n}\n\n.nu-u-text--center {\n text-align: center;\n}\n\n.nu-u-text--justify {\n text-align: justify;\n}\n\n/* Font family */\n.nu-u-serif {\n font-family:\n Didot, 'Bodoni MT', 'Noto Serif Display', 'URW Palladio L', 'P052', Sylfaen,\n serif;\n}\n\n.nu-u-sans-serif {\n font-family:\n Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Nimbus Sans', Arial,\n sans-serif;\n}\n\n.nu-u-code {\n font-family:\n ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas,\n 'DejaVu Sans Mono', monospace;\n}\n","$mobile-breakpoint: 37.5rem;\n\n/* Components */\n.nu-c-h1 {\n font-weight: 700;\n font-size: var(--desktop-heading-01);\n line-height: var(--lh-desktop-heading-01);\n letter-spacing: var(--desktop-tracking-heading-01);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-heading-01);\n line-height: var(--lh-mobile-heading-01);\n letter-spacing: var(--mobile-tracking-heading-01);\n }\n}\n\n.nu-c-h2 {\n font-weight: 700;\n font-size: var(--desktop-heading-02);\n line-height: var(--lh-desktop-heading-02);\n letter-spacing: var(--desktop-tracking-heading-02);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-heading-02);\n line-height: var(--lh-mobile-heading-02);\n letter-spacing: var(--mobile-tracking-heading-02);\n }\n}\n\n.nu-c-h3 {\n font-weight: 700;\n font-size: var(--desktop-heading-03);\n line-height: var(--lh-desktop-heading-03);\n letter-spacing: var(--desktop-tracking-heading-03);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-heading-03);\n line-height: var(--lh-mobile-heading-03);\n letter-spacing: var(--mobile-tracking-heading-03);\n }\n}\n\n.nu-c-h4 {\n font-weight: 700;\n font-size: var(--desktop-heading-04);\n line-height: var(--lh-desktop-heading-04);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-heading-04);\n line-height: var(--lh-mobile-heading-04);\n }\n}\n\n.nu-c-h5 {\n font-weight: 700;\n font-size: var(--desktop-heading-05);\n line-height: var(--lh-desktop-heading-05);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-heading-05);\n line-height: var(--lh-mobile-heading-05);\n }\n}\n\n.nu-c-h6 {\n font-weight: 500;\n font-size: var(--desktop-heading-06);\n line-height: var(--lh-desktop-heading-06);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-heading-06);\n line-height: var(--lh-mobile-heading-06);\n }\n}\n\n.nu-c-fs-lead {\n font-size: var(--desktop-body-xl);\n line-height: var(--lh-desktop-body-xl);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-body-xl);\n line-height: var(--lh-mobile-body-xl);\n }\n}\n\n.nu-c-fs-normal {\n font-size: var(--desktop-body);\n line-height: var(--lh-desktop-body);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-body);\n line-height: var(--lh-mobile-body);\n }\n}\n\n.nu-c-fs-small {\n font-size: var(--desktop-body-sm);\n line-height: var(--lh-desktop-body-sm);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-body-sm);\n line-height: var(--lh-mobile-body-sm);\n }\n}\n\n.nu-c-caption {\n font-weight: 500;\n text-transform: uppercase;\n font-size: var(--desktop-caption);\n line-height: var(--lh-desktop-caption);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-caption);\n line-height: var(--lh-mobile-caption);\n }\n}\n\n.nu-c-helper-text {\n font-size: var(--desktop-helper-text);\n line-height: var(--lh-desktop-helper-text);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-helper-text);\n line-height: var(--lh-mobile-helper-text);\n }\n}\n\n.nu-c-code {\n font-size: var(--desktop-code);\n line-height: var(--desktop-code);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-code);\n line-height: var(--mobile-code);\n }\n}\n"],"names":[],"version":3,"file":"index.css.map"}
1
+ {"mappings":"ACAA,8zDCCA,8BAIA,mCAIA,gCAKA,+CAIA,+CAIA,iDAIA,gDAIA,iCAIA,mCAIA,qCAIA,uCAKA,6FAMA,iGAMA,6CCxDA,wJAME,mCANF,sIAaA,wJAME,mCANF,sIAaA,wJAME,mCANF,sIAaA,sGAKE,mCALF,qFAWA,sGAKE,mCALF,qFAWA,sGAKE,mCALF,qFAWA,qFAIE,mCAJF,oFAUA,iFAIE,mCAJF,gFAUA,sFAIE,mCAJF,qFAUA,8HAME,mCANF,oFAYA,iGAIE,mCAJF,gGAUA,2GAKE,mCALF","sources":["index.css","src/_fonts.scss","src/_utilities.scss","src/_components.scss"],"sourcesContent":[":root {\n --system-ui: system-ui, sans-serif;\n --old-style: \"Iowan Old Style\", \"Palatino Linotype\", \"URW Palladio L\", p052, serif;\n --monospace-code: ui-monospace, \"Cascadia Code\", \"Source Code Pro\", menlo, consolas, monospace;\n --handwritten: \"Segoe Print\", \"Bradley Hand\", chilanka, tscu_comic, casual, cursive;\n --mobile-heading-01: 2rem;\n --mobile-heading-02: 1.75rem;\n --mobile-heading-03: 1.5rem;\n --mobile-heading-04: 1.25rem;\n --mobile-heading-05: 1.125rem;\n --mobile-heading-06: 1rem;\n --mobile-body-xl: 1rem;\n --mobile-body: .875rem;\n --mobile-body-sm: .75rem;\n --mobile-caption: .75rem;\n --mobile-helper-text: .75rem;\n --mobile-code: .875rem;\n --lh-mobile-heading-01: 2.5rem;\n --lh-mobile-heading-02: 2.25rem;\n --lh-mobile-heading-03: 1.875rem;\n --lh-mobile-heading-04: 1.75rem;\n --lh-mobile-heading-05: 1.625rem;\n --lh-mobile-heading-06: 1.5rem;\n --lh-mobile-body-xl: 1.5rem;\n --lh-mobile-body: 1.25rem;\n --lh-mobile-body-sm: 1rem;\n --lh-mobile-caption: 1rem;\n --lh-mobile-helper-text: 1rem;\n --lh-mobile-code: 1.25rem;\n --mobile-tracking-heading-01: -.05rem;\n --mobile-tracking-heading-02: -.025rem;\n --mobile-tracking-heading-03: -.025rem;\n --desktop-heading-01: 3.375rem;\n --desktop-heading-02: 2.625rem;\n --desktop-heading-03: 2rem;\n --desktop-heading-04: 1.75rem;\n --desktop-heading-05: 1.25rem;\n --desktop-heading-06: 1.125rem;\n --desktop-body-xl: 1.125rem;\n --desktop-body: 1rem;\n --desktop-body-sm: .875rem;\n --desktop-caption: .75rem;\n --desktop-helper-text: .75rem;\n --desktop-code: .875rem;\n --lh-desktop-heading-01: 4rem;\n --lh-desktop-heading-02: 3.125rem;\n --lh-desktop-heading-03: 2.5rem;\n --lh-desktop-heading-04: 2.25rem;\n --lh-desktop-heading-05: 1.75rem;\n --lh-desktop-heading-06: 1.625rem;\n --lh-desktop-body-xl: 1.625rem;\n --lh-desktop-body: 1.5rem;\n --lh-desktop-body-sm: 1.25rem;\n --lh-desktop-caption: 1rem;\n --lh-desktop-helper-text: 1rem;\n --lh-desktop-code: 1.25rem;\n --desktop-tracking-heading-01: -.075rem;\n --desktop-tracking-heading-02: -.05rem;\n --desktop-tracking-heading-03: -.025rem;\n}\n\n.nu-u-fw-bold {\n font-weight: 700;\n}\n\n.nu-u-fw-semi-bold {\n font-weight: 500;\n}\n\n.nu-u-fw-normal {\n font-weight: 400;\n}\n\n.nu-u-text--uppercase {\n text-transform: uppercase;\n}\n\n.nu-u-text--lowercase {\n text-transform: lowercase;\n}\n\n.nu-u-text--capitalize {\n text-transform: capitalize;\n}\n\n.nu-u-text--underline {\n text-decoration: underline;\n}\n\n.nu-u-text--left {\n text-align: left;\n}\n\n.nu-u-text--right {\n text-align: right;\n}\n\n.nu-u-text--center {\n text-align: center;\n}\n\n.nu-u-text--justify {\n text-align: justify;\n}\n\n.nu-u-serif {\n font-family: Didot, Bodoni MT, Noto Serif Display, URW Palladio L, P052, Sylfaen, serif;\n}\n\n.nu-u-sans-serif {\n font-family: Inter, Roboto, Helvetica Neue, Arial Nova, Nimbus Sans, Arial, sans-serif;\n}\n\n.nu-u-code {\n font-family: var(--monospace-code);\n}\n\n.nu-c-h1 {\n font-weight: 700;\n font-size: var(--desktop-heading-01);\n line-height: var(--lh-desktop-heading-01);\n letter-spacing: var(--desktop-tracking-heading-01);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-h1 {\n font-size: var(--mobile-heading-01);\n line-height: var(--lh-mobile-heading-01);\n letter-spacing: var(--mobile-tracking-heading-01);\n }\n}\n\n.nu-c-h2 {\n font-weight: 700;\n font-size: var(--desktop-heading-02);\n line-height: var(--lh-desktop-heading-02);\n letter-spacing: var(--desktop-tracking-heading-02);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-h2 {\n font-size: var(--mobile-heading-02);\n line-height: var(--lh-mobile-heading-02);\n letter-spacing: var(--mobile-tracking-heading-02);\n }\n}\n\n.nu-c-h3 {\n font-weight: 700;\n font-size: var(--desktop-heading-03);\n line-height: var(--lh-desktop-heading-03);\n letter-spacing: var(--desktop-tracking-heading-03);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-h3 {\n font-size: var(--mobile-heading-03);\n line-height: var(--lh-mobile-heading-03);\n letter-spacing: var(--mobile-tracking-heading-03);\n }\n}\n\n.nu-c-h4 {\n font-weight: 700;\n font-size: var(--desktop-heading-04);\n line-height: var(--lh-desktop-heading-04);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-h4 {\n font-size: var(--mobile-heading-04);\n line-height: var(--lh-mobile-heading-04);\n }\n}\n\n.nu-c-h5 {\n font-weight: 700;\n font-size: var(--desktop-heading-05);\n line-height: var(--lh-desktop-heading-05);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-h5 {\n font-size: var(--mobile-heading-05);\n line-height: var(--lh-mobile-heading-05);\n }\n}\n\n.nu-c-h6 {\n font-weight: 500;\n font-size: var(--desktop-heading-06);\n line-height: var(--lh-desktop-heading-06);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-h6 {\n font-size: var(--mobile-heading-06);\n line-height: var(--lh-mobile-heading-06);\n }\n}\n\n.nu-c-fs-lead {\n font-size: var(--desktop-body-xl);\n line-height: var(--lh-desktop-body-xl);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-fs-lead {\n font-size: var(--mobile-body-xl);\n line-height: var(--lh-mobile-body-xl);\n }\n}\n\n.nu-c-fs-normal {\n font-size: var(--desktop-body);\n line-height: var(--lh-desktop-body);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-fs-normal {\n font-size: var(--mobile-body);\n line-height: var(--lh-mobile-body);\n }\n}\n\n.nu-c-fs-small {\n font-size: var(--desktop-body-sm);\n line-height: var(--lh-desktop-body-sm);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-fs-small {\n font-size: var(--mobile-body-sm);\n line-height: var(--lh-mobile-body-sm);\n }\n}\n\n.nu-c-caption {\n text-transform: uppercase;\n font-weight: 500;\n font-size: var(--desktop-caption);\n line-height: var(--lh-desktop-caption);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-caption {\n font-size: var(--mobile-caption);\n line-height: var(--lh-mobile-caption);\n }\n}\n\n.nu-c-helper-text {\n font-size: var(--desktop-helper-text);\n line-height: var(--lh-desktop-helper-text);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-helper-text {\n font-size: var(--mobile-helper-text);\n line-height: var(--lh-mobile-helper-text);\n }\n}\n\n.nu-c-code {\n font-family: var(--monospace-code);\n font-size: var(--desktop-code);\n line-height: var(--desktop-code);\n}\n\n@media screen and (width <= 37.5rem) {\n .nu-c-code {\n font-size: var(--mobile-code);\n line-height: var(--mobile-code);\n }\n}\n/*# sourceMappingURL=index.css.map */\n",":root {\n /* System Font Stacks */\n --system-ui: system-ui, sans-serif;\n --old-style:\n 'Iowan Old Style', 'Palatino Linotype', 'URW Palladio L', p052, serif;\n --monospace-code:\n ui-monospace, 'Cascadia Code', 'Source Code Pro', menlo, consolas, monospace;\n --handwritten:\n 'Segoe Print', 'Bradley Hand', chilanka, tscu_comic, casual, cursive;\n}\n","/* Font Weights */\n.nu-u-fw-bold {\n font-weight: 700;\n}\n\n.nu-u-fw-semi-bold {\n font-weight: 500;\n}\n\n.nu-u-fw-normal {\n font-weight: 400;\n}\n\n/* Utilities */\n.nu-u-text--uppercase {\n text-transform: uppercase;\n}\n\n.nu-u-text--lowercase {\n text-transform: lowercase;\n}\n\n.nu-u-text--capitalize {\n text-transform: capitalize;\n}\n\n.nu-u-text--underline {\n text-decoration: underline;\n}\n\n.nu-u-text--left {\n text-align: left;\n}\n\n.nu-u-text--right {\n text-align: right;\n}\n\n.nu-u-text--center {\n text-align: center;\n}\n\n.nu-u-text--justify {\n text-align: justify;\n}\n\n/* Font family */\n.nu-u-serif {\n font-family:\n Didot, 'Bodoni MT', 'Noto Serif Display', 'URW Palladio L', 'P052', Sylfaen,\n serif;\n}\n\n.nu-u-sans-serif {\n font-family:\n Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Nimbus Sans', Arial,\n sans-serif;\n}\n\n.nu-u-code {\n font-family: var(--monospace-code);\n}\n","$mobile-breakpoint: 37.5rem;\n\n/* Components */\n.nu-c-h1 {\n font-weight: 700;\n font-size: var(--desktop-heading-01);\n line-height: var(--lh-desktop-heading-01);\n letter-spacing: var(--desktop-tracking-heading-01);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-heading-01);\n line-height: var(--lh-mobile-heading-01);\n letter-spacing: var(--mobile-tracking-heading-01);\n }\n}\n\n.nu-c-h2 {\n font-weight: 700;\n font-size: var(--desktop-heading-02);\n line-height: var(--lh-desktop-heading-02);\n letter-spacing: var(--desktop-tracking-heading-02);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-heading-02);\n line-height: var(--lh-mobile-heading-02);\n letter-spacing: var(--mobile-tracking-heading-02);\n }\n}\n\n.nu-c-h3 {\n font-weight: 700;\n font-size: var(--desktop-heading-03);\n line-height: var(--lh-desktop-heading-03);\n letter-spacing: var(--desktop-tracking-heading-03);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-heading-03);\n line-height: var(--lh-mobile-heading-03);\n letter-spacing: var(--mobile-tracking-heading-03);\n }\n}\n\n.nu-c-h4 {\n font-weight: 700;\n font-size: var(--desktop-heading-04);\n line-height: var(--lh-desktop-heading-04);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-heading-04);\n line-height: var(--lh-mobile-heading-04);\n }\n}\n\n.nu-c-h5 {\n font-weight: 700;\n font-size: var(--desktop-heading-05);\n line-height: var(--lh-desktop-heading-05);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-heading-05);\n line-height: var(--lh-mobile-heading-05);\n }\n}\n\n.nu-c-h6 {\n font-weight: 500;\n font-size: var(--desktop-heading-06);\n line-height: var(--lh-desktop-heading-06);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-heading-06);\n line-height: var(--lh-mobile-heading-06);\n }\n}\n\n.nu-c-fs-lead {\n font-size: var(--desktop-body-xl);\n line-height: var(--lh-desktop-body-xl);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-body-xl);\n line-height: var(--lh-mobile-body-xl);\n }\n}\n\n.nu-c-fs-normal {\n font-size: var(--desktop-body);\n line-height: var(--lh-desktop-body);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-body);\n line-height: var(--lh-mobile-body);\n }\n}\n\n.nu-c-fs-small {\n font-size: var(--desktop-body-sm);\n line-height: var(--lh-desktop-body-sm);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-body-sm);\n line-height: var(--lh-mobile-body-sm);\n }\n}\n\n.nu-c-caption {\n font-weight: 500;\n text-transform: uppercase;\n font-size: var(--desktop-caption);\n line-height: var(--lh-desktop-caption);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-caption);\n line-height: var(--lh-mobile-caption);\n }\n}\n\n.nu-c-helper-text {\n font-size: var(--desktop-helper-text);\n line-height: var(--lh-desktop-helper-text);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-helper-text);\n line-height: var(--lh-mobile-helper-text);\n }\n}\n\n.nu-c-code {\n font-family: var(--monospace-code);\n font-size: var(--desktop-code);\n line-height: var(--desktop-code);\n\n @media screen and (max-width: $mobile-breakpoint) {\n font-size: var(--mobile-code);\n line-height: var(--mobile-code);\n }\n}\n"],"names":[],"version":3,"file":"index.css.map"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@new-ui/typography",
3
- "version": "0.2.0",
3
+ "version": "0.2.1",
4
4
  "description": "Modular typographic scale for your apps and websites.",
5
5
  "source": "src/index.scss",
6
6
  "main": "dist/index.css",
@@ -14,12 +14,12 @@
14
14
  "LICENSE"
15
15
  ],
16
16
  "scripts": {
17
- "watch": "parcel watch",
18
- "build": "parcel build"
17
+ "watch": "PARCEL_WORKERS=0 parcel watch",
18
+ "build": "PARCEL_WORKERS=0 parcel build"
19
19
  },
20
20
  "repository": {
21
21
  "type": "git",
22
- "url": "git+https://github.com/create-new-ui/foundations.git"
22
+ "url": "git+https://github.com/CreateNewUI/foundations.git"
23
23
  },
24
24
  "keywords": [
25
25
  "typography",
@@ -27,7 +27,6 @@
27
27
  "type",
28
28
  "type-styles",
29
29
  "modular",
30
- "type",
31
30
  "tokens",
32
31
  "desktop",
33
32
  "mobile"
@@ -35,14 +34,11 @@
35
34
  "author": "@planetabhi",
36
35
  "license": "MIT",
37
36
  "bugs": {
38
- "url": "https://github.com/create-new-ui/foundations/issues"
37
+ "url": "https://github.com/CreateNewUI/foundations/issues"
39
38
  },
40
- "homepage": "https://github.com/create-new-ui/foundations#readme",
39
+ "homepage": "https://github.com/CreateNewUI/foundations#readme",
41
40
  "devDependencies": {
42
- "@parcel/transformer-sass": "^2.16.3",
43
- "autoprefixer": "^10.4.23",
44
- "parcel": "^2.16.3",
45
- "postcss": "^8.5.6",
46
- "postcss-scss": "^4.0.9"
41
+ "@parcel/transformer-sass": "^2.16.4",
42
+ "parcel": "^2.16.4"
47
43
  }
48
44
  }
@@ -126,6 +126,7 @@ $mobile-breakpoint: 37.5rem;
126
126
  }
127
127
 
128
128
  .nu-c-code {
129
+ font-family: var(--monospace-code);
129
130
  font-size: var(--desktop-code);
130
131
  line-height: var(--desktop-code);
131
132
 
@@ -58,7 +58,5 @@
58
58
  }
59
59
 
60
60
  .nu-u-code {
61
- font-family:
62
- ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas,
63
- 'DejaVu Sans Mono', monospace;
61
+ font-family: var(--monospace-code);
64
62
  }