holygrail5 1.0.19 → 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/README.md +88 -18
- package/config.json +205 -77
- package/dist/assets/fonts/suisse-intl-light.woff +0 -0
- package/dist/assets/fonts/suisse-intl-light.woff2 +0 -0
- package/dist/assets/fonts/suisse-intl-medium.woff +0 -0
- package/dist/assets/fonts/suisse-intl-medium.woff2 +0 -0
- package/dist/assets/fonts/suisse-intl-regular.woff +0 -0
- package/dist/assets/fonts/suisse-intl-regular.woff2 +0 -0
- package/dist/assets/fonts/suisse-intl-semibold.woff +0 -0
- package/dist/assets/fonts/suisse-intl-semibold.woff2 +0 -0
- package/dist/assets/fonts/suisse-works-bold.woff +0 -0
- package/dist/assets/fonts/suisse-works-bold.woff2 +0 -0
- package/dist/assets/fonts/suisse-works-medium.woff +0 -0
- package/dist/assets/fonts/suisse-works-medium.woff2 +0 -0
- package/dist/assets/fonts/suisse-works-regular.woff +0 -0
- package/dist/assets/fonts/suisse-works-regular.woff2 +0 -0
- package/dist/componentes.html +429 -0
- package/dist/developer-guide.md +7 -7
- package/dist/guide-styles.css +197 -25
- package/dist/index.html +807 -689
- package/dist/output.css +217 -114
- package/dist/skills.html +14 -8
- package/dist/themes/dutti-demo.html +713 -19
- package/dist/themes/dutti.css +67 -16
- package/dist/themes/limited-demo.html +1121 -0
- package/dist/themes/limited.css +2493 -0
- package/package.json +1 -1
- package/src/.data/.previous-values.json +151 -84
- package/src/assets/fonts/suisse-intl-light.woff +0 -0
- package/src/assets/fonts/suisse-intl-light.woff2 +0 -0
- package/src/assets/fonts/suisse-intl-medium.woff +0 -0
- package/src/assets/fonts/suisse-intl-medium.woff2 +0 -0
- package/src/assets/fonts/suisse-intl-regular.woff +0 -0
- package/src/assets/fonts/suisse-intl-regular.woff2 +0 -0
- package/src/assets/fonts/suisse-intl-semibold.woff +0 -0
- package/src/assets/fonts/suisse-intl-semibold.woff2 +0 -0
- package/src/assets/fonts/suisse-works-bold.woff +0 -0
- package/src/assets/fonts/suisse-works-bold.woff2 +0 -0
- package/src/assets/fonts/suisse-works-medium.woff +0 -0
- package/src/assets/fonts/suisse-works-medium.woff2 +0 -0
- package/src/assets/fonts/suisse-works-regular.woff +0 -0
- package/src/assets/fonts/suisse-works-regular.woff2 +0 -0
- package/src/build/asset-manager.js +94 -3
- package/src/build/build-orchestrator.js +74 -12
- package/src/build/components-generator.js +584 -0
- package/src/build/skills-generator.js +43 -5
- package/src/build/theme-config-loader.js +58 -0
- package/src/build/theme-transformer.js +109 -16
- package/src/build/theme-vars-table-generator.js +349 -0
- package/src/build/typo-table-generator.js +154 -0
- package/src/docs-generator/guide-styles.css +197 -24
- package/src/docs-generator/html-generator.js +92 -246
- package/src/docs-generator/sections/colors-section.js +109 -0
- package/src/docs-generator/value-tracker.js +154 -0
- package/src/generators/typo-generator.js +2 -1
- package/src/generators/utils.js +90 -1
- package/src/skills.html +1 -0
- package/src/watch-config.js +99 -32
- package/themes/{dutti → _base}/_buttons.css +2 -2
- package/themes/{dutti → _base}/_checkboxes.css +1 -1
- package/themes/{dutti → _base}/_forms.css +1 -1
- package/themes/{dutti → _base}/_inputs.css +55 -10
- package/themes/{dutti → _base}/_labels.css +1 -1
- package/themes/dutti/README.md +67 -21
- package/themes/dutti/_variables.css +7 -1
- package/themes/dutti/demo.html +18 -14
- package/themes/dutti/theme.css +22 -44
- package/themes/dutti/theme.json +86 -0
- package/themes/limited/_variables.css +123 -0
- package/themes/limited/demo.html +296 -0
- package/themes/limited/theme.css +32 -0
- package/themes/limited/theme.json +105 -0
- /package/themes/{dutti → _base}/_containers.css +0 -0
- /package/themes/{dutti → _base}/_radios.css +0 -0
- /package/themes/{dutti → _base}/_switches.css +0 -0
- /package/themes/{dutti → _base}/components/_icons.css +0 -0
- /package/themes/{dutti → _base}/objects/_grid.css +0 -0
package/dist/index.html
CHANGED
|
@@ -16,7 +16,7 @@
|
|
|
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
18
|
<link rel="stylesheet" href="output.css">
|
|
19
|
-
<link rel="stylesheet" href="guide-styles.css?v=
|
|
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:
|
|
77
|
+
last update: 24/4/2026, 13:43:53
|
|
78
78
|
</p>
|
|
79
79
|
|
|
80
80
|
|
|
@@ -86,7 +86,6 @@
|
|
|
86
86
|
</aside>
|
|
87
87
|
<div class="guide-header">
|
|
88
88
|
<div style="display: flex; align-items: center; gap: 1rem; flex: 1; min-width: 0;">
|
|
89
|
-
<button class="guide-header-button" onclick="toggleSidebar()">☰</button>
|
|
90
89
|
<div class="guide-search-container" style="flex: 1; max-width: 360px;">
|
|
91
90
|
<input
|
|
92
91
|
type="text"
|
|
@@ -115,11 +114,16 @@
|
|
|
115
114
|
</div>
|
|
116
115
|
<div id="search-results" class="guide-search-results"></div>
|
|
117
116
|
</div>
|
|
118
|
-
<
|
|
119
|
-
<
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
117
|
+
<div style="display: flex; align-items: center; gap: 1rem;">
|
|
118
|
+
<nav class="guide-nav">
|
|
119
|
+
<a href="index.html" class="active">Guía</a>
|
|
120
|
+
<a href="componentes.html">Componentes</a>
|
|
121
|
+
<a href="themes/dutti-demo.html">Tema Dutti</a>
|
|
122
|
+
<a href="themes/limited-demo.html">Tema Limited</a>
|
|
123
|
+
<a href="skills.html">Skills</a>
|
|
124
|
+
</nav>
|
|
125
|
+
<button class="guide-header-button" onclick="toggleSidebar()">☰</button>
|
|
126
|
+
</div>
|
|
123
127
|
</div>
|
|
124
128
|
<main class="guide-main-content">
|
|
125
129
|
<div class="guide-container">
|
|
@@ -201,7 +205,7 @@
|
|
|
201
205
|
</div>
|
|
202
206
|
<div class="guide-color-card" data-copy-value="--hg-color-light-grey" title="Click para copiar --hg-color-light-grey">
|
|
203
207
|
<div class="guide-color-preview" style="--color-value: #f9f9f9;">
|
|
204
|
-
|
|
208
|
+
<div class="guide-color-pattern"></div>
|
|
205
209
|
</div>
|
|
206
210
|
<div class="guide-color-card-content">
|
|
207
211
|
<div class="guide-color-name">light-grey</div>
|
|
@@ -240,23 +244,13 @@
|
|
|
240
244
|
</div>
|
|
241
245
|
</div>
|
|
242
246
|
<div class="guide-color-card" data-copy-value="--hg-color-bg-light" title="Click para copiar --hg-color-bg-light">
|
|
243
|
-
<div class="guide-color-preview" style="--color-value: #
|
|
247
|
+
<div class="guide-color-preview" style="--color-value: #f9f9f9;">
|
|
244
248
|
<div class="guide-color-pattern"></div>
|
|
245
249
|
</div>
|
|
246
250
|
<div class="guide-color-card-content">
|
|
247
251
|
<div class="guide-color-name">bg-light</div>
|
|
248
252
|
<div class="guide-color-var-name" data-copy-value="--hg-color-bg-light" title="Click para copiar --hg-color-bg-light">--hg-color-bg-light</div>
|
|
249
|
-
<div class="guide-color-value " data-copy-value="#
|
|
250
|
-
</div>
|
|
251
|
-
</div>
|
|
252
|
-
<div class="guide-color-card" data-copy-value="--hg-color-sk-grey" title="Click para copiar --hg-color-sk-grey">
|
|
253
|
-
<div class="guide-color-preview" style="--color-value: #e3e3e3;">
|
|
254
|
-
<div class="guide-color-pattern"></div>
|
|
255
|
-
</div>
|
|
256
|
-
<div class="guide-color-card-content">
|
|
257
|
-
<div class="guide-color-name">sk-grey</div>
|
|
258
|
-
<div class="guide-color-var-name" data-copy-value="--hg-color-sk-grey" title="Click para copiar --hg-color-sk-grey">--hg-color-sk-grey</div>
|
|
259
|
-
<div class="guide-color-value " data-copy-value="#e3e3e3" title="Click para copiar #e3e3e3">#e3e3e3</div>
|
|
253
|
+
<div class="guide-color-value " data-copy-value="#f9f9f9" title="Click para copiar #f9f9f9">#f9f9f9</div>
|
|
260
254
|
</div>
|
|
261
255
|
</div>
|
|
262
256
|
<div class="guide-color-card" data-copy-value="--hg-color-bg-cream" title="Click para copiar --hg-color-bg-cream">
|
|
@@ -285,23 +279,23 @@
|
|
|
285
279
|
</div>
|
|
286
280
|
</div>
|
|
287
281
|
<div class="guide-color-card" data-copy-value="--hg-color-error" title="Click para copiar --hg-color-error">
|
|
288
|
-
<div class="guide-color-preview" style="--color-value: #
|
|
282
|
+
<div class="guide-color-preview" style="--color-value: #dd2d01;">
|
|
289
283
|
|
|
290
284
|
</div>
|
|
291
285
|
<div class="guide-color-card-content">
|
|
292
286
|
<div class="guide-color-name">error</div>
|
|
293
287
|
<div class="guide-color-var-name" data-copy-value="--hg-color-error" title="Click para copiar --hg-color-error">--hg-color-error</div>
|
|
294
|
-
<div class="guide-color-value " data-copy-value="#
|
|
288
|
+
<div class="guide-color-value " data-copy-value="#dd2d01" title="Click para copiar #dd2d01">#dd2d01</div>
|
|
295
289
|
</div>
|
|
296
290
|
</div>
|
|
297
291
|
<div class="guide-color-card" data-copy-value="--hg-color-info" title="Click para copiar --hg-color-info">
|
|
298
|
-
<div class="guide-color-preview" style="--color-value: #
|
|
292
|
+
<div class="guide-color-preview" style="--color-value: #2037a6;">
|
|
299
293
|
|
|
300
294
|
</div>
|
|
301
295
|
<div class="guide-color-card-content">
|
|
302
296
|
<div class="guide-color-name">info</div>
|
|
303
297
|
<div class="guide-color-var-name" data-copy-value="--hg-color-info" title="Click para copiar --hg-color-info">--hg-color-info</div>
|
|
304
|
-
<div class="guide-color-value " data-copy-value="#
|
|
298
|
+
<div class="guide-color-value " data-copy-value="#2037a6" title="Click para copiar #2037a6">#2037a6</div>
|
|
305
299
|
</div>
|
|
306
300
|
</div>
|
|
307
301
|
<div class="guide-color-card" data-copy-value="--hg-color-success" title="Click para copiar --hg-color-success">
|
|
@@ -315,13 +309,13 @@
|
|
|
315
309
|
</div>
|
|
316
310
|
</div>
|
|
317
311
|
<div class="guide-color-card" data-copy-value="--hg-color-warning" title="Click para copiar --hg-color-warning">
|
|
318
|
-
<div class="guide-color-preview" style="--color-value: #
|
|
312
|
+
<div class="guide-color-preview" style="--color-value: #ffce4e;">
|
|
319
313
|
|
|
320
314
|
</div>
|
|
321
315
|
<div class="guide-color-card-content">
|
|
322
316
|
<div class="guide-color-name">warning</div>
|
|
323
317
|
<div class="guide-color-var-name" data-copy-value="--hg-color-warning" title="Click para copiar --hg-color-warning">--hg-color-warning</div>
|
|
324
|
-
<div class="guide-color-value " data-copy-value="#
|
|
318
|
+
<div class="guide-color-value " data-copy-value="#ffce4e" title="Click para copiar #ffce4e">#ffce4e</div>
|
|
325
319
|
</div>
|
|
326
320
|
</div>
|
|
327
321
|
<div class="guide-color-card" data-copy-value="--hg-color-feel" title="Click para copiar --hg-color-feel">
|
|
@@ -344,26 +338,6 @@
|
|
|
344
338
|
<div class="guide-color-value " data-copy-value="#c94c07" title="Click para copiar #c94c07">#c94c07</div>
|
|
345
339
|
</div>
|
|
346
340
|
</div>
|
|
347
|
-
<div class="guide-color-card" data-copy-value="--hg-color-special" title="Click para copiar --hg-color-special">
|
|
348
|
-
<div class="guide-color-preview" style="--color-value: #b99d6b;">
|
|
349
|
-
|
|
350
|
-
</div>
|
|
351
|
-
<div class="guide-color-card-content">
|
|
352
|
-
<div class="guide-color-name">special</div>
|
|
353
|
-
<div class="guide-color-var-name" data-copy-value="--hg-color-special" title="Click para copiar --hg-color-special">--hg-color-special</div>
|
|
354
|
-
<div class="guide-color-value " data-copy-value="#b99d6b" title="Click para copiar #b99d6b">#b99d6b</div>
|
|
355
|
-
</div>
|
|
356
|
-
</div>
|
|
357
|
-
<div class="guide-color-card" data-copy-value="--hg-color-vanilla" title="Click para copiar --hg-color-vanilla">
|
|
358
|
-
<div class="guide-color-preview" style="--color-value: #f4f2ed;">
|
|
359
|
-
<div class="guide-color-pattern"></div>
|
|
360
|
-
</div>
|
|
361
|
-
<div class="guide-color-card-content">
|
|
362
|
-
<div class="guide-color-name">vanilla</div>
|
|
363
|
-
<div class="guide-color-var-name" data-copy-value="--hg-color-vanilla" title="Click para copiar --hg-color-vanilla">--hg-color-vanilla</div>
|
|
364
|
-
<div class="guide-color-value " data-copy-value="#F4F2ED" title="Click para copiar #F4F2ED">#F4F2ED</div>
|
|
365
|
-
</div>
|
|
366
|
-
</div>
|
|
367
341
|
<div class="guide-color-card" data-copy-value="--hg-color-silver" title="Click para copiar --hg-color-silver">
|
|
368
342
|
<div class="guide-color-preview" style="--color-value: #87888d;">
|
|
369
343
|
|
|
@@ -394,26 +368,6 @@
|
|
|
394
368
|
<div class="guide-color-value " data-copy-value="#5B7FA1" title="Click para copiar #5B7FA1">#5B7FA1</div>
|
|
395
369
|
</div>
|
|
396
370
|
</div>
|
|
397
|
-
<div class="guide-color-card" data-copy-value="--hg-color-charcoal" title="Click para copiar --hg-color-charcoal">
|
|
398
|
-
<div class="guide-color-preview" style="--color-value: #1d1d1d;">
|
|
399
|
-
|
|
400
|
-
</div>
|
|
401
|
-
<div class="guide-color-card-content">
|
|
402
|
-
<div class="guide-color-name">charcoal</div>
|
|
403
|
-
<div class="guide-color-var-name" data-copy-value="--hg-color-charcoal" title="Click para copiar --hg-color-charcoal">--hg-color-charcoal</div>
|
|
404
|
-
<div class="guide-color-value " data-copy-value="#1D1D1D" title="Click para copiar #1D1D1D">#1D1D1D</div>
|
|
405
|
-
</div>
|
|
406
|
-
</div>
|
|
407
|
-
<div class="guide-color-card" data-copy-value="--hg-color-c-bg-light" title="Click para copiar --hg-color-c-bg-light">
|
|
408
|
-
<div class="guide-color-preview" style="--color-value: #000000;">
|
|
409
|
-
|
|
410
|
-
</div>
|
|
411
|
-
<div class="guide-color-card-content">
|
|
412
|
-
<div class="guide-color-name">c-bg-light</div>
|
|
413
|
-
<div class="guide-color-var-name" data-copy-value="--hg-color-c-bg-light" title="Click para copiar --hg-color-c-bg-light">--hg-color-c-bg-light</div>
|
|
414
|
-
<div class="guide-color-value " data-copy-value="#000000" title="Click para copiar #000000">#000000</div>
|
|
415
|
-
</div>
|
|
416
|
-
</div>
|
|
417
371
|
</div>
|
|
418
372
|
</div>
|
|
419
373
|
</div>
|
|
@@ -443,7 +397,7 @@
|
|
|
443
397
|
</div>
|
|
444
398
|
<div class="guide-typeface-info-item">
|
|
445
399
|
<div class="guide-typeface-label">WEIGHT</div>
|
|
446
|
-
<div class="guide-typeface-value">Regular, Medium, Semibold</div>
|
|
400
|
+
<div class="guide-typeface-value">Light, Regular, Medium, Semibold</div>
|
|
447
401
|
</div>
|
|
448
402
|
</div>
|
|
449
403
|
</div>
|
|
@@ -470,21 +424,27 @@
|
|
|
470
424
|
<tbody>
|
|
471
425
|
|
|
472
426
|
<tr>
|
|
473
|
-
<td class="guide-table-name">primary</td>
|
|
474
|
-
<td class="guide-font-family-preview" style='font-family:
|
|
475
|
-
<td class="guide-table-value ">
|
|
476
|
-
<td class="guide-table-value">--hg-typo-font-family-primary</td>
|
|
427
|
+
<td class="guide-table-name">primary-light</td>
|
|
428
|
+
<td class="guide-font-family-preview" style='font-family: "suisse-light", Arial, Helvetica, sans-serif;'>Aa</td>
|
|
429
|
+
<td class="guide-table-value ">"suisse-light", Arial, Helvetica, sans-serif</td>
|
|
430
|
+
<td class="guide-table-value">--hg-typo-font-family-primary-light</td>
|
|
431
|
+
</tr>
|
|
432
|
+
<tr>
|
|
433
|
+
<td class="guide-table-name">primary-regular</td>
|
|
434
|
+
<td class="guide-font-family-preview" style='font-family: "suisse-regular", Arial, Helvetica, sans-serif;'>Aa</td>
|
|
435
|
+
<td class="guide-table-value ">"suisse-regular", Arial, Helvetica, sans-serif</td>
|
|
436
|
+
<td class="guide-table-value">--hg-typo-font-family-primary-regular</td>
|
|
477
437
|
</tr>
|
|
478
438
|
<tr>
|
|
479
439
|
<td class="guide-table-name">primary-bold</td>
|
|
480
|
-
<td class="guide-font-family-preview" style='font-family: "
|
|
481
|
-
<td class="guide-table-value ">"
|
|
440
|
+
<td class="guide-font-family-preview" style='font-family: "suisse-semibold", Arial, Helvetica, sans-serif;'>Aa</td>
|
|
441
|
+
<td class="guide-table-value ">"suisse-semibold", Arial, Helvetica, sans-serif</td>
|
|
482
442
|
<td class="guide-table-value">--hg-typo-font-family-primary-bold</td>
|
|
483
443
|
</tr>
|
|
484
444
|
<tr>
|
|
485
445
|
<td class="guide-table-name">secondary</td>
|
|
486
|
-
<td class="guide-font-family-preview" style='font-family: "
|
|
487
|
-
<td class="guide-table-value ">"
|
|
446
|
+
<td class="guide-font-family-preview" style='font-family: "suisse-medium", Arial, Helvetica, sans-serif;'>Aa</td>
|
|
447
|
+
<td class="guide-table-value ">"suisse-medium", Arial, Helvetica, sans-serif</td>
|
|
488
448
|
<td class="guide-table-value">--hg-typo-font-family-secondary</td>
|
|
489
449
|
</tr>
|
|
490
450
|
</tbody>
|
|
@@ -494,17 +454,275 @@
|
|
|
494
454
|
</div>
|
|
495
455
|
|
|
496
456
|
<div class="guide-section" id="tipografia">
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
457
|
+
<div class="guide-section-content">
|
|
458
|
+
<section class="demo-section" id="typography">
|
|
459
|
+
<h2 class="demo-title">Tipografía</h2>
|
|
460
|
+
<p class="mb-24">
|
|
461
|
+
Cada fila usa la clase real generada en <code>dist/output.css</code> a partir de <code>config.json → typo</code>.
|
|
462
|
+
La columna <em>Preview</em> aplica la clase tal cual, así puedes comparar el valor numérico con el render en vivo.
|
|
463
|
+
</p>
|
|
464
|
+
|
|
465
|
+
<style>
|
|
466
|
+
.hg-typo-table-wrap { overflow-x: auto; }
|
|
467
|
+
.hg-typo-table {
|
|
468
|
+
width: 100%;
|
|
469
|
+
border-collapse: collapse;
|
|
470
|
+
font-family: arial, sans-serif;
|
|
471
|
+
font-size: 13px;
|
|
472
|
+
}
|
|
473
|
+
.hg-typo-table th,
|
|
474
|
+
.hg-typo-table td {
|
|
475
|
+
text-align: left;
|
|
476
|
+
padding: 10px 12px;
|
|
477
|
+
border-bottom: 1px solid var(--hg-color-middle-grey, #a9a9a9);
|
|
478
|
+
vertical-align: middle;
|
|
479
|
+
}
|
|
480
|
+
.hg-typo-table thead th {
|
|
481
|
+
font-weight: 700;
|
|
482
|
+
font-size: 11px;
|
|
483
|
+
text-transform: uppercase;
|
|
484
|
+
letter-spacing: 0.04em;
|
|
485
|
+
color: var(--hg-color-dark-grey, #737373);
|
|
486
|
+
border-bottom: 2px solid var(--hg-color-middle-grey, #a9a9a9);
|
|
487
|
+
background: var(--hg-color-bg-light, #f0f0f0);
|
|
488
|
+
}
|
|
489
|
+
.hg-typo-table tbody tr:hover { background: var(--hg-color-bg-light, #f0f0f0); }
|
|
490
|
+
.hg-typo-table code {
|
|
491
|
+
background: var(--hg-color-bg-light, #f0f0f0);
|
|
492
|
+
padding: 2px 6px;
|
|
493
|
+
border-radius: 3px;
|
|
494
|
+
font-size: 12px;
|
|
495
|
+
}
|
|
496
|
+
.hg-typo-preview {
|
|
497
|
+
min-width: 180px;
|
|
498
|
+
color: var(--hg-color-primary, #1d1d1d);
|
|
499
|
+
}
|
|
500
|
+
.hg-typo-num { font-weight: 700; }
|
|
501
|
+
.hg-typo-meta { color: var(--hg-color-dark-grey, #737373); font-size: 12px; }
|
|
502
|
+
.hg-typo-empty { color: var(--hg-color-middle-grey, #a9a9a9); }
|
|
503
|
+
</style>
|
|
504
|
+
|
|
505
|
+
<div class="hg-typo-table-wrap">
|
|
506
|
+
<table class="hg-typo-table">
|
|
507
|
+
<thead>
|
|
508
|
+
<tr>
|
|
509
|
+
<th>Preview</th>
|
|
510
|
+
<th>Clase</th>
|
|
511
|
+
<th>Font family</th>
|
|
512
|
+
<th>Weight</th>
|
|
513
|
+
<th>Mobile</th>
|
|
514
|
+
<th>Desktop</th>
|
|
515
|
+
<th>Line height</th>
|
|
516
|
+
<th>Letter spacing</th>
|
|
517
|
+
<th>Text transform</th>
|
|
518
|
+
</tr>
|
|
519
|
+
</thead>
|
|
520
|
+
<tbody>
|
|
521
|
+
<tr>
|
|
522
|
+
<td class="hg-typo-preview"><span class="title-xxl">Aa Bb Cc 123</span></td>
|
|
523
|
+
<td><code>.title-xxl</code></td>
|
|
524
|
+
<td><code>primary-regular</code> <span class="hg-typo-meta">"suisse-regular", Arial, Helvetica, sans-serif</span></td>
|
|
525
|
+
<td>300</td>
|
|
526
|
+
<td><span class="hg-typo-num">24px</span></td>
|
|
527
|
+
<td><span class="hg-typo-num">24px</span></td>
|
|
528
|
+
<td><span class="hg-typo-num">1</span></td>
|
|
529
|
+
<td>—</td>
|
|
530
|
+
<td>—</td>
|
|
531
|
+
</tr>
|
|
532
|
+
<tr>
|
|
533
|
+
<td class="hg-typo-preview"><span class="h2">Aa Bb Cc 123</span></td>
|
|
534
|
+
<td><code>.h2</code></td>
|
|
535
|
+
<td><code>primary-bold</code> <span class="hg-typo-meta">"suisse-semibold", Arial, Helvetica, sans-serif</span></td>
|
|
536
|
+
<td>600</td>
|
|
537
|
+
<td><span class="hg-typo-num">18px</span></td>
|
|
538
|
+
<td><span class="hg-typo-num">24px</span></td>
|
|
539
|
+
<td><span class="hg-typo-num">1.2</span></td>
|
|
540
|
+
<td>0rem</td>
|
|
541
|
+
<td>none</td>
|
|
542
|
+
</tr>
|
|
543
|
+
<tr>
|
|
544
|
+
<td class="hg-typo-preview"><span class="title-l-b">Aa Bb Cc 123</span></td>
|
|
545
|
+
<td><code>.title-l-b</code></td>
|
|
546
|
+
<td><code>primary-regular</code> <span class="hg-typo-meta">"suisse-regular", Arial, Helvetica, sans-serif</span></td>
|
|
547
|
+
<td>300</td>
|
|
548
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
549
|
+
<td><span class="hg-typo-num">13px</span></td>
|
|
550
|
+
<td><span class="hg-typo-num">1.4</span></td>
|
|
551
|
+
<td>—</td>
|
|
552
|
+
<td>—</td>
|
|
553
|
+
</tr>
|
|
554
|
+
<tr>
|
|
555
|
+
<td class="hg-typo-preview"><span class="title-l">Aa Bb Cc 123</span></td>
|
|
556
|
+
<td><code>.title-l</code></td>
|
|
557
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-light", Arial, Helvetica, sans-serif</span></td>
|
|
558
|
+
<td>100</td>
|
|
559
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
560
|
+
<td><span class="hg-typo-num">13px</span></td>
|
|
561
|
+
<td><span class="hg-typo-num">1.4</span></td>
|
|
562
|
+
<td>0.16em</td>
|
|
563
|
+
<td>uppercase</td>
|
|
564
|
+
</tr>
|
|
565
|
+
<tr>
|
|
566
|
+
<td class="hg-typo-preview"><span class="title-m">Aa Bb Cc 123</span></td>
|
|
567
|
+
<td><code>.title-m</code></td>
|
|
568
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-light", Arial, Helvetica, sans-serif</span></td>
|
|
569
|
+
<td>100</td>
|
|
570
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
571
|
+
<td><span class="hg-typo-num">13px</span></td>
|
|
572
|
+
<td><span class="hg-typo-num">1.4</span></td>
|
|
573
|
+
<td>0.16em</td>
|
|
574
|
+
<td>—</td>
|
|
575
|
+
</tr>
|
|
576
|
+
<tr>
|
|
577
|
+
<td class="hg-typo-preview"><span class="title-s-b">Aa Bb Cc 123</span></td>
|
|
578
|
+
<td><code>.title-s-b</code></td>
|
|
579
|
+
<td><code>primary-regular</code> <span class="hg-typo-meta">"suisse-regular", Arial, Helvetica, sans-serif</span></td>
|
|
580
|
+
<td>300</td>
|
|
581
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
582
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
583
|
+
<td><span class="hg-typo-num">1.4</span></td>
|
|
584
|
+
<td>0.16em</td>
|
|
585
|
+
<td>—</td>
|
|
586
|
+
</tr>
|
|
587
|
+
<tr>
|
|
588
|
+
<td class="hg-typo-preview"><span class="title-s">Aa Bb Cc 123</span></td>
|
|
589
|
+
<td><code>.title-s</code></td>
|
|
590
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-light", Arial, Helvetica, sans-serif</span></td>
|
|
591
|
+
<td>100</td>
|
|
592
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
593
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
594
|
+
<td><span class="hg-typo-num">1.4</span></td>
|
|
595
|
+
<td>0.16em</td>
|
|
596
|
+
<td>uppercase</td>
|
|
597
|
+
</tr>
|
|
598
|
+
<tr>
|
|
599
|
+
<td class="hg-typo-preview"><span class="text-l">Aa Bb Cc 123</span></td>
|
|
600
|
+
<td><code>.text-l</code></td>
|
|
601
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-light", Arial, Helvetica, sans-serif</span></td>
|
|
602
|
+
<td>100</td>
|
|
603
|
+
<td><span class="hg-typo-num">13px</span></td>
|
|
604
|
+
<td><span class="hg-typo-num">13px</span></td>
|
|
605
|
+
<td><span class="hg-typo-num">1.5</span></td>
|
|
606
|
+
<td>0.04em</td>
|
|
607
|
+
<td>—</td>
|
|
608
|
+
</tr>
|
|
609
|
+
<tr>
|
|
610
|
+
<td class="hg-typo-preview"><span class="text-m">Aa Bb Cc 123</span></td>
|
|
611
|
+
<td><code>.text-m</code></td>
|
|
612
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-light", Arial, Helvetica, sans-serif</span></td>
|
|
613
|
+
<td>100</td>
|
|
614
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
615
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
616
|
+
<td><span class="hg-typo-num">1.5</span></td>
|
|
617
|
+
<td>0.04em</td>
|
|
618
|
+
<td>—</td>
|
|
619
|
+
</tr>
|
|
620
|
+
<tr>
|
|
621
|
+
<td class="hg-typo-preview"><span class="p-tag">Aa Bb Cc 123</span></td>
|
|
622
|
+
<td><code>.p-tag</code></td>
|
|
623
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-light", Arial, Helvetica, sans-serif</span></td>
|
|
624
|
+
<td>100</td>
|
|
625
|
+
<td><span class="hg-typo-num">9px</span></td>
|
|
626
|
+
<td><span class="hg-typo-num">10px</span></td>
|
|
627
|
+
<td><span class="hg-typo-num">1</span></td>
|
|
628
|
+
<td>0.16em</td>
|
|
629
|
+
<td>—</td>
|
|
630
|
+
</tr>
|
|
631
|
+
<tr>
|
|
632
|
+
<td class="hg-typo-preview"><span class="hg-body-l">Aa Bb Cc 123</span></td>
|
|
633
|
+
<td><code>.hg-body-l</code></td>
|
|
634
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-light", Arial, Helvetica, sans-serif</span></td>
|
|
635
|
+
<td>100</td>
|
|
636
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
637
|
+
<td><span class="hg-typo-num">13px</span></td>
|
|
638
|
+
<td><span class="hg-typo-num">1.5</span></td>
|
|
639
|
+
<td>0.04em</td>
|
|
640
|
+
<td>—</td>
|
|
641
|
+
</tr>
|
|
642
|
+
<tr>
|
|
643
|
+
<td class="hg-typo-preview"><span class="hg-body-l-b">Aa Bb Cc 123</span></td>
|
|
644
|
+
<td><code>.hg-body-l-b</code></td>
|
|
645
|
+
<td><code>primary-regular</code> <span class="hg-typo-meta">"suisse-regular", Arial, Helvetica, sans-serif</span></td>
|
|
646
|
+
<td>300</td>
|
|
647
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
648
|
+
<td><span class="hg-typo-num">13px</span></td>
|
|
649
|
+
<td><span class="hg-typo-num">1.5</span></td>
|
|
650
|
+
<td>0.04em</td>
|
|
651
|
+
<td>—</td>
|
|
652
|
+
</tr>
|
|
653
|
+
<tr>
|
|
654
|
+
<td class="hg-typo-preview"><span class="hg-body-m">Aa Bb Cc 123</span></td>
|
|
655
|
+
<td><code>.hg-body-m</code></td>
|
|
656
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-light", Arial, Helvetica, sans-serif</span></td>
|
|
657
|
+
<td>100</td>
|
|
658
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
659
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
660
|
+
<td><span class="hg-typo-num">1.5</span></td>
|
|
661
|
+
<td>0.04em</td>
|
|
662
|
+
<td>—</td>
|
|
663
|
+
</tr>
|
|
664
|
+
<tr>
|
|
665
|
+
<td class="hg-typo-preview"><span class="hg-body-m-b">Aa Bb Cc 123</span></td>
|
|
666
|
+
<td><code>.hg-body-m-b</code></td>
|
|
667
|
+
<td><code>primary-regular</code> <span class="hg-typo-meta">"suisse-regular", Arial, Helvetica, sans-serif</span></td>
|
|
668
|
+
<td>300</td>
|
|
669
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
670
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
671
|
+
<td><span class="hg-typo-num">1.5</span></td>
|
|
672
|
+
<td>0.04em</td>
|
|
673
|
+
<td>—</td>
|
|
674
|
+
</tr>
|
|
675
|
+
<tr>
|
|
676
|
+
<td class="hg-typo-preview"><span class="label-m">Aa Bb Cc 123</span></td>
|
|
677
|
+
<td><code>.label-m</code></td>
|
|
678
|
+
<td><code>primary-light</code> <span class="hg-typo-meta">"suisse-light", Arial, Helvetica, sans-serif</span></td>
|
|
679
|
+
<td>100</td>
|
|
680
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
681
|
+
<td><span class="hg-typo-num">12px</span></td>
|
|
682
|
+
<td><span class="hg-typo-num">1</span></td>
|
|
683
|
+
<td>0.16em</td>
|
|
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>
|
|
718
|
+
</tr>
|
|
719
|
+
</tbody>
|
|
720
|
+
</table>
|
|
721
|
+
</div>
|
|
722
|
+
</section>
|
|
723
|
+
</div>
|
|
506
724
|
</div>
|
|
507
|
-
|
|
725
|
+
|
|
508
726
|
|
|
509
727
|
<div class="guide-section" id="spacing">
|
|
510
728
|
<div class="row mb-120">
|
|
@@ -525,608 +743,496 @@
|
|
|
525
743
|
<h3 class="title-m mb-16">Variables CSS</h3>
|
|
526
744
|
<p class="guide-section-description mb-24">Variables compartidas usadas por el spacing y el sistema.</p>
|
|
527
745
|
|
|
528
|
-
<div class="guide-
|
|
529
|
-
|
|
530
|
-
<
|
|
531
|
-
<
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
<
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
<
|
|
544
|
-
<
|
|
545
|
-
</
|
|
546
|
-
<
|
|
547
|
-
<
|
|
548
|
-
<
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
<
|
|
556
|
-
<
|
|
557
|
-
</
|
|
558
|
-
<
|
|
559
|
-
<
|
|
560
|
-
<
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
<
|
|
574
|
-
<
|
|
575
|
-
</
|
|
576
|
-
<
|
|
577
|
-
<
|
|
578
|
-
<
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
<
|
|
586
|
-
<
|
|
587
|
-
</
|
|
588
|
-
<
|
|
589
|
-
<
|
|
590
|
-
<
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
</
|
|
600
|
-
<
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
<
|
|
604
|
-
<
|
|
605
|
-
</
|
|
606
|
-
<
|
|
607
|
-
<
|
|
608
|
-
<
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
<
|
|
616
|
-
<
|
|
617
|
-
</
|
|
618
|
-
<
|
|
619
|
-
<
|
|
620
|
-
<
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
<
|
|
628
|
-
<
|
|
629
|
-
</
|
|
630
|
-
<
|
|
631
|
-
<
|
|
632
|
-
<
|
|
633
|
-
|
|
634
|
-
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
<
|
|
646
|
-
<
|
|
647
|
-
</
|
|
648
|
-
<
|
|
649
|
-
<
|
|
650
|
-
<
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
<
|
|
658
|
-
<
|
|
659
|
-
</
|
|
660
|
-
<
|
|
661
|
-
<
|
|
662
|
-
<
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
|
|
669
|
-
<
|
|
670
|
-
<
|
|
671
|
-
</
|
|
672
|
-
<
|
|
673
|
-
<
|
|
674
|
-
<
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
</
|
|
684
|
-
<
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
<
|
|
688
|
-
<
|
|
689
|
-
</
|
|
690
|
-
<
|
|
691
|
-
<
|
|
692
|
-
<
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
</
|
|
702
|
-
<
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
<
|
|
706
|
-
<
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
<
|
|
711
|
-
<
|
|
712
|
-
|
|
713
|
-
</
|
|
714
|
-
<
|
|
715
|
-
<
|
|
716
|
-
<
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
<
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
730
|
-
<
|
|
731
|
-
|
|
732
|
-
|
|
733
|
-
|
|
734
|
-
|
|
735
|
-
<
|
|
736
|
-
<
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
<
|
|
741
|
-
<
|
|
742
|
-
|
|
743
|
-
</
|
|
744
|
-
<
|
|
745
|
-
<
|
|
746
|
-
<
|
|
747
|
-
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
<
|
|
752
|
-
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
<
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
|
|
765
|
-
|
|
766
|
-
|
|
767
|
-
</
|
|
768
|
-
<
|
|
769
|
-
|
|
770
|
-
|
|
771
|
-
<
|
|
772
|
-
<
|
|
773
|
-
</
|
|
774
|
-
<
|
|
775
|
-
<
|
|
776
|
-
<
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
<
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
<
|
|
791
|
-
|
|
792
|
-
|
|
793
|
-
|
|
794
|
-
|
|
795
|
-
<
|
|
796
|
-
<
|
|
797
|
-
|
|
798
|
-
|
|
799
|
-
|
|
800
|
-
<
|
|
801
|
-
<
|
|
802
|
-
|
|
803
|
-
</
|
|
804
|
-
<
|
|
805
|
-
<
|
|
806
|
-
<
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
|
|
811
|
-
<
|
|
812
|
-
|
|
813
|
-
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
<
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
<
|
|
826
|
-
<
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
<
|
|
831
|
-
<
|
|
832
|
-
|
|
833
|
-
</
|
|
834
|
-
<
|
|
835
|
-
<
|
|
836
|
-
<
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
841
|
-
<
|
|
842
|
-
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
|
|
846
|
-
|
|
847
|
-
|
|
848
|
-
|
|
849
|
-
|
|
850
|
-
<
|
|
851
|
-
|
|
852
|
-
|
|
853
|
-
|
|
854
|
-
|
|
855
|
-
<
|
|
856
|
-
<
|
|
857
|
-
|
|
858
|
-
|
|
859
|
-
|
|
860
|
-
<
|
|
861
|
-
<
|
|
862
|
-
|
|
863
|
-
</
|
|
864
|
-
<
|
|
865
|
-
<
|
|
866
|
-
<
|
|
867
|
-
|
|
868
|
-
|
|
869
|
-
|
|
870
|
-
|
|
871
|
-
<
|
|
872
|
-
|
|
873
|
-
|
|
874
|
-
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
<
|
|
881
|
-
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
<
|
|
886
|
-
<
|
|
887
|
-
|
|
888
|
-
|
|
889
|
-
|
|
890
|
-
<
|
|
891
|
-
<
|
|
892
|
-
|
|
893
|
-
</
|
|
894
|
-
<
|
|
895
|
-
<
|
|
896
|
-
<
|
|
897
|
-
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
902
|
-
|
|
903
|
-
<
|
|
904
|
-
<
|
|
905
|
-
</
|
|
906
|
-
<
|
|
907
|
-
<
|
|
908
|
-
<
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
|
|
914
|
-
|
|
915
|
-
<
|
|
916
|
-
<
|
|
917
|
-
</
|
|
918
|
-
<
|
|
919
|
-
<
|
|
920
|
-
<
|
|
921
|
-
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
<
|
|
928
|
-
<
|
|
929
|
-
</
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
936
|
-
<
|
|
937
|
-
<
|
|
938
|
-
<
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
|
|
942
|
-
|
|
943
|
-
|
|
944
|
-
|
|
945
|
-
<
|
|
946
|
-
<
|
|
947
|
-
</
|
|
948
|
-
<
|
|
949
|
-
<
|
|
950
|
-
<
|
|
951
|
-
|
|
952
|
-
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
<
|
|
958
|
-
<
|
|
959
|
-
</
|
|
960
|
-
<
|
|
961
|
-
<
|
|
962
|
-
<
|
|
963
|
-
|
|
964
|
-
|
|
965
|
-
|
|
966
|
-
|
|
967
|
-
|
|
968
|
-
|
|
969
|
-
<
|
|
970
|
-
<
|
|
971
|
-
</
|
|
972
|
-
<
|
|
973
|
-
<
|
|
974
|
-
<
|
|
975
|
-
|
|
976
|
-
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
<
|
|
982
|
-
<
|
|
983
|
-
</
|
|
984
|
-
<
|
|
985
|
-
<
|
|
986
|
-
<
|
|
987
|
-
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
|
|
991
|
-
|
|
992
|
-
|
|
993
|
-
<
|
|
994
|
-
<
|
|
995
|
-
</
|
|
996
|
-
<
|
|
997
|
-
<
|
|
998
|
-
<
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
|
|
1004
|
-
|
|
1005
|
-
<
|
|
1006
|
-
<
|
|
1007
|
-
</
|
|
1008
|
-
<
|
|
1009
|
-
<
|
|
1010
|
-
<
|
|
1011
|
-
|
|
1012
|
-
|
|
1013
|
-
|
|
1014
|
-
|
|
1015
|
-
|
|
1016
|
-
|
|
1017
|
-
|
|
1018
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1019
|
-
</tr>
|
|
1020
|
-
<tr>
|
|
1021
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-mustard" title="Click para copiar --hg-color-mustard">--hg-color-mustard</td>
|
|
1022
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#FFE693" title="Click para copiar #FFE693">#FFE693</td>
|
|
1023
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1024
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1025
|
-
</tr>
|
|
1026
|
-
<tr>
|
|
1027
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-primary" title="Click para copiar --hg-color-primary">--hg-color-primary</td>
|
|
1028
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#000000" title="Click para copiar #000000">#000000</td>
|
|
1029
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1030
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1031
|
-
</tr>
|
|
1032
|
-
<tr>
|
|
1033
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-error" title="Click para copiar --hg-color-error">--hg-color-error</td>
|
|
1034
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#b40016" title="Click para copiar #b40016">#b40016</td>
|
|
1035
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1036
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1037
|
-
</tr>
|
|
1038
|
-
<tr>
|
|
1039
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-info" title="Click para copiar --hg-color-info">--hg-color-info</td>
|
|
1040
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#1a32a4" title="Click para copiar #1a32a4">#1a32a4</td>
|
|
1041
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1042
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1043
|
-
</tr>
|
|
1044
|
-
<tr>
|
|
1045
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-success" title="Click para copiar --hg-color-success">--hg-color-success</td>
|
|
1046
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#12882C" title="Click para copiar #12882C">#12882C</td>
|
|
1047
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1048
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1049
|
-
</tr>
|
|
1050
|
-
<tr>
|
|
1051
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-warning" title="Click para copiar --hg-color-warning">--hg-color-warning</td>
|
|
1052
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#ffc700" title="Click para copiar #ffc700">#ffc700</td>
|
|
1053
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1054
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1055
|
-
</tr>
|
|
1056
|
-
<tr>
|
|
1057
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-feel" title="Click para copiar --hg-color-feel">--hg-color-feel</td>
|
|
1058
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#fb9962" title="Click para copiar #fb9962">#fb9962</td>
|
|
1059
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1060
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1061
|
-
</tr>
|
|
1062
|
-
<tr>
|
|
1063
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-feel-dark" title="Click para copiar --hg-color-feel-dark">--hg-color-feel-dark</td>
|
|
1064
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#c94c07" title="Click para copiar #c94c07">#c94c07</td>
|
|
1065
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1066
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1067
|
-
</tr>
|
|
1068
|
-
<tr>
|
|
1069
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-special" title="Click para copiar --hg-color-special">--hg-color-special</td>
|
|
1070
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#b99d6b" title="Click para copiar #b99d6b">#b99d6b</td>
|
|
1071
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1072
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1073
|
-
</tr>
|
|
1074
|
-
<tr>
|
|
1075
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-vanilla" title="Click para copiar --hg-color-vanilla">--hg-color-vanilla</td>
|
|
1076
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#F4F2ED" title="Click para copiar #F4F2ED">#F4F2ED</td>
|
|
1077
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1078
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1079
|
-
</tr>
|
|
1080
|
-
<tr>
|
|
1081
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-silver" title="Click para copiar --hg-color-silver">--hg-color-silver</td>
|
|
1082
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#87888D" title="Click para copiar #87888D">#87888D</td>
|
|
1083
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1084
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1085
|
-
</tr>
|
|
1086
|
-
<tr>
|
|
1087
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-gold" title="Click para copiar --hg-color-gold">--hg-color-gold</td>
|
|
1088
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#A38A6B" title="Click para copiar #A38A6B">#A38A6B</td>
|
|
1089
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1090
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1091
|
-
</tr>
|
|
1092
|
-
<tr>
|
|
1093
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-platinum" title="Click para copiar --hg-color-platinum">--hg-color-platinum</td>
|
|
1094
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#5B7FA1" title="Click para copiar #5B7FA1">#5B7FA1</td>
|
|
1095
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1096
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1097
|
-
</tr>
|
|
1098
|
-
<tr>
|
|
1099
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-charcoal" title="Click para copiar --hg-color-charcoal">--hg-color-charcoal</td>
|
|
1100
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#1D1D1D" title="Click para copiar #1D1D1D">#1D1D1D</td>
|
|
1101
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1102
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1103
|
-
</tr>
|
|
1104
|
-
<tr>
|
|
1105
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-bg-light" title="Click para copiar --hg-color-bg-light">--hg-color-bg-light</td>
|
|
1106
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#F0F0F0" title="Click para copiar #F0F0F0">#F0F0F0</td>
|
|
1107
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1108
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1109
|
-
</tr>
|
|
1110
|
-
<tr>
|
|
1111
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-c-bg-light" title="Click para copiar --hg-color-c-bg-light">--hg-color-c-bg-light</td>
|
|
1112
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#000000" title="Click para copiar #000000">#000000</td>
|
|
1113
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1114
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1115
|
-
</tr>
|
|
1116
|
-
<tr>
|
|
1117
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-sk-grey" title="Click para copiar --hg-color-sk-grey">--hg-color-sk-grey</td>
|
|
1118
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#e3e3e3" title="Click para copiar #e3e3e3">#e3e3e3</td>
|
|
1119
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1120
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1121
|
-
</tr>
|
|
1122
|
-
<tr>
|
|
1123
|
-
<td class="guide-table-name guide-copyable " data-copy-value="--hg-color-bg-cream" title="Click para copiar --hg-color-bg-cream">--hg-color-bg-cream</td>
|
|
1124
|
-
<td class="guide-table-value guide-copyable " data-copy-value="#f4f2ed" title="Click para copiar #f4f2ed">#f4f2ed</td>
|
|
1125
|
-
<td class="guide-value-center-blue guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1126
|
-
<td class="guide-value-center-orange guide-copyable " data-copy-value="-" title="Click para copiar -">-</td>
|
|
1127
|
-
</tr>
|
|
1128
|
-
</tbody>
|
|
1129
|
-
</table>
|
|
746
|
+
<div class="guide-variables-grid">
|
|
747
|
+
|
|
748
|
+
<div class="guide-variables-group">
|
|
749
|
+
<h4 class="guide-variables-group-title">Font family <span class="guide-variables-group-count">(7)</span></h4>
|
|
750
|
+
<div class="guide-variables-group-list">
|
|
751
|
+
|
|
752
|
+
<div class="guide-variable-item">
|
|
753
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-family-primary-regular" title="Click para copiar --hg-typo-font-family-primary-regular">--hg-typo-font-family-primary-regular</span>
|
|
754
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="arial, sans-serif" title="Click para copiar arial, sans-serif">arial, sans-serif</span></span>
|
|
755
|
+
</div>
|
|
756
|
+
<div class="guide-variable-item">
|
|
757
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-family-secondary" title="Click para copiar --hg-typo-font-family-secondary">--hg-typo-font-family-secondary</span>
|
|
758
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value=""ms-serif", serif" title="Click para copiar "ms-serif", serif">"ms-serif", serif</span></span>
|
|
759
|
+
</div>
|
|
760
|
+
<div class="guide-variable-item">
|
|
761
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-family-serif" title="Click para copiar --hg-typo-font-family-serif">--hg-typo-font-family-serif</span>
|
|
762
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="'Playfair Display', 'Georgia', serif" title="Click para copiar 'Playfair Display', 'Georgia', serif">'Playfair Display', 'Georgia', serif</span></span>
|
|
763
|
+
</div>
|
|
764
|
+
<div class="guide-variable-item">
|
|
765
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-family-primary-regular" title="Click para copiar --hg-typo-font-family-primary-regular">--hg-typo-font-family-primary-regular</span>
|
|
766
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value=""Suisse Intl", Arial, Helvetica, sans-serif" title="Click para copiar "Suisse Intl", Arial, Helvetica, sans-serif">"Suisse Intl", Arial, Helvetica, sans-serif</span></span>
|
|
767
|
+
</div>
|
|
768
|
+
<div class="guide-variable-item">
|
|
769
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-family-primary-regular" title="Click para copiar --hg-typo-font-family-primary-regular">--hg-typo-font-family-primary-regular</span>
|
|
770
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value=""suisse-regular", Arial, Helvetica, sans-serif" title="Click para copiar "suisse-regular", Arial, Helvetica, sans-serif">"suisse-regular", Arial, Helvetica, sans-serif</span></span>
|
|
771
|
+
</div>
|
|
772
|
+
<div class="guide-variable-item">
|
|
773
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-family-primary-light" title="Click para copiar --hg-typo-font-family-primary-light">--hg-typo-font-family-primary-light</span>
|
|
774
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value=""suisse-light", Arial, Helvetica, sans-serif" title="Click para copiar "suisse-light", Arial, Helvetica, sans-serif">"suisse-light", Arial, Helvetica, sans-serif</span></span>
|
|
775
|
+
</div>
|
|
776
|
+
<div class="guide-variable-item">
|
|
777
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-family-primary-bold" title="Click para copiar --hg-typo-font-family-primary-bold">--hg-typo-font-family-primary-bold</span>
|
|
778
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value=""suisse-semibold", Arial, Helvetica, sans-serif" title="Click para copiar "suisse-semibold", Arial, Helvetica, sans-serif">"suisse-semibold", Arial, Helvetica, sans-serif</span></span>
|
|
779
|
+
</div>
|
|
780
|
+
</div>
|
|
781
|
+
</div>
|
|
782
|
+
<div class="guide-variables-group">
|
|
783
|
+
<h4 class="guide-variables-group-title">Font weight <span class="guide-variables-group-count">(7)</span></h4>
|
|
784
|
+
<div class="guide-variables-group-list">
|
|
785
|
+
|
|
786
|
+
<div class="guide-variable-item">
|
|
787
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-weight-100" title="Click para copiar --hg-typo-font-weight-100">--hg-typo-font-weight-100</span>
|
|
788
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="100" title="Click para copiar 100">100</span></span>
|
|
789
|
+
</div>
|
|
790
|
+
<div class="guide-variable-item">
|
|
791
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-weight-300" title="Click para copiar --hg-typo-font-weight-300">--hg-typo-font-weight-300</span>
|
|
792
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="300" title="Click para copiar 300">300</span></span>
|
|
793
|
+
</div>
|
|
794
|
+
<div class="guide-variable-item">
|
|
795
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-weight-400" title="Click para copiar --hg-typo-font-weight-400">--hg-typo-font-weight-400</span>
|
|
796
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="400" title="Click para copiar 400">400</span></span>
|
|
797
|
+
</div>
|
|
798
|
+
<div class="guide-variable-item">
|
|
799
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-weight-500" title="Click para copiar --hg-typo-font-weight-500">--hg-typo-font-weight-500</span>
|
|
800
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="500" title="Click para copiar 500">500</span></span>
|
|
801
|
+
</div>
|
|
802
|
+
<div class="guide-variable-item">
|
|
803
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-weight-600" title="Click para copiar --hg-typo-font-weight-600">--hg-typo-font-weight-600</span>
|
|
804
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="600" title="Click para copiar 600">600</span></span>
|
|
805
|
+
</div>
|
|
806
|
+
<div class="guide-variable-item">
|
|
807
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-weight-700" title="Click para copiar --hg-typo-font-weight-700">--hg-typo-font-weight-700</span>
|
|
808
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="700" title="Click para copiar 700">700</span></span>
|
|
809
|
+
</div>
|
|
810
|
+
<div class="guide-variable-item">
|
|
811
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-weight-900" title="Click para copiar --hg-typo-font-weight-900">--hg-typo-font-weight-900</span>
|
|
812
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="900" title="Click para copiar 900">900</span></span>
|
|
813
|
+
</div>
|
|
814
|
+
</div>
|
|
815
|
+
</div>
|
|
816
|
+
<div class="guide-variables-group">
|
|
817
|
+
<h4 class="guide-variables-group-title">Line height <span class="guide-variables-group-count">(8)</span></h4>
|
|
818
|
+
<div class="guide-variables-group-list">
|
|
819
|
+
|
|
820
|
+
<div class="guide-variable-item">
|
|
821
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-line-height-1" title="Click para copiar --hg-typo-line-height-1">--hg-typo-line-height-1</span>
|
|
822
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="1" title="Click para copiar 1">1</span></span>
|
|
823
|
+
</div>
|
|
824
|
+
<div class="guide-variable-item">
|
|
825
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-line-height-1-976" title="Click para copiar --hg-typo-line-height-1-976">--hg-typo-line-height-1-976</span>
|
|
826
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="1.976" title="Click para copiar 1.976">1.976</span></span>
|
|
827
|
+
</div>
|
|
828
|
+
<div class="guide-variable-item">
|
|
829
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-line-height-1-2" title="Click para copiar --hg-typo-line-height-1-2">--hg-typo-line-height-1-2</span>
|
|
830
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="1.2" title="Click para copiar 1.2">1.2</span></span>
|
|
831
|
+
</div>
|
|
832
|
+
<div class="guide-variable-item">
|
|
833
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-line-height-1-4" title="Click para copiar --hg-typo-line-height-1-4">--hg-typo-line-height-1-4</span>
|
|
834
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="1.4" title="Click para copiar 1.4">1.4</span></span>
|
|
835
|
+
</div>
|
|
836
|
+
<div class="guide-variable-item">
|
|
837
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-line-height-1-5" title="Click para copiar --hg-typo-line-height-1-5">--hg-typo-line-height-1-5</span>
|
|
838
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="1.5" title="Click para copiar 1.5">1.5</span></span>
|
|
839
|
+
</div>
|
|
840
|
+
<div class="guide-variable-item">
|
|
841
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-line-height-1-1" title="Click para copiar --hg-typo-line-height-1-1">--hg-typo-line-height-1-1</span>
|
|
842
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="1.1" title="Click para copiar 1.1">1.1</span></span>
|
|
843
|
+
</div>
|
|
844
|
+
<div class="guide-variable-item">
|
|
845
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-line-height-1-3" title="Click para copiar --hg-typo-line-height-1-3">--hg-typo-line-height-1-3</span>
|
|
846
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="1.3" title="Click para copiar 1.3">1.3</span></span>
|
|
847
|
+
</div>
|
|
848
|
+
<div class="guide-variable-item">
|
|
849
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-line-height-1-6" title="Click para copiar --hg-typo-line-height-1-6">--hg-typo-line-height-1-6</span>
|
|
850
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="1.6" title="Click para copiar 1.6">1.6</span></span>
|
|
851
|
+
</div>
|
|
852
|
+
</div>
|
|
853
|
+
</div>
|
|
854
|
+
<div class="guide-variables-group">
|
|
855
|
+
<h4 class="guide-variables-group-title">Letter spacing <span class="guide-variables-group-count">(10)</span></h4>
|
|
856
|
+
<div class="guide-variables-group-list">
|
|
857
|
+
|
|
858
|
+
<div class="guide-variable-item">
|
|
859
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-letter-spacing-0" title="Click para copiar --hg-typo-letter-spacing-0">--hg-typo-letter-spacing-0</span>
|
|
860
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="0" title="Click para copiar 0">0</span></span>
|
|
861
|
+
</div>
|
|
862
|
+
<div class="guide-variable-item">
|
|
863
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-letter-spacing-0" title="Click para copiar --hg-typo-letter-spacing-0">--hg-typo-letter-spacing-0</span>
|
|
864
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="0rem" title="Click para copiar 0rem">0rem</span></span>
|
|
865
|
+
</div>
|
|
866
|
+
<div class="guide-variable-item">
|
|
867
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-letter-spacing-0-02" title="Click para copiar --hg-typo-letter-spacing-0-02">--hg-typo-letter-spacing-0-02</span>
|
|
868
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="0.02rem" title="Click para copiar 0.02rem">0.02rem</span></span>
|
|
869
|
+
</div>
|
|
870
|
+
<div class="guide-variable-item">
|
|
871
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-letter-spacing-0-05" title="Click para copiar --hg-typo-letter-spacing-0-05">--hg-typo-letter-spacing-0-05</span>
|
|
872
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="0.05rem" title="Click para copiar 0.05rem">0.05rem</span></span>
|
|
873
|
+
</div>
|
|
874
|
+
<div class="guide-variable-item">
|
|
875
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-letter-spacing-0-08" title="Click para copiar --hg-typo-letter-spacing-0-08">--hg-typo-letter-spacing-0-08</span>
|
|
876
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="0.08rem" title="Click para copiar 0.08rem">0.08rem</span></span>
|
|
877
|
+
</div>
|
|
878
|
+
<div class="guide-variable-item">
|
|
879
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-letter-spacing-10" title="Click para copiar --hg-typo-letter-spacing-10">--hg-typo-letter-spacing-10</span>
|
|
880
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="10rem" title="Click para copiar 10rem">10rem</span></span>
|
|
881
|
+
</div>
|
|
882
|
+
<div class="guide-variable-item">
|
|
883
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-letter-spacing-110" title="Click para copiar --hg-typo-letter-spacing-110">--hg-typo-letter-spacing-110</span>
|
|
884
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="110rem" title="Click para copiar 110rem">110rem</span></span>
|
|
885
|
+
</div>
|
|
886
|
+
<div class="guide-variable-item">
|
|
887
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-letter-spacing-0-16em" title="Click para copiar --hg-typo-letter-spacing-0-16em">--hg-typo-letter-spacing-0-16em</span>
|
|
888
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="0.16em" title="Click para copiar 0.16em">0.16em</span></span>
|
|
889
|
+
</div>
|
|
890
|
+
<div class="guide-variable-item">
|
|
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>
|
|
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>
|
|
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>
|
|
898
|
+
</div>
|
|
899
|
+
</div>
|
|
900
|
+
<div class="guide-variables-group">
|
|
901
|
+
<h4 class="guide-variables-group-title">Text transform <span class="guide-variables-group-count">(3)</span></h4>
|
|
902
|
+
<div class="guide-variables-group-list">
|
|
903
|
+
|
|
904
|
+
<div class="guide-variable-item">
|
|
905
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-text-transform-none" title="Click para copiar --hg-typo-text-transform-none">--hg-typo-text-transform-none</span>
|
|
906
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="none" title="Click para copiar none">none</span></span>
|
|
907
|
+
</div>
|
|
908
|
+
<div class="guide-variable-item">
|
|
909
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-text-transform-uppercase" title="Click para copiar --hg-typo-text-transform-uppercase">--hg-typo-text-transform-uppercase</span>
|
|
910
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="uppercase" title="Click para copiar uppercase">uppercase</span></span>
|
|
911
|
+
</div>
|
|
912
|
+
<div class="guide-variable-item">
|
|
913
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-text-transform-otro" title="Click para copiar --hg-typo-text-transform-otro">--hg-typo-text-transform-otro</span>
|
|
914
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="otro" title="Click para copiar otro">otro</span></span>
|
|
915
|
+
</div>
|
|
916
|
+
</div>
|
|
917
|
+
</div>
|
|
918
|
+
<div class="guide-variables-group">
|
|
919
|
+
<h4 class="guide-variables-group-title">Font size <span class="guide-variables-group-count">(12)</span></h4>
|
|
920
|
+
<div class="guide-variables-group-list">
|
|
921
|
+
|
|
922
|
+
<div class="guide-variable-item">
|
|
923
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-size-18" title="Click para copiar --hg-typo-font-size-18">--hg-typo-font-size-18</span>
|
|
924
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="1.125rem" title="Click para copiar 1.125rem">1.125rem</span>
|
|
925
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="18px" title="Click para copiar 18px">18px</span></span>
|
|
926
|
+
</div>
|
|
927
|
+
<div class="guide-variable-item">
|
|
928
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-size-24" title="Click para copiar --hg-typo-font-size-24">--hg-typo-font-size-24</span>
|
|
929
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="1.5rem" title="Click para copiar 1.5rem">1.5rem</span>
|
|
930
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="24px" title="Click para copiar 24px">24px</span></span>
|
|
931
|
+
</div>
|
|
932
|
+
<div class="guide-variable-item">
|
|
933
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-size-14" title="Click para copiar --hg-typo-font-size-14">--hg-typo-font-size-14</span>
|
|
934
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="0.875rem" title="Click para copiar 0.875rem">0.875rem</span>
|
|
935
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="14px" title="Click para copiar 14px">14px</span></span>
|
|
936
|
+
</div>
|
|
937
|
+
<div class="guide-variable-item">
|
|
938
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-size-12" title="Click para copiar --hg-typo-font-size-12">--hg-typo-font-size-12</span>
|
|
939
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="0.75rem" title="Click para copiar 0.75rem">0.75rem</span>
|
|
940
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="12px" title="Click para copiar 12px">12px</span></span>
|
|
941
|
+
</div>
|
|
942
|
+
<div class="guide-variable-item">
|
|
943
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-size-16" title="Click para copiar --hg-typo-font-size-16">--hg-typo-font-size-16</span>
|
|
944
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="1rem" title="Click para copiar 1rem">1rem</span>
|
|
945
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="16px" title="Click para copiar 16px">16px</span></span>
|
|
946
|
+
</div>
|
|
947
|
+
<div class="guide-variable-item">
|
|
948
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-size-20" title="Click para copiar --hg-typo-font-size-20">--hg-typo-font-size-20</span>
|
|
949
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="1.25rem" title="Click para copiar 1.25rem">1.25rem</span>
|
|
950
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="20px" title="Click para copiar 20px">20px</span></span>
|
|
951
|
+
</div>
|
|
952
|
+
<div class="guide-variable-item">
|
|
953
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-size-13" title="Click para copiar --hg-typo-font-size-13">--hg-typo-font-size-13</span>
|
|
954
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="0.8125rem" title="Click para copiar 0.8125rem">0.8125rem</span>
|
|
955
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="13px" title="Click para copiar 13px">13px</span></span>
|
|
956
|
+
</div>
|
|
957
|
+
<div class="guide-variable-item">
|
|
958
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-size-10" title="Click para copiar --hg-typo-font-size-10">--hg-typo-font-size-10</span>
|
|
959
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="0.625rem" title="Click para copiar 0.625rem">0.625rem</span>
|
|
960
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="10px" title="Click para copiar 10px">10px</span></span>
|
|
961
|
+
</div>
|
|
962
|
+
<div class="guide-variable-item">
|
|
963
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-size-8" title="Click para copiar --hg-typo-font-size-8">--hg-typo-font-size-8</span>
|
|
964
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="0.5rem" title="Click para copiar 0.5rem">0.5rem</span>
|
|
965
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="8px" title="Click para copiar 8px">8px</span></span>
|
|
966
|
+
</div>
|
|
967
|
+
<div class="guide-variable-item">
|
|
968
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-size-32" title="Click para copiar --hg-typo-font-size-32">--hg-typo-font-size-32</span>
|
|
969
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="2rem" title="Click para copiar 2rem">2rem</span>
|
|
970
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="32px" title="Click para copiar 32px">32px</span></span>
|
|
971
|
+
</div>
|
|
972
|
+
<div class="guide-variable-item">
|
|
973
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-size-48" title="Click para copiar --hg-typo-font-size-48">--hg-typo-font-size-48</span>
|
|
974
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="3rem" title="Click para copiar 3rem">3rem</span>
|
|
975
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="48px" title="Click para copiar 48px">48px</span></span>
|
|
976
|
+
</div>
|
|
977
|
+
<div class="guide-variable-item">
|
|
978
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-typo-font-size-9" title="Click para copiar --hg-typo-font-size-9">--hg-typo-font-size-9</span>
|
|
979
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="0.5625rem" title="Click para copiar 0.5625rem">0.5625rem</span>
|
|
980
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="9px" title="Click para copiar 9px">9px</span></span>
|
|
981
|
+
</div>
|
|
982
|
+
</div>
|
|
983
|
+
</div>
|
|
984
|
+
<div class="guide-variables-group">
|
|
985
|
+
<h4 class="guide-variables-group-title">Spacing <span class="guide-variables-group-count">(34)</span></h4>
|
|
986
|
+
<div class="guide-variables-group-list">
|
|
987
|
+
|
|
988
|
+
<div class="guide-variable-item">
|
|
989
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-0" title="Click para copiar --hg-spacing-0">--hg-spacing-0</span>
|
|
990
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="0" title="Click para copiar 0">0</span></span>
|
|
991
|
+
</div>
|
|
992
|
+
<div class="guide-variable-item">
|
|
993
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-4" title="Click para copiar --hg-spacing-4">--hg-spacing-4</span>
|
|
994
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="0.25rem" title="Click para copiar 0.25rem">0.25rem</span>
|
|
995
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="4px" title="Click para copiar 4px">4px</span></span>
|
|
996
|
+
</div>
|
|
997
|
+
<div class="guide-variable-item">
|
|
998
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-8" title="Click para copiar --hg-spacing-8">--hg-spacing-8</span>
|
|
999
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="0.5rem" title="Click para copiar 0.5rem">0.5rem</span>
|
|
1000
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="8px" title="Click para copiar 8px">8px</span></span>
|
|
1001
|
+
</div>
|
|
1002
|
+
<div class="guide-variable-item">
|
|
1003
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-12" title="Click para copiar --hg-spacing-12">--hg-spacing-12</span>
|
|
1004
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="0.75rem" title="Click para copiar 0.75rem">0.75rem</span>
|
|
1005
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="12px" title="Click para copiar 12px">12px</span></span>
|
|
1006
|
+
</div>
|
|
1007
|
+
<div class="guide-variable-item">
|
|
1008
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-16" title="Click para copiar --hg-spacing-16">--hg-spacing-16</span>
|
|
1009
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="1rem" title="Click para copiar 1rem">1rem</span>
|
|
1010
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="16px" title="Click para copiar 16px">16px</span></span>
|
|
1011
|
+
</div>
|
|
1012
|
+
<div class="guide-variable-item">
|
|
1013
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-20" title="Click para copiar --hg-spacing-20">--hg-spacing-20</span>
|
|
1014
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="1.25rem" title="Click para copiar 1.25rem">1.25rem</span>
|
|
1015
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="20px" title="Click para copiar 20px">20px</span></span>
|
|
1016
|
+
</div>
|
|
1017
|
+
<div class="guide-variable-item">
|
|
1018
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-24" title="Click para copiar --hg-spacing-24">--hg-spacing-24</span>
|
|
1019
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="1.5rem" title="Click para copiar 1.5rem">1.5rem</span>
|
|
1020
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="24px" title="Click para copiar 24px">24px</span></span>
|
|
1021
|
+
</div>
|
|
1022
|
+
<div class="guide-variable-item">
|
|
1023
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-32" title="Click para copiar --hg-spacing-32">--hg-spacing-32</span>
|
|
1024
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="2rem" title="Click para copiar 2rem">2rem</span>
|
|
1025
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="32px" title="Click para copiar 32px">32px</span></span>
|
|
1026
|
+
</div>
|
|
1027
|
+
<div class="guide-variable-item">
|
|
1028
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-36" title="Click para copiar --hg-spacing-36">--hg-spacing-36</span>
|
|
1029
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="2.25rem" title="Click para copiar 2.25rem">2.25rem</span>
|
|
1030
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="36px" title="Click para copiar 36px">36px</span></span>
|
|
1031
|
+
</div>
|
|
1032
|
+
<div class="guide-variable-item">
|
|
1033
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-40" title="Click para copiar --hg-spacing-40">--hg-spacing-40</span>
|
|
1034
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="2.5rem" title="Click para copiar 2.5rem">2.5rem</span>
|
|
1035
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="40px" title="Click para copiar 40px">40px</span></span>
|
|
1036
|
+
</div>
|
|
1037
|
+
<div class="guide-variable-item">
|
|
1038
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-48" title="Click para copiar --hg-spacing-48">--hg-spacing-48</span>
|
|
1039
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="3rem" title="Click para copiar 3rem">3rem</span>
|
|
1040
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="48px" title="Click para copiar 48px">48px</span></span>
|
|
1041
|
+
</div>
|
|
1042
|
+
<div class="guide-variable-item">
|
|
1043
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-56" title="Click para copiar --hg-spacing-56">--hg-spacing-56</span>
|
|
1044
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="3.5rem" title="Click para copiar 3.5rem">3.5rem</span>
|
|
1045
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="56px" title="Click para copiar 56px">56px</span></span>
|
|
1046
|
+
</div>
|
|
1047
|
+
<div class="guide-variable-item">
|
|
1048
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-64" title="Click para copiar --hg-spacing-64">--hg-spacing-64</span>
|
|
1049
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="4rem" title="Click para copiar 4rem">4rem</span>
|
|
1050
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="64px" title="Click para copiar 64px">64px</span></span>
|
|
1051
|
+
</div>
|
|
1052
|
+
<div class="guide-variable-item">
|
|
1053
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-72" title="Click para copiar --hg-spacing-72">--hg-spacing-72</span>
|
|
1054
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="4.5rem" title="Click para copiar 4.5rem">4.5rem</span>
|
|
1055
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="72px" title="Click para copiar 72px">72px</span></span>
|
|
1056
|
+
</div>
|
|
1057
|
+
<div class="guide-variable-item">
|
|
1058
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-80" title="Click para copiar --hg-spacing-80">--hg-spacing-80</span>
|
|
1059
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="5rem" title="Click para copiar 5rem">5rem</span>
|
|
1060
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="80px" title="Click para copiar 80px">80px</span></span>
|
|
1061
|
+
</div>
|
|
1062
|
+
<div class="guide-variable-item">
|
|
1063
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-88" title="Click para copiar --hg-spacing-88">--hg-spacing-88</span>
|
|
1064
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="5.5rem" title="Click para copiar 5.5rem">5.5rem</span>
|
|
1065
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="88px" title="Click para copiar 88px">88px</span></span>
|
|
1066
|
+
</div>
|
|
1067
|
+
<div class="guide-variable-item">
|
|
1068
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-96" title="Click para copiar --hg-spacing-96">--hg-spacing-96</span>
|
|
1069
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="6rem" title="Click para copiar 6rem">6rem</span>
|
|
1070
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="96px" title="Click para copiar 96px">96px</span></span>
|
|
1071
|
+
</div>
|
|
1072
|
+
<div class="guide-variable-item">
|
|
1073
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-104" title="Click para copiar --hg-spacing-104">--hg-spacing-104</span>
|
|
1074
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="6.5rem" title="Click para copiar 6.5rem">6.5rem</span>
|
|
1075
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="104px" title="Click para copiar 104px">104px</span></span>
|
|
1076
|
+
</div>
|
|
1077
|
+
<div class="guide-variable-item">
|
|
1078
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-112" title="Click para copiar --hg-spacing-112">--hg-spacing-112</span>
|
|
1079
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="7rem" title="Click para copiar 7rem">7rem</span>
|
|
1080
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="112px" title="Click para copiar 112px">112px</span></span>
|
|
1081
|
+
</div>
|
|
1082
|
+
<div class="guide-variable-item">
|
|
1083
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-120" title="Click para copiar --hg-spacing-120">--hg-spacing-120</span>
|
|
1084
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="7.5rem" title="Click para copiar 7.5rem">7.5rem</span>
|
|
1085
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="120px" title="Click para copiar 120px">120px</span></span>
|
|
1086
|
+
</div>
|
|
1087
|
+
<div class="guide-variable-item">
|
|
1088
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-128" title="Click para copiar --hg-spacing-128">--hg-spacing-128</span>
|
|
1089
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="8rem" title="Click para copiar 8rem">8rem</span>
|
|
1090
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="128px" title="Click para copiar 128px">128px</span></span>
|
|
1091
|
+
</div>
|
|
1092
|
+
<div class="guide-variable-item">
|
|
1093
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-136" title="Click para copiar --hg-spacing-136">--hg-spacing-136</span>
|
|
1094
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="8.5rem" title="Click para copiar 8.5rem">8.5rem</span>
|
|
1095
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="136px" title="Click para copiar 136px">136px</span></span>
|
|
1096
|
+
</div>
|
|
1097
|
+
<div class="guide-variable-item">
|
|
1098
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-144" title="Click para copiar --hg-spacing-144">--hg-spacing-144</span>
|
|
1099
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="9rem" title="Click para copiar 9rem">9rem</span>
|
|
1100
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="144px" title="Click para copiar 144px">144px</span></span>
|
|
1101
|
+
</div>
|
|
1102
|
+
<div class="guide-variable-item">
|
|
1103
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-152" title="Click para copiar --hg-spacing-152">--hg-spacing-152</span>
|
|
1104
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="9.5rem" title="Click para copiar 9.5rem">9.5rem</span>
|
|
1105
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="152px" title="Click para copiar 152px">152px</span></span>
|
|
1106
|
+
</div>
|
|
1107
|
+
<div class="guide-variable-item">
|
|
1108
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-160" title="Click para copiar --hg-spacing-160">--hg-spacing-160</span>
|
|
1109
|
+
<span class="guide-variable-values"><span class="guide-value-center-blue guide-copyable " data-copy-value="10rem" title="Click para copiar 10rem">10rem</span>
|
|
1110
|
+
<span class="guide-value-center-orange guide-copyable " data-copy-value="160px" title="Click para copiar 160px">160px</span></span>
|
|
1111
|
+
</div>
|
|
1112
|
+
<div class="guide-variable-item">
|
|
1113
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-20-percent" title="Click para copiar --hg-spacing-20-percent">--hg-spacing-20-percent</span>
|
|
1114
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="20%" title="Click para copiar 20%">20%</span></span>
|
|
1115
|
+
</div>
|
|
1116
|
+
<div class="guide-variable-item">
|
|
1117
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-25-percent" title="Click para copiar --hg-spacing-25-percent">--hg-spacing-25-percent</span>
|
|
1118
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="25%" title="Click para copiar 25%">25%</span></span>
|
|
1119
|
+
</div>
|
|
1120
|
+
<div class="guide-variable-item">
|
|
1121
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-33-percent" title="Click para copiar --hg-spacing-33-percent">--hg-spacing-33-percent</span>
|
|
1122
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="33.333333%" title="Click para copiar 33.333333%">33.333333%</span></span>
|
|
1123
|
+
</div>
|
|
1124
|
+
<div class="guide-variable-item">
|
|
1125
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-40-percent" title="Click para copiar --hg-spacing-40-percent">--hg-spacing-40-percent</span>
|
|
1126
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="40%" title="Click para copiar 40%">40%</span></span>
|
|
1127
|
+
</div>
|
|
1128
|
+
<div class="guide-variable-item">
|
|
1129
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-50-percent" title="Click para copiar --hg-spacing-50-percent">--hg-spacing-50-percent</span>
|
|
1130
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="50%" title="Click para copiar 50%">50%</span></span>
|
|
1131
|
+
</div>
|
|
1132
|
+
<div class="guide-variable-item">
|
|
1133
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-60-percent" title="Click para copiar --hg-spacing-60-percent">--hg-spacing-60-percent</span>
|
|
1134
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="60%" title="Click para copiar 60%">60%</span></span>
|
|
1135
|
+
</div>
|
|
1136
|
+
<div class="guide-variable-item">
|
|
1137
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-66-percent" title="Click para copiar --hg-spacing-66-percent">--hg-spacing-66-percent</span>
|
|
1138
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="66.666667%" title="Click para copiar 66.666667%">66.666667%</span></span>
|
|
1139
|
+
</div>
|
|
1140
|
+
<div class="guide-variable-item">
|
|
1141
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-75-percent" title="Click para copiar --hg-spacing-75-percent">--hg-spacing-75-percent</span>
|
|
1142
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="75%" title="Click para copiar 75%">75%</span></span>
|
|
1143
|
+
</div>
|
|
1144
|
+
<div class="guide-variable-item">
|
|
1145
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-spacing-100-percent" title="Click para copiar --hg-spacing-100-percent">--hg-spacing-100-percent</span>
|
|
1146
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="100%" title="Click para copiar 100%">100%</span></span>
|
|
1147
|
+
</div>
|
|
1148
|
+
</div>
|
|
1149
|
+
</div>
|
|
1150
|
+
<div class="guide-variables-group">
|
|
1151
|
+
<h4 class="guide-variables-group-title">Color <span class="guide-variables-group-count">(20)</span></h4>
|
|
1152
|
+
<div class="guide-variables-group-list">
|
|
1153
|
+
|
|
1154
|
+
<div class="guide-variable-item">
|
|
1155
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-white" title="Click para copiar --hg-color-white">--hg-color-white</span>
|
|
1156
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#ffffff" title="Click para copiar #ffffff">#ffffff</span><span class="guide-variable-swatch" style="background:#ffffff" title="#ffffff"></span></span>
|
|
1157
|
+
</div>
|
|
1158
|
+
<div class="guide-variable-item">
|
|
1159
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-black" title="Click para copiar --hg-color-black">--hg-color-black</span>
|
|
1160
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#000000" title="Click para copiar #000000">#000000</span><span class="guide-variable-swatch" style="background:#000000" title="#000000"></span></span>
|
|
1161
|
+
</div>
|
|
1162
|
+
<div class="guide-variable-item">
|
|
1163
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-dark-grey" title="Click para copiar --hg-color-dark-grey">--hg-color-dark-grey</span>
|
|
1164
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#737373" title="Click para copiar #737373">#737373</span><span class="guide-variable-swatch" style="background:#737373" title="#737373"></span></span>
|
|
1165
|
+
</div>
|
|
1166
|
+
<div class="guide-variable-item">
|
|
1167
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-middle-grey" title="Click para copiar --hg-color-middle-grey">--hg-color-middle-grey</span>
|
|
1168
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#a9a9a9" title="Click para copiar #a9a9a9">#a9a9a9</span><span class="guide-variable-swatch" style="background:#a9a9a9" title="#a9a9a9"></span></span>
|
|
1169
|
+
</div>
|
|
1170
|
+
<div class="guide-variable-item">
|
|
1171
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-light-grey" title="Click para copiar --hg-color-light-grey">--hg-color-light-grey</span>
|
|
1172
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#F9F9F9" title="Click para copiar #F9F9F9">#F9F9F9</span><span class="guide-variable-swatch" style="background:#F9F9F9" title="#F9F9F9"></span></span>
|
|
1173
|
+
</div>
|
|
1174
|
+
<div class="guide-variable-item">
|
|
1175
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-grey-ultra" title="Click para copiar --hg-color-grey-ultra">--hg-color-grey-ultra</span>
|
|
1176
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#2F2F2F" title="Click para copiar #2F2F2F">#2F2F2F</span><span class="guide-variable-swatch" style="background:#2F2F2F" title="#2F2F2F"></span></span>
|
|
1177
|
+
</div>
|
|
1178
|
+
<div class="guide-variable-item">
|
|
1179
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-orange" title="Click para copiar --hg-color-orange">--hg-color-orange</span>
|
|
1180
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#B75D0B" title="Click para copiar #B75D0B">#B75D0B</span><span class="guide-variable-swatch" style="background:#B75D0B" title="#B75D0B"></span></span>
|
|
1181
|
+
</div>
|
|
1182
|
+
<div class="guide-variable-item">
|
|
1183
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-mustard" title="Click para copiar --hg-color-mustard">--hg-color-mustard</span>
|
|
1184
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#FFE693" title="Click para copiar #FFE693">#FFE693</span><span class="guide-variable-swatch" style="background:#FFE693" title="#FFE693"></span></span>
|
|
1185
|
+
</div>
|
|
1186
|
+
<div class="guide-variable-item">
|
|
1187
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-primary" title="Click para copiar --hg-color-primary">--hg-color-primary</span>
|
|
1188
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#000000" title="Click para copiar #000000">#000000</span><span class="guide-variable-swatch" style="background:#000000" title="#000000"></span></span>
|
|
1189
|
+
</div>
|
|
1190
|
+
<div class="guide-variable-item">
|
|
1191
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-error" title="Click para copiar --hg-color-error">--hg-color-error</span>
|
|
1192
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#dd2d01" title="Click para copiar #dd2d01">#dd2d01</span><span class="guide-variable-swatch" style="background:#dd2d01" title="#dd2d01"></span></span>
|
|
1193
|
+
</div>
|
|
1194
|
+
<div class="guide-variable-item">
|
|
1195
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-info" title="Click para copiar --hg-color-info">--hg-color-info</span>
|
|
1196
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#2037a6" title="Click para copiar #2037a6">#2037a6</span><span class="guide-variable-swatch" style="background:#2037a6" title="#2037a6"></span></span>
|
|
1197
|
+
</div>
|
|
1198
|
+
<div class="guide-variable-item">
|
|
1199
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-success" title="Click para copiar --hg-color-success">--hg-color-success</span>
|
|
1200
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#12882C" title="Click para copiar #12882C">#12882C</span><span class="guide-variable-swatch" style="background:#12882C" title="#12882C"></span></span>
|
|
1201
|
+
</div>
|
|
1202
|
+
<div class="guide-variable-item">
|
|
1203
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-warning" title="Click para copiar --hg-color-warning">--hg-color-warning</span>
|
|
1204
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#ffce4e" title="Click para copiar #ffce4e">#ffce4e</span><span class="guide-variable-swatch" style="background:#ffce4e" title="#ffce4e"></span></span>
|
|
1205
|
+
</div>
|
|
1206
|
+
<div class="guide-variable-item">
|
|
1207
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-feel" title="Click para copiar --hg-color-feel">--hg-color-feel</span>
|
|
1208
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#fb9962" title="Click para copiar #fb9962">#fb9962</span><span class="guide-variable-swatch" style="background:#fb9962" title="#fb9962"></span></span>
|
|
1209
|
+
</div>
|
|
1210
|
+
<div class="guide-variable-item">
|
|
1211
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-feel-dark" title="Click para copiar --hg-color-feel-dark">--hg-color-feel-dark</span>
|
|
1212
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#c94c07" title="Click para copiar #c94c07">#c94c07</span><span class="guide-variable-swatch" style="background:#c94c07" title="#c94c07"></span></span>
|
|
1213
|
+
</div>
|
|
1214
|
+
<div class="guide-variable-item">
|
|
1215
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-silver" title="Click para copiar --hg-color-silver">--hg-color-silver</span>
|
|
1216
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#87888D" title="Click para copiar #87888D">#87888D</span><span class="guide-variable-swatch" style="background:#87888D" title="#87888D"></span></span>
|
|
1217
|
+
</div>
|
|
1218
|
+
<div class="guide-variable-item">
|
|
1219
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-gold" title="Click para copiar --hg-color-gold">--hg-color-gold</span>
|
|
1220
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#A38A6B" title="Click para copiar #A38A6B">#A38A6B</span><span class="guide-variable-swatch" style="background:#A38A6B" title="#A38A6B"></span></span>
|
|
1221
|
+
</div>
|
|
1222
|
+
<div class="guide-variable-item">
|
|
1223
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-platinum" title="Click para copiar --hg-color-platinum">--hg-color-platinum</span>
|
|
1224
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#5B7FA1" title="Click para copiar #5B7FA1">#5B7FA1</span><span class="guide-variable-swatch" style="background:#5B7FA1" title="#5B7FA1"></span></span>
|
|
1225
|
+
</div>
|
|
1226
|
+
<div class="guide-variable-item">
|
|
1227
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-bg-light" title="Click para copiar --hg-color-bg-light">--hg-color-bg-light</span>
|
|
1228
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#f9f9f9" title="Click para copiar #f9f9f9">#f9f9f9</span><span class="guide-variable-swatch" style="background:#f9f9f9" title="#f9f9f9"></span></span>
|
|
1229
|
+
</div>
|
|
1230
|
+
<div class="guide-variable-item">
|
|
1231
|
+
<span class="guide-variable-name guide-copyable " data-copy-value="--hg-color-bg-cream" title="Click para copiar --hg-color-bg-cream">--hg-color-bg-cream</span>
|
|
1232
|
+
<span class="guide-variable-values"><span class="guide-variable-value guide-copyable " data-copy-value="#f4f2ed" title="Click para copiar #f4f2ed">#f4f2ed</span><span class="guide-variable-swatch" style="background:#f4f2ed" title="#f4f2ed"></span></span>
|
|
1233
|
+
</div>
|
|
1234
|
+
</div>
|
|
1235
|
+
</div>
|
|
1130
1236
|
</div>
|
|
1131
1237
|
</div>
|
|
1132
1238
|
<div class="guide-info-box guide-info-box-warning mb-32">
|
|
@@ -2646,6 +2752,18 @@
|
|
|
2646
2752
|
<td class="guide-layout-property">text-align: justify</td>
|
|
2647
2753
|
<td class="guide-layout-property">Alineación del texto</td>
|
|
2648
2754
|
</tr>
|
|
2755
|
+
<tr>
|
|
2756
|
+
<td class="guide-layout-class-name guide-copyable" data-copy-value=".hg-text-underline" title="Click para copiar .hg-text-underline">.hg-text-underline</td>
|
|
2757
|
+
<td class="guide-layout-class-name " >-</td>
|
|
2758
|
+
<td class="guide-layout-property">text-decoration: underline</td>
|
|
2759
|
+
<td class="guide-layout-property">Decoración del texto (subrayado, etc.)</td>
|
|
2760
|
+
</tr>
|
|
2761
|
+
<tr>
|
|
2762
|
+
<td class="guide-layout-class-name guide-copyable" data-copy-value=".hg-text-none" title="Click para copiar .hg-text-none">.hg-text-none</td>
|
|
2763
|
+
<td class="guide-layout-class-name " >-</td>
|
|
2764
|
+
<td class="guide-layout-property">text-decoration: none</td>
|
|
2765
|
+
<td class="guide-layout-property">Decoración del texto (subrayado, etc.)</td>
|
|
2766
|
+
</tr>
|
|
2649
2767
|
<tr>
|
|
2650
2768
|
<td class="guide-layout-class-name guide-copyable" data-copy-value=".hg-position-static" title="Click para copiar .hg-position-static">.hg-position-static</td>
|
|
2651
2769
|
<td class="guide-layout-class-name guide-copyable" data-copy-value=".md:hg-position-static" title="Click para copiar .md:hg-position-static">.md:hg-position-static</td>
|
|
@@ -3471,7 +3589,7 @@
|
|
|
3471
3589
|
<div class="col-xs-12 col-md-6"> <h2>Containers</h2> </div>
|
|
3472
3590
|
<div class="col-xs-12 col-md-6 guide-section-description">
|
|
3473
3591
|
<p>
|
|
3474
|
-
Contenedores responsivos
|
|
3592
|
+
Contenedores responsivos de los temas activos. Cada container define un <code>max-width</code> y padding adaptativo según breakpoint.
|
|
3475
3593
|
</p>
|
|
3476
3594
|
</div>
|
|
3477
3595
|
<div class="col-xs-12 col-md-12"><hr></div>
|