energy-foundations 2.4.0 → 2.5.0-beta.0
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 +10 -0
- package/dist/energy-foundations.css +1 -1
- package/dist/generated/icon-layers.js +1 -1
- package/dist/generated/icon-layers.ts +1 -1
- package/dist/generated/icon-names.js +1 -1
- package/dist/generated/icon-names.ts +1 -1
- package/dist/index.css +213 -17
- package/dist/mixins/_typography.scss +19 -4
- package/dist/style.css +213 -17
- package/dist/variables/_typography.scss +7 -7
- package/dist/variables.css +5 -5
- package/llms/00-installation.md +125 -55
- package/llms/01-classes.md +18 -20
- package/llms/02-css-variables.md +5 -5
- package/llms/04-layouts.md +340 -0
- package/llms/index.md +3 -0
- package/package.json +5 -4
- package/src/generated/icon-layers.js +1 -1
- package/src/generated/icon-layers.ts +1 -1
- package/src/generated/icon-names.js +1 -1
- package/src/generated/icon-names.ts +1 -1
- package/src/mixins/_typography.scss +19 -4
- package/src/variables/_typography.scss +7 -7
- package/src/variables.css +5 -5
package/llms/00-installation.md
CHANGED
|
@@ -2,102 +2,172 @@
|
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
|
|
5
|
-
|
|
5
|
+
QUICK START · FOUNDATIONS
|
|
6
|
+
De la instalación al primer componente
|
|
7
|
+
Una base de estilos corporativos para tu aplicación Vue o tu portal Adobe AEM. Carga el CSS una vez y utiliza los tokens donde los necesites.
|
|
8
|
+
Instalar el paquete →Configurar Sass →
|
|
9
|
+
01Instala
|
|
6
10
|
|
|
7
|
-
|
|
11
|
+
Añade Foundations con el gestor de paquetes del proyecto.
|
|
12
|
+
02Carga la base
|
|
8
13
|
|
|
14
|
+
Elige CSS compilado o Sass. No cargues ambos.
|
|
15
|
+
03Construye
|
|
16
|
+
|
|
17
|
+
Combina helpers y tokens sin duplicar estilos globales.
|
|
18
|
+
|
|
19
|
+
## 01 · Instala el paquete
|
|
20
|
+
|
|
21
|
+
Usa el gestor que ya utilice tu proyecto y conserva su lockfile. Para proyectos existentes, respeta la política de versiones y revisa el changelog antes de actualizar.
|
|
22
|
+
|
|
23
|
+
```sh
|
|
24
|
+
npm install energy-foundations
|
|
9
25
|
```
|
|
26
|
+
|
|
27
|
+
Alternativa con Yarn:
|
|
28
|
+
|
|
29
|
+
```sh
|
|
10
30
|
yarn add energy-foundations
|
|
11
31
|
```
|
|
12
32
|
|
|
13
|
-
|
|
14
|
-
|
|
33
|
+
Para consumir las fuentes Sass necesitas Dart Sass en el pipeline. En Vue con Vite, si aún no está instalado:
|
|
34
|
+
|
|
35
|
+
```sh
|
|
36
|
+
npm install --save-dev sass
|
|
15
37
|
```
|
|
16
38
|
|
|
17
|
-
|
|
39
|
+
Actualiza con criterio, no a ciegasUtiliza versiones compatibles con tu proyecto. Una actualización de Foundations, Sass o Vite debe pasar por las pruebas de tu aplicación antes de llegar a producción.
|
|
18
40
|
|
|
19
|
-
|
|
41
|
+
## 02 · Carga el CSS una sola vez
|
|
20
42
|
|
|
21
|
-
|
|
43
|
+
### Vue · ruta recomendada
|
|
22
44
|
|
|
23
|
-
En main.ts
|
|
45
|
+
En el entry point de la aplicación, normalmente `src/main.ts`, importa Foundations antes que Energy Components o los estilos propios.
|
|
24
46
|
|
|
25
47
|
```ts
|
|
26
48
|
import 'energy-foundations/dist/style.css'
|
|
27
49
|
```
|
|
28
50
|
|
|
29
|
-
|
|
51
|
+
Este fichero incluye los estilos base y las custom properties. No repitas el import en cada componente ni uses `<style src="...">` para cargar la base global.
|
|
52
|
+
|
|
53
|
+
### Adobe AEM · integración en el pipeline
|
|
30
54
|
|
|
31
|
-
Si
|
|
55
|
+
Si el portal o el Catálogo Zero compilan Sass, puedes emitir la base desde el entry global que alimenta tu clientlib:
|
|
32
56
|
|
|
33
57
|
```scss
|
|
34
|
-
@use 'energy-foundations/
|
|
58
|
+
@use 'energy-foundations/src/global';
|
|
35
59
|
```
|
|
36
60
|
|
|
37
|
-
|
|
61
|
+
Configura el resolver de tu pipeline para encontrar paquetes en `node_modules`. Publica también las fuentes e icon fonts y verifica las URLs de las fuentes en el CSS final de la clientlib.
|
|
38
62
|
|
|
39
|
-
|
|
63
|
+
El wrapper Sass `energy-foundations/dist/style.scss` también está disponible. Ambas entradas Sass emiten la base, pero no incorporan el fichero completo de custom properties generado; si lo necesitas, incorpora `energy-foundations/dist/variables.css` por separado en el bundle global.
|
|
40
64
|
|
|
41
|
-
|
|
65
|
+
Una única vía para emitir la baseElige el CSS compilado o una entrada Sass global. No combines ambas ni inyectes global.scss, rds-foundations o style.scss en cada componente: duplicarías el CSS. En AEM, coordina la carga entre el catálogo compartido y el portal.
|
|
42
66
|
|
|
43
|
-
|
|
44
|
-
- `rds-variables.scss`
|
|
45
|
-
- `rds-foundations.scss`
|
|
46
|
-
- `global.scss` (agrega los anteriores)
|
|
67
|
+
## 03 · Consume variables y mixins
|
|
47
68
|
|
|
48
|
-
|
|
69
|
+
Importar tokens no es lo mismo que cargar toda la base. La entrada `src/rds-variables` publica variables y mixins sin generar el reset ni los helpers globales.
|
|
49
70
|
|
|
50
|
-
En
|
|
51
|
-
|
|
71
|
+
En la versión actual, este módulo también emite un bloque `:root` con custom properties tipográficas. No es una entrada completamente libre de CSS: comprueba su salida cuando lo uses en varios componentes.
|
|
72
|
+
|
|
73
|
+
### Opción local · explícita por componente
|
|
74
|
+
|
|
75
|
+
```scss
|
|
76
|
+
@use 'energy-foundations/src/rds-variables' as rds;
|
|
52
77
|
|
|
53
|
-
|
|
78
|
+
.portal-card {
|
|
79
|
+
padding: rds.$rds-spacing-global-24;
|
|
80
|
+
color: rds.$rds-color-content-high;
|
|
81
|
+
background: rds.$rds-color-surface-white;
|
|
82
|
+
}
|
|
83
|
+
```
|
|
54
84
|
|
|
55
|
-
|
|
85
|
+
Este patrón sirve tanto para un bloque `<style lang="scss">` de Vue como para el Sass de un componente AEM.
|
|
56
86
|
|
|
57
|
-
|
|
87
|
+
### Opción compartida · Vue con Vite
|
|
58
88
|
|
|
59
|
-
|
|
89
|
+
Si quieres exponer los tokens a todos los bloques SCSS de Vue, crea `src/styles/basic.scss`:
|
|
60
90
|
|
|
61
|
-
**basic.scss**
|
|
62
91
|
```scss
|
|
63
|
-
@forward 'energy-foundations/
|
|
64
|
-
// .btn { color: $rds-color-primary; }
|
|
92
|
+
@forward 'energy-foundations/src/rds-variables';
|
|
65
93
|
```
|
|
66
94
|
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
}
|
|
95
|
+
Añade esta configuración a tu `vite.config.ts` existente; conserva sus plugins y el resto de opciones:
|
|
96
|
+
|
|
97
|
+
```ts
|
|
98
|
+
import { fileURLToPath, URL } from 'node:url'
|
|
99
|
+
import { defineConfig } from 'vite'
|
|
100
|
+
|
|
101
|
+
export default defineConfig({
|
|
102
|
+
css: {
|
|
103
|
+
preprocessorOptions: {
|
|
104
|
+
scss: {
|
|
105
|
+
additionalData: '@use "@/styles/basic.scss" as *;\n',
|
|
106
|
+
},
|
|
107
|
+
},
|
|
108
|
+
},
|
|
109
|
+
resolve: {
|
|
110
|
+
alias: {
|
|
111
|
+
'@': fileURLToPath(new URL('./src', import.meta.url)),
|
|
112
|
+
},
|
|
113
|
+
},
|
|
114
|
+
})
|
|
79
115
|
```
|
|
80
116
|
|
|
81
|
-
|
|
117
|
+
Si ya existe el alias `@`, reutilízalo. No necesitas ampliar `server.fs.allow` para consumir normalmente una dependencia instalada en `node_modules`.
|
|
118
|
+
|
|
119
|
+
Con este setup, los tokens estarán disponibles en los bloques SCSS sin repetir el `@use`:
|
|
82
120
|
|
|
83
|
-
|
|
121
|
+
```vue
|
|
122
|
+
<template>
|
|
123
|
+
<article class="portal-card rds-pa-24">
|
|
124
|
+
<h2 class="rds-headline-03">Tu energía, más cerca</h2>
|
|
125
|
+
<p class="rds-body-01">Una base común para construir tu experiencia.</p>
|
|
126
|
+
</article>
|
|
127
|
+
</template>
|
|
84
128
|
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
allow: [".."]
|
|
90
|
-
}
|
|
129
|
+
<style scoped lang="scss">
|
|
130
|
+
.portal-card {
|
|
131
|
+
color: $rds-color-content-high;
|
|
132
|
+
background: $rds-color-surface-white;
|
|
91
133
|
}
|
|
134
|
+
</style>
|
|
92
135
|
```
|
|
93
136
|
|
|
94
|
-
|
|
137
|
+
Controla el CSS que genera additionalDataNo inyectes la base global. Incluso rds-variables puede repetir su bloque :root tipográfico al compilar cada componente por separado; revisa el CSS final antes de adoptar la inyección automática. Si prefieres imports explícitos, usa la opción local. En AEM, acuerda con el catálogo cómo compartir los módulos Sass.
|
|
138
|
+
|
|
139
|
+
## Qué entrada usar
|
|
140
|
+
|
|
141
|
+
CSS listo para usar
|
|
142
|
+
|
|
143
|
+
`dist/style.css`Base global y custom properties. Una sola carga en la aplicación.
|
|
144
|
+
Variables y mixins
|
|
145
|
+
|
|
146
|
+
`src/rds-variables.scss`Tokens Sass para tus componentes. No emite el CSS base.
|
|
147
|
+
Base desde Sass
|
|
148
|
+
|
|
149
|
+
`src/global.scss`Agrega reset y foundations. Alternativa al CSS compilado.
|
|
150
|
+
Entradas parciales
|
|
151
|
+
|
|
152
|
+
`src/rds-reset.scss``src/rds-foundations.scss`Para pipelines que controlan por separado el reset y los helpers. Evita solaparlas con la base completa.
|
|
153
|
+
|
|
154
|
+
### Si vienes de una versión anterior
|
|
155
|
+
|
|
156
|
+
- Usa `import 'energy-foundations/dist/style.css'` en el entry JavaScript para el CSS compilado.
|
|
157
|
+
- Para tokens, utiliza `@use 'energy-foundations/src/rds-variables' as rds;` en lugar del antiguo `@import`.
|
|
158
|
+
- Sass `@import` está deprecado. Migra gradualmente a `@use` y `@forward`, comprobando el CSS resultante.
|
|
159
|
+
- No sustituyas aliases ni cambies el layout global de un portal en producción sin revisar su impacto.
|
|
95
160
|
|
|
96
|
-
|
|
97
|
-
|
|
161
|
+
ANTES DE CONTINUAR
|
|
162
|
+
Comprueba tu integración
|
|
163
|
+
- El CSS base se carga una sola vez y antes de los estilos que lo personalizan.
|
|
164
|
+
- Las fuentes se descargan sin errores y los iconos aparecen correctamente.
|
|
165
|
+
- Los tokens Sass compilan y se ha revisado la posible repetición del bloque :root tipográfico.
|
|
166
|
+
- El layout y sus breakpoints se han elegido de forma explícita.
|
|
167
|
+
MAQUETACIÓNElegir Layout A o B →
|
|
168
|
+
ASISTENTES DE CÓDIGOIntegrar Copilot →
|
|
169
|
+
VERSIONESConsultar el changelog →
|
|
98
170
|
|
|
99
|
-
|
|
100
|
-
- Ahora: `@use 'energy-foundations/src/rds-variables' as rds;`
|
|
171
|
+
## Layout A / B
|
|
101
172
|
|
|
102
|
-
|
|
103
|
-
El entry `style.scss` no incluye `variables.css` (custom properties). Si necesitas esas variables en CSS, importa `dist/style.css` en `main.ts`.
|
|
173
|
+
Antes de implementar una página responsive, consulta [Layouts A/B, Grid e integración Vue/AEM](./04-layouts.md). El contexto tipográfico, el contenedor y el grid se seleccionan por separado; no asumas que el atributo del body cambia todos los helpers.
|
package/llms/01-classes.md
CHANGED
|
@@ -2,44 +2,42 @@
|
|
|
2
2
|
|
|
3
3
|
Authoritative class reference derived from Storybook MDX. Prefer using classes for layout and styling; when tokens are needed, prefer Sass variables and mixins; use CSS custom properties only if explicitly requested.
|
|
4
4
|
|
|
5
|
+
For Layout A/B, read [the layout guide](./04-layouts.md) before choosing containers or responsive helpers. rds-col-* and responsive Flex helpers use A breakpoints, even inside an editorial grid.
|
|
6
|
+
|
|
5
7
|
## Flex
|
|
6
8
|
|
|
7
|
-
`rds-flex`, `rds-flex-align
|
|
8
|
-
`rds-flex-
|
|
9
|
-
`rds-flex-
|
|
10
|
-
`rds-flex-row-reverse`, `rds-flex-shrink`, `rds-flex-sm-row`, `rds-flex-start-start`, `rds-flex-wrap`, `rds-flex-wrap-reverse`, `rds-inline-flex`
|
|
9
|
+
`rds-flex`, `rds-flex-align`, `rds-flex-auto`, `rds-flex-basis-1`, `rds-flex-basis-12`, `rds-flex-basis-2`, `rds-flex-basis-auto`, `rds-flex-basis-full`, `rds-flex-center-center`, `rds-flex-col`, `rds-flex-end-stretch`, `rds-flex-grow`
|
|
10
|
+
`rds-flex-grow-md`, `rds-flex-initial`, `rds-flex-justify`, `rds-flex-justify-baseline`, `rds-flex-justify-normal`, `rds-flex-justify-stretch`, `rds-flex-ld-col`, `rds-flex-md-row`, `rds-flex-no-grow`, `rds-flex-no-grow-ld`, `rds-flex-no-shrink`, `rds-flex-none`
|
|
11
|
+
`rds-flex-shrink`, `rds-flex-start-start`, `rds-inline-flex`
|
|
11
12
|
|
|
12
13
|
## Grid
|
|
13
14
|
|
|
14
|
-
`rds-
|
|
15
|
-
`rds-grid-editorial`, `rds-layout-editorial`, `rds-layout-max`, `rds-title-01`, `rds-title-02`
|
|
15
|
+
`rds-col`, `rds-col-ld-6`, `rds-col-md-4`, `rds-col-md-4-offset-2`, `rds-col-sd-4`, `rds-grid`, `rds-grid-editorial`, `rds-layout-editorial`, `rds-layout-max`, `rds-variables`
|
|
16
16
|
|
|
17
17
|
## Spacing
|
|
18
18
|
|
|
19
|
-
`rds-
|
|
20
|
-
`rds-spacing-global-
|
|
19
|
+
`rds-flex`, `rds-ma-0`, `rds-ma-16`, `rds-ma-24`, `rds-ma-m`, `rds-mb-16`, `rds-mt-24`, `rds-mt-48`, `rds-pa-16`, `rds-pa-24`, `rds-py-12`, `rds-spacing-global`
|
|
20
|
+
`rds-spacing-global-16`, `rds-spacing-global-24`, `rds-variables`
|
|
21
21
|
|
|
22
22
|
## Typography
|
|
23
23
|
|
|
24
|
-
`rds-body-01`, `rds-body-01-bold`, `rds-body-01-underline`, `rds-body-02`, `rds-body-02-bold`, `rds-body-02-underline`, `rds-button-01`, `rds-button-02`, `rds-caption-01`, `rds-caption-01-bold`, `rds-caption-
|
|
25
|
-
`rds-caption-
|
|
26
|
-
`rds-
|
|
27
|
-
`rds-monospaced-caption-02-bold`, `rds-numbers-00`, `rds-numbers-01`, `rds-numbers-02`, `rds-numbers-03`, `rds-title-01`, `rds-title-01-ld`, `rds-title-01-md`, `rds-title-01-sd`, `rds-title-01-xd`, `rds-title-02`
|
|
24
|
+
`rds-body-01`, `rds-body-01-bold`, `rds-body-01-underline`, `rds-body-02`, `rds-body-02-bold`, `rds-body-02-underline`, `rds-button-01`, `rds-button-02`, `rds-caption-01`, `rds-caption-01-bold`, `rds-caption-02`, `rds-caption-02-bold`
|
|
25
|
+
`rds-caption-tag`, `rds-font-style`, `rds-headline-00`, `rds-headline-01`, `rds-headline-02`, `rds-headline-03`, `rds-headline-04`, `rds-layout`, `rds-monospaced-body-01`, `rds-monospaced-body-01-bold`, `rds-monospaced-body-02`, `rds-monospaced-body-02-bold`
|
|
26
|
+
`rds-monospaced-caption-01`, `rds-monospaced-caption-01-bold`, `rds-monospaced-caption-02`, `rds-monospaced-caption-02-bold`, `rds-numbers-00`, `rds-numbers-01`, `rds-numbers-02`, `rds-numbers-03`, `rds-title-01`, `rds-title-02`
|
|
28
27
|
|
|
29
28
|
## Colors
|
|
30
29
|
|
|
31
|
-
`rds-background-active`, `rds-background-default`, `rds-background-gradient-blue`, `rds-background-gradient-ivory`, `rds-background-gradient-orange`, `rds-background-grey`, `rds-background-navy`, `rds-background-sand`, `rds-
|
|
32
|
-
`rds-color-
|
|
33
|
-
`rds-color-
|
|
34
|
-
`rds-color-
|
|
35
|
-
`rds-
|
|
30
|
+
`rds-background-active`, `rds-background-default`, `rds-background-gradient-blue`, `rds-background-gradient-ivory`, `rds-background-gradient-orange`, `rds-background-grey`, `rds-background-navy`, `rds-background-sand`, `rds-body-02`, `rds-body-02-bold`, `rds-color-background-default`, `rds-color-border-high`
|
|
31
|
+
`rds-color-border-high-inverse`, `rds-color-border-highlighted-active`, `rds-color-border-low`, `rds-color-border-low-inverse`, `rds-color-content-high`, `rds-color-content-high-inverse`, `rds-color-content-link`, `rds-color-content-medium`, `rds-color-content-medium-inverse`, `rds-color-content-state-disabled`, `rds-color-content-state-disabled-inverse`, `rds-color-extended-content-promo`
|
|
32
|
+
`rds-color-extended-surface-promo`, `rds-color-highlightedSurface-blueGradient`, `rds-color-highlightedSurface-ivoryGradient`, `rds-color-highlightedSurface-orangeGradient`, `rds-color-semantic-background-error`, `rds-color-semantic-background-information`, `rds-color-semantic-background-success`, `rds-color-semantic-background-warning`, `rds-color-semantic-content-error`, `rds-color-semantic-content-information`, `rds-color-semantic-content-success`, `rds-color-semantic-content-warning`
|
|
33
|
+
`rds-color-surface-grey`, `rds-color-surface-highlighted-active`, `rds-color-surface-navy`, `rds-color-surface-sand`, `rds-color-surface-white`, `rds-content-gradient-orange`, `rds-content-high`, `rds-content-high-i`, `rds-content-link`, `rds-content-medium`, `rds-content-medium-i`, `rds-content-numbers-highlight`
|
|
34
|
+
`rds-title-01`
|
|
36
35
|
|
|
37
36
|
## Elevation
|
|
38
37
|
|
|
39
|
-
`rds-
|
|
40
|
-
`rds-title-01`
|
|
38
|
+
`rds-color-style-cover-darker`, `rds-color-style-cover-default`, `rds-e-style-state-disabled`, `rds-radius-m`, `rds-style-effect-glass`, `rds-style-effect-glassnavy`, `rds-style-effect-overlay`, `rds-style-shadow-m`, `rds-style-shadow-negative`, `rds-style-shadow-s`, `rds-style-state-disabled`, `rds-variables`
|
|
41
39
|
|
|
42
40
|
## Border & Radius
|
|
43
41
|
|
|
44
|
-
`rds-
|
|
42
|
+
`rds-color-border-low`, `rds-radius-inputs`, `rds-radius-l`, `rds-radius-m`, `rds-radius-round`, `rds-radius-s`, `rds-variables`
|
|
45
43
|
|
package/llms/02-css-variables.md
CHANGED
|
@@ -25,7 +25,7 @@ Total: 406 variables.\n\n| Name | Value |
|
|
|
25
25
|
| --rds-body-01 | 1rem/1.5rem RepsolSoleTextRegular |
|
|
26
26
|
| --rds-body-02 | 0.875rem/1.25rem RepsolSoleTextRegular |
|
|
27
27
|
| --rds-body-01-bold | 1rem/1.5rem RepsolSoleTextBold |
|
|
28
|
-
| --rds-body-01-underline | 1rem/1.
|
|
28
|
+
| --rds-body-01-underline | 1rem/1.5rem RepsolSoleTextRegular |
|
|
29
29
|
| --rds-body-02-bold | 0.875rem/1.25rem RepsolSoleTextBold |
|
|
30
30
|
| --rds-body-02-underline | 0.875rem/1.25rem RepsolSoleTextRegular |
|
|
31
31
|
| --rds-button-01 | 1rem/1.5rem RepsolSoleTextBold |
|
|
@@ -41,19 +41,19 @@ Total: 406 variables.\n\n| Name | Value |
|
|
|
41
41
|
| --rds-title-01 | 1.125rem/1.625rem RepsolSoleTextBold |
|
|
42
42
|
| --rds-title-02 | 1rem/1.5rem RepsolSoleTextBold |
|
|
43
43
|
| --rds-headline-00-sd | 2.5rem/3rem RepsolSoleDisplayRegular |
|
|
44
|
-
| --rds-headline-00-md |
|
|
44
|
+
| --rds-headline-00-md | 2.5rem/3rem RepsolSoleDisplayRegular |
|
|
45
45
|
| --rds-headline-00-ld | 4rem/5rem RepsolSoleDisplayRegular |
|
|
46
46
|
| --rds-headline-00-xd | 4.5rem/5.75rem RepsolSoleDisplayRegular |
|
|
47
47
|
| --rds-headline-01-sd | 2rem/2.5rem RepsolSoleDisplayRegular |
|
|
48
|
-
| --rds-headline-01-md | 2.5rem
|
|
48
|
+
| --rds-headline-01-md | 2rem/2.5rem RepsolSoleDisplayRegular |
|
|
49
49
|
| --rds-headline-01-ld | 3rem/3.75rem RepsolSoleDisplayRegular |
|
|
50
50
|
| --rds-headline-01-xd | 3.5rem/4.25rem RepsolSoleDisplayRegular |
|
|
51
51
|
| --rds-headline-02-sd | 1.75rem/2.25rem RepsolSoleDisplayRegular |
|
|
52
|
-
| --rds-headline-02-md |
|
|
52
|
+
| --rds-headline-02-md | 1.75rem/2.25rem RepsolSoleDisplayRegular |
|
|
53
53
|
| --rds-headline-02-ld | 2.25rem/3rem RepsolSoleDisplayRegular |
|
|
54
54
|
| --rds-headline-02-xd | 2.75rem/3.5rem RepsolSoleDisplayRegular |
|
|
55
55
|
| --rds-headline-03-sd | 1.375rem/1.875rem RepsolSoleDisplayRegular |
|
|
56
|
-
| --rds-headline-03-md | 1.
|
|
56
|
+
| --rds-headline-03-md | 1.375rem/1.875rem RepsolSoleDisplayRegular |
|
|
57
57
|
| --rds-headline-03-ld | 1.75rem/2.25rem RepsolSoleDisplayRegular |
|
|
58
58
|
| --rds-headline-03-xd | 2rem/2.5rem RepsolSoleDisplayRegular |
|
|
59
59
|
| --rds-headline-04-sd | 1.125rem/1.625rem RepsolSoleDisplayRegular |
|