libreria-astro-lefebvre 0.1.89 → 0.1.91

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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "libreria-astro-lefebvre",
3
- "version": "0.1.89",
3
+ "version": "0.1.91",
4
4
  "description": "Librería de componentes Astro, React y Vue para Lefebvre",
5
5
  "author": "Equipo web desarrollo Lefebvre",
6
6
  "type": "module",
@@ -85,6 +85,15 @@ export const metadata: ComponentMetadata = {
85
85
  options: ['sm', 'base', 'lg', 'xl', '2xl'],
86
86
  options_labels: ['SM (14px)', 'Base (16px)', 'LG (18px)', 'XL (20px)', '2XL (24px)'],
87
87
  example_value: 'base'
88
+ },
89
+ {
90
+ name: 'background',
91
+ type: 'select',
92
+ help: 'Color de fondo del bloque del título. Por defecto blanco. "Transparente" hereda el fondo de la página. Se aplica al contenedor del componente (ancho completo en móvil, 3/5 del ancho en escritorio)',
93
+ label: 'Color de fondo',
94
+ options: ['#FFFFFF', 'transparent', '#F8F8F8', '#F2F3F8', '#DDE0EC'],
95
+ options_labels: ['Blanco', 'Transparente', 'Gris muy claro', 'Gris claro', 'Azul claro'],
96
+ example_value: '#FFFFFF'
88
97
  }
89
98
  ]
90
99
  };
@@ -12,7 +12,7 @@ const imageUrl = extractImageUrl(image);
12
12
  ---
13
13
 
14
14
 
15
- <article class="w-1/3 flex-wrap md:w-1/3 md:flex-nowrap lg:w-1/2 p-1 py-4 md:p-4">
15
+ <article class="w-1/2 flex-wrap md:w-1/3 md:flex-nowrap lg:w-1/2 p-1 py-4 md:p-4">
16
16
  <div class="w-full flex flex-col">
17
17
  <div class="w-full">
18
18
  {(link && link !== '') ? (
@@ -10,11 +10,15 @@ const {
10
10
  subdescription = "",
11
11
  fontFamily = "inter", // inter | poppins
12
12
  fontSize = "base", // sm | base | lg | xl | 2xl
13
+ background = "#FFFFFF", // hex o 'transparent'
13
14
  } = Astro.props;
14
15
 
16
+ // Fondo aplicado en línea (no como clase Tailwind) para que cualquier color del select funcione sin safelist.
17
+ const backgroundStyle = background && background !== 'transparent' ? `background-color:${background}` : undefined;
18
+
15
19
  ---
16
20
 
17
- <div class={`w-full md:w-3/5 max-w-auto flex ${flexJustify === 'justify-center' ? 'justify-center' : 'justify-start'} flex-col p-4 md:p-0 mx-auto`}>
21
+ <div class={`w-full md:w-3/5 max-w-auto flex ${flexJustify === 'justify-center' ? 'justify-center' : 'justify-start'} flex-col p-4 md:p-0 mx-auto`} style={backgroundStyle}>
18
22
  {
19
23
  h1Subtitle && h1Subtitle.trim() !== ""
20
24
  ? <h1 class="font-poppins text-[#262626] text-center text-base font-normal rounded-sm bg-[#F2F3F8] mt-20 mb-8 w-fit py-2 px-3 mx-auto" set:html={title}></h1>