holygrail5 1.0.20 → 1.0.21
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/config.json +42 -0
- package/dist/index.html +41 -4
- package/dist/output.css +85 -30
- package/dist/themes/dutti-demo.html +33 -0
- package/dist/themes/limited-demo.html +33 -0
- package/package.json +1 -1
- package/src/.data/.previous-values.json +43 -0
- package/src/generators/typo-generator.js +2 -1
package/config.json
CHANGED
|
@@ -876,6 +876,48 @@
|
|
|
876
876
|
"fontSize": "12px",
|
|
877
877
|
"lineHeight": "1"
|
|
878
878
|
}
|
|
879
|
+
},
|
|
880
|
+
"label-m-b": {
|
|
881
|
+
"fontFamily": "\"suisse-regular\", Arial, Helvetica, sans-serif",
|
|
882
|
+
"fontWeight": "300",
|
|
883
|
+
"letterSpacing": "0.16em",
|
|
884
|
+
"textTransform": "uppercase",
|
|
885
|
+
"mobile": {
|
|
886
|
+
"fontSize": "12px",
|
|
887
|
+
"lineHeight": "1"
|
|
888
|
+
},
|
|
889
|
+
"desktop": {
|
|
890
|
+
"fontSize": "12px",
|
|
891
|
+
"lineHeight": "1"
|
|
892
|
+
}
|
|
893
|
+
},
|
|
894
|
+
"label-s": {
|
|
895
|
+
"fontFamily": "\"suisse-light\", Arial, Helvetica, sans-serif",
|
|
896
|
+
"fontWeight": "100",
|
|
897
|
+
"letterSpacing": "0.06em",
|
|
898
|
+
"textTransform": "uppercase",
|
|
899
|
+
"mobile": {
|
|
900
|
+
"fontSize": "10px",
|
|
901
|
+
"lineHeight": "1"
|
|
902
|
+
},
|
|
903
|
+
"desktop": {
|
|
904
|
+
"fontSize": "10px",
|
|
905
|
+
"lineHeight": "1"
|
|
906
|
+
}
|
|
907
|
+
},
|
|
908
|
+
"label-s-b": {
|
|
909
|
+
"fontFamily": "\"suisse-regular\", Arial, Helvetica, sans-serif",
|
|
910
|
+
"fontWeight": "300",
|
|
911
|
+
"letterSpacing": "0.06em",
|
|
912
|
+
"textTransform": "uppercase",
|
|
913
|
+
"mobile": {
|
|
914
|
+
"fontSize": "10px",
|
|
915
|
+
"lineHeight": "1"
|
|
916
|
+
},
|
|
917
|
+
"desktop": {
|
|
918
|
+
"fontSize": "10px",
|
|
919
|
+
"lineHeight": "1"
|
|
920
|
+
}
|
|
879
921
|
}
|
|
880
922
|
}
|
|
881
923
|
}
|
package/dist/index.html
CHANGED
|
@@ -15,8 +15,8 @@
|
|
|
15
15
|
|
|
16
16
|
<!-- Lenis Smooth Scroll - Solo para la guía -->
|
|
17
17
|
<script src="https://cdn.jsdelivr.net/gh/studio-freight/lenis@1.0.29/bundled/lenis.min.js"></script>
|
|
18
|
-
<link rel="stylesheet" href="output.css
|
|
19
|
-
<link rel="stylesheet" href="guide-styles.css?v=
|
|
18
|
+
<link rel="stylesheet" href="output.css">
|
|
19
|
+
<link rel="stylesheet" href="guide-styles.css?v=1777031033580">
|
|
20
20
|
<style>
|
|
21
21
|
|
|
22
22
|
body {
|
|
@@ -74,7 +74,7 @@
|
|
|
74
74
|
</a>
|
|
75
75
|
</div>
|
|
76
76
|
<p class="text-m guide-sidebar-meta">
|
|
77
|
-
last update: 24/4/2026,
|
|
77
|
+
last update: 24/4/2026, 13:43:53
|
|
78
78
|
</p>
|
|
79
79
|
|
|
80
80
|
|
|
@@ -682,6 +682,39 @@
|
|
|
682
682
|
<td><span class="hg-typo-num">1</span></td>
|
|
683
683
|
<td>0.16em</td>
|
|
684
684
|
<td>uppercase</td>
|
|
685
|
+
</tr>
|
|
686
|
+
<tr>
|
|
687
|
+
<td class="hg-typo-preview"><span class="label-m-b">Aa Bb Cc 123</span></td>
|
|
688
|
+
<td><code>.label-m-b</code></td>
|
|
689
|
+
<td><code>primary-regular</code> <span class="hg-typo-meta">"suisse-regular", Arial, Helvetica, sans-serif</span></td>
|
|
690
|
+
<td>300</td>
|
|
691
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
692
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
693
|
+
<td><span class="hg-typo-num">1</span></td>
|
|
694
|
+
<td>0.16em</td>
|
|
695
|
+
<td>uppercase</td>
|
|
696
|
+
</tr>
|
|
697
|
+
<tr>
|
|
698
|
+
<td class="hg-typo-preview"><span class="label-s">Aa Bb Cc 123</span></td>
|
|
699
|
+
<td><code>.label-s</code></td>
|
|
700
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-light", Arial, Helvetica, sans-serif</span></td>
|
|
701
|
+
<td>100</td>
|
|
702
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
703
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
704
|
+
<td><span class="hg-typo-num">1</span></td>
|
|
705
|
+
<td>0.06em</td>
|
|
706
|
+
<td>uppercase</td>
|
|
707
|
+
</tr>
|
|
708
|
+
<tr>
|
|
709
|
+
<td class="hg-typo-preview"><span class="label-s-b">Aa Bb Cc 123</span></td>
|
|
710
|
+
<td><code>.label-s-b</code></td>
|
|
711
|
+
<td><code>primary-regular</code> <span class="hg-typo-meta">"suisse-regular", Arial, Helvetica, sans-serif</span></td>
|
|
712
|
+
<td>300</td>
|
|
713
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
714
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
715
|
+
<td><span class="hg-typo-num">1</span></td>
|
|
716
|
+
<td>0.06em</td>
|
|
717
|
+
<td>uppercase</td>
|
|
685
718
|
</tr>
|
|
686
719
|
</tbody>
|
|
687
720
|
</table>
|
|
@@ -819,7 +852,7 @@
|
|
|
819
852
|
</div>
|
|
820
853
|
</div>
|
|
821
854
|
<div class="guide-variables-group">
|
|
822
|
-
<h4 class="guide-variables-group-title">Letter spacing <span class="guide-variables-group-count">(
|
|
855
|
+
<h4 class="guide-variables-group-title">Letter spacing <span class="guide-variables-group-count">(10)</span></h4>
|
|
823
856
|
<div class="guide-variables-group-list">
|
|
824
857
|
|
|
825
858
|
<div class="guide-variable-item">
|
|
@@ -858,6 +891,10 @@
|
|
|
858
891
|
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-letter-spacing-0-04em" title="Click para copiar --hg-typo-letter-spacing-0-04em">--hg-typo-letter-spacing-0-04em</span>
|
|
859
892
|
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="0.04em" title="Click para copiar 0.04em">0.04em</span></span>
|
|
860
893
|
</div>
|
|
894
|
+
<div class="guide-variable-item">
|
|
895
|
+
<span class="guide-variable-name guide-copyable guide-changed" data-copy-value="--hg-typo-letter-spacing-0-06em" title="Click para copiar --hg-typo-letter-spacing-0-06em">--hg-typo-letter-spacing-0-06em</span>
|
|
896
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable guide-changed" data-copy-value="0.06em" title="Click para copiar 0.06em">0.06em</span></span>
|
|
897
|
+
</div>
|
|
861
898
|
</div>
|
|
862
899
|
</div>
|
|
863
900
|
<div class="guide-variables-group">
|
package/dist/output.css
CHANGED
|
@@ -84,6 +84,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
84
84
|
--hg-typo-letter-spacing-110: 110rem;
|
|
85
85
|
--hg-typo-letter-spacing-0-16em: 0.16em;
|
|
86
86
|
--hg-typo-letter-spacing-0-04em: 0.04em;
|
|
87
|
+
--hg-typo-letter-spacing-0-06em: 0.06em;
|
|
87
88
|
--hg-typo-text-transform-none: none;
|
|
88
89
|
--hg-typo-text-transform-uppercase: uppercase;
|
|
89
90
|
--hg-typo-text-transform-otro: otro;
|
|
@@ -2213,14 +2214,14 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2213
2214
|
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2214
2215
|
font-weight: var(--hg-typo-font-weight-300);
|
|
2215
2216
|
font-size: var(--hg-typo-font-size-24);
|
|
2216
|
-
line-height: var(--hg-typo-line-height-1);
|
|
2217
|
+
line-height: var(--hg-typo-line-height-1) !important;
|
|
2217
2218
|
}
|
|
2218
2219
|
|
|
2219
2220
|
.h2 {
|
|
2220
2221
|
font-family: var(--hg-typo-font-family-primary-bold);
|
|
2221
2222
|
font-weight: var(--hg-typo-font-weight-600);
|
|
2222
2223
|
font-size: var(--hg-typo-font-size-18);
|
|
2223
|
-
line-height: var(--hg-typo-line-height-1-2);
|
|
2224
|
+
line-height: var(--hg-typo-line-height-1-2) !important;
|
|
2224
2225
|
letter-spacing: var(--hg-typo-letter-spacing-0);
|
|
2225
2226
|
text-transform: var(--hg-typo-text-transform-none);
|
|
2226
2227
|
}
|
|
@@ -2229,14 +2230,14 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2229
2230
|
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2230
2231
|
font-weight: var(--hg-typo-font-weight-300);
|
|
2231
2232
|
font-size: var(--hg-typo-font-size-12);
|
|
2232
|
-
line-height: var(--hg-typo-line-height-1-4);
|
|
2233
|
+
line-height: var(--hg-typo-line-height-1-4) !important;
|
|
2233
2234
|
}
|
|
2234
2235
|
|
|
2235
2236
|
.title-l {
|
|
2236
2237
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2237
2238
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2238
2239
|
font-size: var(--hg-typo-font-size-12);
|
|
2239
|
-
line-height: var(--hg-typo-line-height-1-4);
|
|
2240
|
+
line-height: var(--hg-typo-line-height-1-4) !important;
|
|
2240
2241
|
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2241
2242
|
text-transform: var(--hg-typo-text-transform-uppercase);
|
|
2242
2243
|
}
|
|
@@ -2245,7 +2246,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2245
2246
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2246
2247
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2247
2248
|
font-size: var(--hg-typo-font-size-12);
|
|
2248
|
-
line-height: var(--hg-typo-line-height-1-4);
|
|
2249
|
+
line-height: var(--hg-typo-line-height-1-4) !important;
|
|
2249
2250
|
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2250
2251
|
}
|
|
2251
2252
|
|
|
@@ -2253,7 +2254,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2253
2254
|
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2254
2255
|
font-weight: var(--hg-typo-font-weight-300);
|
|
2255
2256
|
font-size: var(--hg-typo-font-size-10);
|
|
2256
|
-
line-height: var(--hg-typo-line-height-1-4);
|
|
2257
|
+
line-height: var(--hg-typo-line-height-1-4) !important;
|
|
2257
2258
|
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2258
2259
|
}
|
|
2259
2260
|
|
|
@@ -2261,7 +2262,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2261
2262
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2262
2263
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2263
2264
|
font-size: var(--hg-typo-font-size-10);
|
|
2264
|
-
line-height: var(--hg-typo-line-height-1-4);
|
|
2265
|
+
line-height: var(--hg-typo-line-height-1-4) !important;
|
|
2265
2266
|
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2266
2267
|
text-transform: var(--hg-typo-text-transform-uppercase);
|
|
2267
2268
|
}
|
|
@@ -2270,7 +2271,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2270
2271
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2271
2272
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2272
2273
|
font-size: var(--hg-typo-font-size-13);
|
|
2273
|
-
line-height: var(--hg-typo-line-height-1-5);
|
|
2274
|
+
line-height: var(--hg-typo-line-height-1-5) !important;
|
|
2274
2275
|
letter-spacing: var(--hg-typo-letter-spacing-0-04em);
|
|
2275
2276
|
}
|
|
2276
2277
|
|
|
@@ -2278,7 +2279,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2278
2279
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2279
2280
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2280
2281
|
font-size: var(--hg-typo-font-size-12);
|
|
2281
|
-
line-height: var(--hg-typo-line-height-1-5);
|
|
2282
|
+
line-height: var(--hg-typo-line-height-1-5) !important;
|
|
2282
2283
|
letter-spacing: var(--hg-typo-letter-spacing-0-04em);
|
|
2283
2284
|
}
|
|
2284
2285
|
|
|
@@ -2286,7 +2287,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2286
2287
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2287
2288
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2288
2289
|
font-size: var(--hg-typo-font-size-9);
|
|
2289
|
-
line-height: var(--hg-typo-line-height-1);
|
|
2290
|
+
line-height: var(--hg-typo-line-height-1) !important;
|
|
2290
2291
|
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2291
2292
|
}
|
|
2292
2293
|
|
|
@@ -2294,7 +2295,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2294
2295
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2295
2296
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2296
2297
|
font-size: var(--hg-typo-font-size-12);
|
|
2297
|
-
line-height: var(--hg-typo-line-height-1-5);
|
|
2298
|
+
line-height: var(--hg-typo-line-height-1-5) !important;
|
|
2298
2299
|
letter-spacing: var(--hg-typo-letter-spacing-0-04em);
|
|
2299
2300
|
}
|
|
2300
2301
|
|
|
@@ -2302,7 +2303,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2302
2303
|
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2303
2304
|
font-weight: var(--hg-typo-font-weight-300);
|
|
2304
2305
|
font-size: var(--hg-typo-font-size-12);
|
|
2305
|
-
line-height: var(--hg-typo-line-height-1-5);
|
|
2306
|
+
line-height: var(--hg-typo-line-height-1-5) !important;
|
|
2306
2307
|
letter-spacing: var(--hg-typo-letter-spacing-0-04em);
|
|
2307
2308
|
}
|
|
2308
2309
|
|
|
@@ -2310,7 +2311,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2310
2311
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2311
2312
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2312
2313
|
font-size: var(--hg-typo-font-size-12);
|
|
2313
|
-
line-height: var(--hg-typo-line-height-1-5);
|
|
2314
|
+
line-height: var(--hg-typo-line-height-1-5) !important;
|
|
2314
2315
|
letter-spacing: var(--hg-typo-letter-spacing-0-04em);
|
|
2315
2316
|
}
|
|
2316
2317
|
|
|
@@ -2318,7 +2319,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2318
2319
|
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2319
2320
|
font-weight: var(--hg-typo-font-weight-300);
|
|
2320
2321
|
font-size: var(--hg-typo-font-size-12);
|
|
2321
|
-
line-height: var(--hg-typo-line-height-1-5);
|
|
2322
|
+
line-height: var(--hg-typo-line-height-1-5) !important;
|
|
2322
2323
|
letter-spacing: var(--hg-typo-letter-spacing-0-04em);
|
|
2323
2324
|
}
|
|
2324
2325
|
|
|
@@ -2326,11 +2327,38 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2326
2327
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2327
2328
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2328
2329
|
font-size: var(--hg-typo-font-size-12);
|
|
2329
|
-
line-height: var(--hg-typo-line-height-1);
|
|
2330
|
+
line-height: var(--hg-typo-line-height-1) !important;
|
|
2330
2331
|
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2331
2332
|
text-transform: var(--hg-typo-text-transform-uppercase);
|
|
2332
2333
|
}
|
|
2333
2334
|
|
|
2335
|
+
.label-m-b {
|
|
2336
|
+
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2337
|
+
font-weight: var(--hg-typo-font-weight-300);
|
|
2338
|
+
font-size: var(--hg-typo-font-size-12);
|
|
2339
|
+
line-height: var(--hg-typo-line-height-1) !important;
|
|
2340
|
+
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2341
|
+
text-transform: var(--hg-typo-text-transform-uppercase);
|
|
2342
|
+
}
|
|
2343
|
+
|
|
2344
|
+
.label-s {
|
|
2345
|
+
font-family: var(--hg-typo-font-family-primary-light);
|
|
2346
|
+
font-weight: var(--hg-typo-font-weight-100);
|
|
2347
|
+
font-size: var(--hg-typo-font-size-10);
|
|
2348
|
+
line-height: var(--hg-typo-line-height-1) !important;
|
|
2349
|
+
letter-spacing: var(--hg-typo-letter-spacing-0-06em);
|
|
2350
|
+
text-transform: var(--hg-typo-text-transform-uppercase);
|
|
2351
|
+
}
|
|
2352
|
+
|
|
2353
|
+
.label-s-b {
|
|
2354
|
+
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2355
|
+
font-weight: var(--hg-typo-font-weight-300);
|
|
2356
|
+
font-size: var(--hg-typo-font-size-10);
|
|
2357
|
+
line-height: var(--hg-typo-line-height-1) !important;
|
|
2358
|
+
letter-spacing: var(--hg-typo-letter-spacing-0-06em);
|
|
2359
|
+
text-transform: var(--hg-typo-text-transform-uppercase);
|
|
2360
|
+
}
|
|
2361
|
+
|
|
2334
2362
|
}
|
|
2335
2363
|
|
|
2336
2364
|
/* Tipografías - Desktop (min-width: 62rem) */
|
|
@@ -2340,14 +2368,14 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2340
2368
|
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2341
2369
|
font-weight: var(--hg-typo-font-weight-300);
|
|
2342
2370
|
font-size: var(--hg-typo-font-size-24);
|
|
2343
|
-
line-height: var(--hg-typo-line-height-1);
|
|
2371
|
+
line-height: var(--hg-typo-line-height-1) !important;
|
|
2344
2372
|
}
|
|
2345
2373
|
|
|
2346
2374
|
.h2 {
|
|
2347
2375
|
font-family: var(--hg-typo-font-family-primary-bold);
|
|
2348
2376
|
font-weight: var(--hg-typo-font-weight-600);
|
|
2349
2377
|
font-size: var(--hg-typo-font-size-24);
|
|
2350
|
-
line-height: var(--hg-typo-line-height-1-2);
|
|
2378
|
+
line-height: var(--hg-typo-line-height-1-2) !important;
|
|
2351
2379
|
letter-spacing: var(--hg-typo-letter-spacing-0);
|
|
2352
2380
|
text-transform: var(--hg-typo-text-transform-none);
|
|
2353
2381
|
}
|
|
@@ -2356,14 +2384,14 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2356
2384
|
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2357
2385
|
font-weight: var(--hg-typo-font-weight-300);
|
|
2358
2386
|
font-size: var(--hg-typo-font-size-13);
|
|
2359
|
-
line-height: var(--hg-typo-line-height-1-4);
|
|
2387
|
+
line-height: var(--hg-typo-line-height-1-4) !important;
|
|
2360
2388
|
}
|
|
2361
2389
|
|
|
2362
2390
|
.title-l {
|
|
2363
2391
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2364
2392
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2365
2393
|
font-size: var(--hg-typo-font-size-13);
|
|
2366
|
-
line-height: var(--hg-typo-line-height-1-4);
|
|
2394
|
+
line-height: var(--hg-typo-line-height-1-4) !important;
|
|
2367
2395
|
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2368
2396
|
text-transform: var(--hg-typo-text-transform-uppercase);
|
|
2369
2397
|
}
|
|
@@ -2372,7 +2400,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2372
2400
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2373
2401
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2374
2402
|
font-size: var(--hg-typo-font-size-13);
|
|
2375
|
-
line-height: var(--hg-typo-line-height-1-4);
|
|
2403
|
+
line-height: var(--hg-typo-line-height-1-4) !important;
|
|
2376
2404
|
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2377
2405
|
}
|
|
2378
2406
|
|
|
@@ -2380,7 +2408,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2380
2408
|
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2381
2409
|
font-weight: var(--hg-typo-font-weight-300);
|
|
2382
2410
|
font-size: var(--hg-typo-font-size-10);
|
|
2383
|
-
line-height: var(--hg-typo-line-height-1-4);
|
|
2411
|
+
line-height: var(--hg-typo-line-height-1-4) !important;
|
|
2384
2412
|
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2385
2413
|
}
|
|
2386
2414
|
|
|
@@ -2388,7 +2416,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2388
2416
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2389
2417
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2390
2418
|
font-size: var(--hg-typo-font-size-10);
|
|
2391
|
-
line-height: var(--hg-typo-line-height-1-4);
|
|
2419
|
+
line-height: var(--hg-typo-line-height-1-4) !important;
|
|
2392
2420
|
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2393
2421
|
text-transform: var(--hg-typo-text-transform-uppercase);
|
|
2394
2422
|
}
|
|
@@ -2397,7 +2425,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2397
2425
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2398
2426
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2399
2427
|
font-size: var(--hg-typo-font-size-13);
|
|
2400
|
-
line-height: var(--hg-typo-line-height-1-5);
|
|
2428
|
+
line-height: var(--hg-typo-line-height-1-5) !important;
|
|
2401
2429
|
letter-spacing: var(--hg-typo-letter-spacing-0-04em);
|
|
2402
2430
|
}
|
|
2403
2431
|
|
|
@@ -2405,7 +2433,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2405
2433
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2406
2434
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2407
2435
|
font-size: var(--hg-typo-font-size-12);
|
|
2408
|
-
line-height: var(--hg-typo-line-height-1-5);
|
|
2436
|
+
line-height: var(--hg-typo-line-height-1-5) !important;
|
|
2409
2437
|
letter-spacing: var(--hg-typo-letter-spacing-0-04em);
|
|
2410
2438
|
}
|
|
2411
2439
|
|
|
@@ -2413,7 +2441,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2413
2441
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2414
2442
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2415
2443
|
font-size: var(--hg-typo-font-size-10);
|
|
2416
|
-
line-height: var(--hg-typo-line-height-1);
|
|
2444
|
+
line-height: var(--hg-typo-line-height-1) !important;
|
|
2417
2445
|
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2418
2446
|
}
|
|
2419
2447
|
|
|
@@ -2421,7 +2449,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2421
2449
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2422
2450
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2423
2451
|
font-size: var(--hg-typo-font-size-13);
|
|
2424
|
-
line-height: var(--hg-typo-line-height-1-5);
|
|
2452
|
+
line-height: var(--hg-typo-line-height-1-5) !important;
|
|
2425
2453
|
letter-spacing: var(--hg-typo-letter-spacing-0-04em);
|
|
2426
2454
|
}
|
|
2427
2455
|
|
|
@@ -2429,7 +2457,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2429
2457
|
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2430
2458
|
font-weight: var(--hg-typo-font-weight-300);
|
|
2431
2459
|
font-size: var(--hg-typo-font-size-13);
|
|
2432
|
-
line-height: var(--hg-typo-line-height-1-5);
|
|
2460
|
+
line-height: var(--hg-typo-line-height-1-5) !important;
|
|
2433
2461
|
letter-spacing: var(--hg-typo-letter-spacing-0-04em);
|
|
2434
2462
|
}
|
|
2435
2463
|
|
|
@@ -2437,7 +2465,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2437
2465
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2438
2466
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2439
2467
|
font-size: var(--hg-typo-font-size-12);
|
|
2440
|
-
line-height: var(--hg-typo-line-height-1-5);
|
|
2468
|
+
line-height: var(--hg-typo-line-height-1-5) !important;
|
|
2441
2469
|
letter-spacing: var(--hg-typo-letter-spacing-0-04em);
|
|
2442
2470
|
}
|
|
2443
2471
|
|
|
@@ -2445,7 +2473,7 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2445
2473
|
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2446
2474
|
font-weight: var(--hg-typo-font-weight-300);
|
|
2447
2475
|
font-size: var(--hg-typo-font-size-12);
|
|
2448
|
-
line-height: var(--hg-typo-line-height-1-5);
|
|
2476
|
+
line-height: var(--hg-typo-line-height-1-5) !important;
|
|
2449
2477
|
letter-spacing: var(--hg-typo-letter-spacing-0-04em);
|
|
2450
2478
|
}
|
|
2451
2479
|
|
|
@@ -2453,9 +2481,36 @@ p, h1, h2, h3, h4, h5, h6 {
|
|
|
2453
2481
|
font-family: var(--hg-typo-font-family-primary-light);
|
|
2454
2482
|
font-weight: var(--hg-typo-font-weight-100);
|
|
2455
2483
|
font-size: var(--hg-typo-font-size-12);
|
|
2456
|
-
line-height: var(--hg-typo-line-height-1);
|
|
2484
|
+
line-height: var(--hg-typo-line-height-1) !important;
|
|
2457
2485
|
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2458
2486
|
text-transform: var(--hg-typo-text-transform-uppercase);
|
|
2459
2487
|
}
|
|
2460
2488
|
|
|
2489
|
+
.label-m-b {
|
|
2490
|
+
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2491
|
+
font-weight: var(--hg-typo-font-weight-300);
|
|
2492
|
+
font-size: var(--hg-typo-font-size-12);
|
|
2493
|
+
line-height: var(--hg-typo-line-height-1) !important;
|
|
2494
|
+
letter-spacing: var(--hg-typo-letter-spacing-0-16em);
|
|
2495
|
+
text-transform: var(--hg-typo-text-transform-uppercase);
|
|
2496
|
+
}
|
|
2497
|
+
|
|
2498
|
+
.label-s {
|
|
2499
|
+
font-family: var(--hg-typo-font-family-primary-light);
|
|
2500
|
+
font-weight: var(--hg-typo-font-weight-100);
|
|
2501
|
+
font-size: var(--hg-typo-font-size-10);
|
|
2502
|
+
line-height: var(--hg-typo-line-height-1) !important;
|
|
2503
|
+
letter-spacing: var(--hg-typo-letter-spacing-0-06em);
|
|
2504
|
+
text-transform: var(--hg-typo-text-transform-uppercase);
|
|
2505
|
+
}
|
|
2506
|
+
|
|
2507
|
+
.label-s-b {
|
|
2508
|
+
font-family: var(--hg-typo-font-family-primary-regular);
|
|
2509
|
+
font-weight: var(--hg-typo-font-weight-300);
|
|
2510
|
+
font-size: var(--hg-typo-font-size-10);
|
|
2511
|
+
line-height: var(--hg-typo-line-height-1) !important;
|
|
2512
|
+
letter-spacing: var(--hg-typo-letter-spacing-0-06em);
|
|
2513
|
+
text-transform: var(--hg-typo-text-transform-uppercase);
|
|
2514
|
+
}
|
|
2515
|
+
|
|
2461
2516
|
}
|
|
@@ -766,6 +766,39 @@
|
|
|
766
766
|
<td><span class="hg-typo-num">1</span></td>
|
|
767
767
|
<td>0.16em</td>
|
|
768
768
|
<td>uppercase</td>
|
|
769
|
+
</tr>
|
|
770
|
+
<tr>
|
|
771
|
+
<td class="hg-typo-preview"><span class="label-m-b">Aa Bb Cc 123</span></td>
|
|
772
|
+
<td><code>.label-m-b</code></td>
|
|
773
|
+
<td><code>primary-regular</code> <span class="hg-typo-meta">"suisse-regular", Arial, Helvetica, sans-serif</span></td>
|
|
774
|
+
<td>300</td>
|
|
775
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
776
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
777
|
+
<td><span class="hg-typo-num">1</span></td>
|
|
778
|
+
<td>0.16em</td>
|
|
779
|
+
<td>uppercase</td>
|
|
780
|
+
</tr>
|
|
781
|
+
<tr>
|
|
782
|
+
<td class="hg-typo-preview"><span class="label-s">Aa Bb Cc 123</span></td>
|
|
783
|
+
<td><code>.label-s</code></td>
|
|
784
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-light", Arial, Helvetica, sans-serif</span></td>
|
|
785
|
+
<td>100</td>
|
|
786
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
787
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
788
|
+
<td><span class="hg-typo-num">1</span></td>
|
|
789
|
+
<td>0.06em</td>
|
|
790
|
+
<td>uppercase</td>
|
|
791
|
+
</tr>
|
|
792
|
+
<tr>
|
|
793
|
+
<td class="hg-typo-preview"><span class="label-s-b">Aa Bb Cc 123</span></td>
|
|
794
|
+
<td><code>.label-s-b</code></td>
|
|
795
|
+
<td><code>primary-regular</code> <span class="hg-typo-meta">"suisse-regular", Arial, Helvetica, sans-serif</span></td>
|
|
796
|
+
<td>300</td>
|
|
797
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
798
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
799
|
+
<td><span class="hg-typo-num">1</span></td>
|
|
800
|
+
<td>0.06em</td>
|
|
801
|
+
<td>uppercase</td>
|
|
769
802
|
</tr>
|
|
770
803
|
</tbody>
|
|
771
804
|
</table>
|
|
@@ -770,6 +770,39 @@
|
|
|
770
770
|
<td><span class="hg-typo-num">1</span></td>
|
|
771
771
|
<td>0.16em</td>
|
|
772
772
|
<td>uppercase</td>
|
|
773
|
+
</tr>
|
|
774
|
+
<tr>
|
|
775
|
+
<td class="hg-typo-preview"><span class="label-m-b">Aa Bb Cc 123</span></td>
|
|
776
|
+
<td><code>.label-m-b</code></td>
|
|
777
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-works-regular", Georgia, "Times New Roman", serif</span></td>
|
|
778
|
+
<td>300</td>
|
|
779
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
780
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
781
|
+
<td><span class="hg-typo-num">1</span></td>
|
|
782
|
+
<td>0.16em</td>
|
|
783
|
+
<td>uppercase</td>
|
|
784
|
+
</tr>
|
|
785
|
+
<tr>
|
|
786
|
+
<td class="hg-typo-preview"><span class="label-s">Aa Bb Cc 123</span></td>
|
|
787
|
+
<td><code>.label-s</code></td>
|
|
788
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-works-regular", Georgia, "Times New Roman", serif</span></td>
|
|
789
|
+
<td>100</td>
|
|
790
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
791
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
792
|
+
<td><span class="hg-typo-num">1</span></td>
|
|
793
|
+
<td>0.06em</td>
|
|
794
|
+
<td>uppercase</td>
|
|
795
|
+
</tr>
|
|
796
|
+
<tr>
|
|
797
|
+
<td class="hg-typo-preview"><span class="label-s-b">Aa Bb Cc 123</span></td>
|
|
798
|
+
<td><code>.label-s-b</code></td>
|
|
799
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-works-regular", Georgia, "Times New Roman", serif</span></td>
|
|
800
|
+
<td>300</td>
|
|
801
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
802
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
803
|
+
<td><span class="hg-typo-num">1</span></td>
|
|
804
|
+
<td>0.06em</td>
|
|
805
|
+
<td>uppercase</td>
|
|
773
806
|
</tr>
|
|
774
807
|
</tbody>
|
|
775
808
|
</table>
|
package/package.json
CHANGED
|
@@ -264,6 +264,48 @@
|
|
|
264
264
|
"fontSize": "12px",
|
|
265
265
|
"lineHeight": "1"
|
|
266
266
|
}
|
|
267
|
+
},
|
|
268
|
+
"label-m-b": {
|
|
269
|
+
"fontFamily": "\"suisse-regular\", Arial, Helvetica, sans-serif",
|
|
270
|
+
"fontWeight": "300",
|
|
271
|
+
"letterSpacing": "0.16em",
|
|
272
|
+
"textTransform": "uppercase",
|
|
273
|
+
"mobile": {
|
|
274
|
+
"fontSize": "12px",
|
|
275
|
+
"lineHeight": "1"
|
|
276
|
+
},
|
|
277
|
+
"desktop": {
|
|
278
|
+
"fontSize": "12px",
|
|
279
|
+
"lineHeight": "1"
|
|
280
|
+
}
|
|
281
|
+
},
|
|
282
|
+
"label-s": {
|
|
283
|
+
"fontFamily": "\"suisse-light\", Arial, Helvetica, sans-serif",
|
|
284
|
+
"fontWeight": "100",
|
|
285
|
+
"letterSpacing": "0.06em",
|
|
286
|
+
"textTransform": "uppercase",
|
|
287
|
+
"mobile": {
|
|
288
|
+
"fontSize": "10px",
|
|
289
|
+
"lineHeight": "1"
|
|
290
|
+
},
|
|
291
|
+
"desktop": {
|
|
292
|
+
"fontSize": "10px",
|
|
293
|
+
"lineHeight": "1"
|
|
294
|
+
}
|
|
295
|
+
},
|
|
296
|
+
"label-s-b": {
|
|
297
|
+
"fontFamily": "\"suisse-regular\", Arial, Helvetica, sans-serif",
|
|
298
|
+
"fontWeight": "300",
|
|
299
|
+
"letterSpacing": "0.06em",
|
|
300
|
+
"textTransform": "uppercase",
|
|
301
|
+
"mobile": {
|
|
302
|
+
"fontSize": "10px",
|
|
303
|
+
"lineHeight": "1"
|
|
304
|
+
},
|
|
305
|
+
"desktop": {
|
|
306
|
+
"fontSize": "10px",
|
|
307
|
+
"lineHeight": "1"
|
|
308
|
+
}
|
|
267
309
|
}
|
|
268
310
|
},
|
|
269
311
|
"variables": {
|
|
@@ -295,6 +337,7 @@
|
|
|
295
337
|
"--hg-typo-letter-spacing-110": "110rem",
|
|
296
338
|
"--hg-typo-letter-spacing-0-16em": "0.16em",
|
|
297
339
|
"--hg-typo-letter-spacing-0-04em": "0.04em",
|
|
340
|
+
"--hg-typo-letter-spacing-0-06em": "0.06em",
|
|
298
341
|
"--hg-typo-text-transform-none": "none",
|
|
299
342
|
"--hg-typo-text-transform-uppercase": "uppercase",
|
|
300
343
|
"--hg-typo-text-transform-otro": "otro",
|
|
@@ -198,7 +198,8 @@ function generateClassCSS(className, cls, breakpointName, valueMap, prefix, cate
|
|
|
198
198
|
varName = getSharedVarName(prop, props[prop], prefix, category);
|
|
199
199
|
}
|
|
200
200
|
|
|
201
|
-
|
|
201
|
+
const importantFlag = prop === 'lineHeight' ? ' !important' : '';
|
|
202
|
+
cssProps.push(` ${toKebabCase(prop)}: var(${varName})${importantFlag};`);
|
|
202
203
|
});
|
|
203
204
|
|
|
204
205
|
return cssProps.length ? ` .${className} {\n${cssProps.join('\n')}\n }` : '';
|