cambios para menu mobile
This commit is contained in:
@@ -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
@@ -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;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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
@@ -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();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user