libreria-astro-lefebvre 0.2.34 → 0.2.36
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
|
@@ -54,7 +54,7 @@ export const metadata: ComponentMetadata = {
|
|
|
54
54
|
{ name: 'name', type: 'text', help: 'Texto visible del ítem del menú principal', label: 'Texto del ítem', example_value: 'Cómo funciona' },
|
|
55
55
|
{ name: 'link', type: 'text', help: 'URL de destino del ítem. Debe ser la ruta completa (no se le concatena "subdirectory")', label: 'URL del ítem', example_value: '/genia-l/conoce-genia-l/' },
|
|
56
56
|
{ name: 'target', type: 'select', help: 'Cómo se abre el enlace: "_self" en la misma pestaña, "_blank" en una pestaña nueva', label: 'Apertura del enlace', options: ['_self', '_blank'], options_labels: ['Misma pestaña', 'Nueva pestaña'], example_value: '_self' },
|
|
57
|
-
{ name: 'featured', type: 'boolean', help: 'Muestra este ítem como el nombre del sitio (tipografía serif en negrita), junto al logo. En móvil sale de la hamburguesa.
|
|
57
|
+
{ name: 'featured', type: 'boolean', help: 'Muestra este ítem como el nombre del sitio (tipografía serif en negrita), junto al logo. En móvil sale de la hamburguesa. Si no lo tocas, se aplica al primer ítem del menú personalizado; ponlo en Falso para desactivarlo', label: 'Mostrar como marca del sitio', options: ['false', 'true'], options_labels: ['Falso', 'Verdadero'], example_value: true },
|
|
58
58
|
]
|
|
59
59
|
}
|
|
60
60
|
},
|
|
@@ -91,8 +91,13 @@ const categories: MenuItem[] = (categoriesProp && categoriesProp.length > 0)
|
|
|
91
91
|
|
|
92
92
|
// El CTA se pinta dos veces (barra superior en móvil, fila del menú en escritorio); solo uno es visible a la vez.
|
|
93
93
|
// Ítem marcado como "featured" (p. ej. GenIA-L): estilo "Lead/Bold". En móvil sale de la hamburguesa y va en la barra superior.
|
|
94
|
-
//
|
|
95
|
-
|
|
94
|
+
// Gana el primero marcado explícitamente a true; si no hay ninguno, el primer ítem del menú solo si su campo está sin definir
|
|
95
|
+
// (con "false" se desactiva). El menú por defecto no destaca ninguno.
|
|
96
|
+
const hasCustomMenu = !!(categoriesProp && categoriesProp.length > 0);
|
|
97
|
+
const isUnset = (v: unknown) => v === undefined || v === null || v === '';
|
|
98
|
+
const firstItem = hasCustomMenu
|
|
99
|
+
? (categories.find((c: any) => String(c.featured) === 'true') ?? (isUnset((categories[0] as any)?.featured) ? categories[0] : undefined))
|
|
100
|
+
: undefined;
|
|
96
101
|
const firstItemClass = 'font-heading text-xl not-italic font-semibold leading-7 tracking-[-0.05px] text-[#1b1b1b] whitespace-nowrap';
|
|
97
102
|
const ctaClass = 'h-12 max-[375px] px-3 md:px-5 py-3 font-body font-semibold max-[375px]:text-sm max-[375px]:leading-[21px] text-base leading-6 border-1 border-[#d71635] bg-[#d71635] text-[#ffffff] hover:border-[#71131f] hover:bg-[#71131f] transition-all duration-300 rounded-full cursor-pointer shadow-[0_2px_4px_-2px_rgba(107,58,8,0.08),0_4px_8px_-2px_rgba(107,58,8,0.04)] whitespace-nowrap';
|
|
98
103
|
|
|
@@ -100,18 +105,18 @@ const categories: MenuItem[] = (categoriesProp && categoriesProp.length > 0)
|
|
|
100
105
|
---
|
|
101
106
|
|
|
102
107
|
<header class="sticky top-0 w-full font-body bg-[rgba(250,250,245,0.80)] backdrop-blur-lg z-50 flex flex-col justify-center align-center items-center p-0">
|
|
103
|
-
<div class="px-4
|
|
108
|
+
<div class="px-4 lg:px-8 py-3 lg:py-1 w-full">
|
|
104
109
|
|
|
105
|
-
<div class="max-w-[1376px] flex items-center justify-between gap-2 mx-auto">
|
|
106
|
-
<div class="flex items-
|
|
110
|
+
<div class="max-w-[1376px] flex items-center justify-between gap-2 mx-auto p-2">
|
|
111
|
+
<div class="flex flex-col items-start gap-1 min-w-0">
|
|
107
112
|
<a href="https://lefebvre.es" class="flex items-center shrink-0">
|
|
108
113
|
<img src="https://assets.lefebvre.es/media/logos-2/svg/lefebvre.svg" class="h-7 w-auto" alt="Lefebvre" width="104" height="28" loading={loading}>
|
|
109
114
|
</a>
|
|
110
115
|
{firstItem && (
|
|
111
|
-
<a href={firstItem.link} target={firstItem.target ?? '_self'} class={`${firstItemClass} min-w-0 truncate
|
|
116
|
+
<a href={firstItem.link} target={firstItem.target ?? '_self'} class={`${firstItemClass} min-w-0 max-w-full truncate lg:hidden`}>{firstItem.name}</a>
|
|
112
117
|
)}
|
|
113
118
|
</div>
|
|
114
|
-
<div class="flex items-center gap-2 shrink-0
|
|
119
|
+
<div class="flex items-center gap-2 shrink-0 lg:hidden">
|
|
115
120
|
{label && (
|
|
116
121
|
<div class="flex items-center gap-4">
|
|
117
122
|
<a href={url} class={ctaClass}>{label}</a>
|
|
@@ -131,7 +136,7 @@ const categories: MenuItem[] = (categoriesProp && categoriesProp.length > 0)
|
|
|
131
136
|
|
|
132
137
|
</div>
|
|
133
138
|
</div>
|
|
134
|
-
<nav class="hidden
|
|
139
|
+
<nav class="hidden lg:block w-full px-8">
|
|
135
140
|
<div class="max-w-[1376px] flex items-center gap-6 mx-auto">
|
|
136
141
|
<ul class="flex items-center justify-start">
|
|
137
142
|
{categories.map((category, index) => {
|
|
@@ -183,7 +188,7 @@ const categories: MenuItem[] = (categoriesProp && categoriesProp.length > 0)
|
|
|
183
188
|
</div>
|
|
184
189
|
</nav>
|
|
185
190
|
|
|
186
|
-
<nav class="hidden
|
|
191
|
+
<nav class="hidden lg:hidden w-full bg-white border-[#e1c8b4]" id="navbar-default">
|
|
187
192
|
<div class="max-w-screen-xl flex flex-wrap items-center justify-between mx-auto">
|
|
188
193
|
|
|
189
194
|
<div class="w-full">
|