cambios para menu mobile

This commit is contained in:
2026-08-31 16:10:59 -03:00
parent 3663318076
commit 89b7efa428
4 changed files with 41 additions and 42 deletions
-20
View File
@@ -1,20 +0,0 @@
<div align="center">
<img width="1200" height="475" alt="GHBanner" src="https://ai.google.dev/static/site-assets/images/share-ais-513315318.png" />
</div>
# Run and deploy your AI Studio app
This contains everything you need to run your app locally.
View your app in AI Studio: https://ai.studio/apps/62f9c45c-fa79-4ea7-bd03-756d1cdb54e9
## Run Locally
**Prerequisites:** Node.js
1. Install dependencies:
`npm install`
2. Set the `GEMINI_API_KEY` in [.env.local](.env.local) to your Gemini API key
3. Run the app:
`npm run dev`
+20 -19
View File
@@ -286,18 +286,28 @@ h4 { font-size: 1.25rem; }
[data-theme="dark"] .theme-icon-sun { display: block; } [data-theme="dark"] .theme-icon-sun { display: block; }
[data-theme="dark"] .theme-icon-moon { display: none; } [data-theme="dark"] .theme-icon-moon { display: none; }
/* Botón Hamburguesa Móvil */ /* --- Botón Hamburguesa Móvil --- */
.mobile-toggle-btn { .mobile-toggle-btn {
display: none; display: none; /* Oculto por defecto en desktop */
background: none; background: var(--bg-subtle);
border: none; border: 1px solid var(--border-color);
color: var(--text-main); color: var(--text-main);
font-size: 1.5rem; min-width: 44px;
min-height: 44px;
border-radius: var(--radius-full);
cursor: pointer; cursor: pointer;
padding: 0.5rem; padding: 0;
transition: all var(--transition-fast);
align-items: center;
justify-content: center;
} }
/* Menú Móvil Overlay */ .mobile-toggle-btn:hover {
background: var(--border-color);
color: var(--ide-accent);
}
/* --- Menú Móvil Overlay --- */
.mobile-menu-drawer { .mobile-menu-drawer {
display: none; display: none;
position: fixed; position: fixed;
@@ -316,6 +326,7 @@ h4 { font-size: 1.25rem; }
} }
.mobile-menu-drawer.is-open { .mobile-menu-drawer.is-open {
display: block;
transform: translateY(0); transform: translateY(0);
opacity: 1; opacity: 1;
} }
@@ -1006,7 +1017,7 @@ h4 { font-size: 1.25rem; }
@media (max-width: 768px) { @media (max-width: 768px) {
.nav-links, .nav-actions .btn { .nav-links, .nav-actions .btn {
display: none; display: none !important;
} }
.nav-actions { .nav-actions {
@@ -1016,17 +1027,11 @@ h4 { font-size: 1.25rem; }
} }
.mobile-toggle-btn { .mobile-toggle-btn {
display: inline-flex; display: flex !important; /* Forzamos la visualización */
align-items: center; align-items: center;
justify-content: center; justify-content: center;
min-width: 44px; min-width: 44px;
min-height: 44px; min-height: 44px;
background: var(--bg-subtle);
border: 1px solid var(--border-color);
color: var(--text-main);
border-radius: var(--radius-full);
padding: 0;
transition: all var(--transition-fast);
} }
.mobile-toggle-btn:hover { .mobile-toggle-btn:hover {
@@ -1034,10 +1039,6 @@ h4 { font-size: 1.25rem; }
color: var(--ide-accent); color: var(--ide-accent);
} }
.mobile-menu-drawer {
display: block;
}
.hero-doble-entrada { .hero-doble-entrada {
grid-template-columns: 1fr; grid-template-columns: 1fr;
} }
+7 -1
View File
@@ -46,7 +46,13 @@
<a href="contacto.html" class="btn btn-primary btn-sm">HABLEMOS</a> <a href="contacto.html" class="btn btn-primary btn-sm">HABLEMOS</a>
<!-- Botón Menú Móvil Hamburguesa --> <!-- Botón Menú Móvil Hamburguesa -->
<button id="mobile-menu-btn" class="mobile-toggle-btn" type="button" aria-label="Abrir menú" aria-expanded="false"> <button
id="mobile-menu-btn"
class="mobile-toggle-btn"
type="button"
aria-label="Abrir menú"
aria-expanded="false"
>
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"> <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="3" y1="12" x2="21" y2="12"></line> <line x1="3" y1="12" x2="21" y2="12"></line>
<line x1="3" y1="6" x2="21" y2="6"></line> <line x1="3" y1="6" x2="21" y2="6"></line>
+14 -2
View File
@@ -27,13 +27,20 @@ async function loadIncludes() {
const footerElem = document.getElementById('site-footer'); const footerElem = document.getElementById('site-footer');
try { try {
if (headerElem) { if (headerElem && headerElem.children.length === 0) {
const headerRes = await fetch('/includes/header.html', { cache: 'no-store' }); const headerRes = await fetch('/includes/header.html', { cache: 'no-store' });
if (headerRes.ok) { if (headerRes.ok) {
headerElem.innerHTML = await headerRes.text(); headerElem.innerHTML = await headerRes.text();
highlightActiveNavLink(); highlightActiveNavLink();
attachHeaderEvents(); attachHeaderEvents();
} else {
// ← NUEVO: Si el fetch falla (ej: 404), igual inicializar eventos
highlightActiveNavLink();
attachHeaderEvents();
} }
} else if (headerElem) {
highlightActiveNavLink();
attachHeaderEvents();
} }
if (footerElem) { if (footerElem) {
@@ -43,7 +50,12 @@ async function loadIncludes() {
} }
} }
} catch (err) { } catch (err) {
console.warn('Nota: Inclusión modular de header/footer cargada con respaldo local.'); console.warn('Header modular no disponible:', err);
// ← NUEVO: Intentar inicializar igual si el header ya tiene contenido estático
if (headerElem && headerElem.children.length > 0) {
highlightActiveNavLink();
attachHeaderEvents();
}
} }
} }