fix: reposicionar dropdown del usuario en navbar para que sea accesible en móvil y desktop

This commit is contained in:
Admin
2026-01-16 20:54:39 -06:00
parent 1d17386299
commit 5bc50ec54b
3 changed files with 14 additions and 80 deletions

View File

@@ -114,10 +114,6 @@ body {
animation: slideDown 0.2s ease; animation: slideDown 0.2s ease;
} }
.dropdown-menu.show {
display: block !important;
}
@keyframes slideDown { @keyframes slideDown {
from { from {
opacity: 0; opacity: 0;

View File

@@ -15,68 +15,6 @@
if (debugList) { if (debugList) {
debugList.remove(); debugList.remove();
} }
// Fix para dropdowns en móvil
const dropdownToggles = document.querySelectorAll('.dropdown-toggle');
dropdownToggles.forEach(toggle => {
toggle.addEventListener('click', function(e) {
e.preventDefault();
e.stopPropagation();
// Obtener el elemento dropdown
const dropdown = this.closest('.dropdown') || this.parentElement;
const menu = this.nextElementSibling;
if (menu && menu.classList.contains('dropdown-menu')) {
// Toggle la clase 'show'
if (menu.classList.contains('show')) {
menu.classList.remove('show');
this.classList.remove('show');
this.setAttribute('aria-expanded', 'false');
} else {
// Cerrar otros dropdowns
document.querySelectorAll('.dropdown-menu.show').forEach(m => {
m.classList.remove('show');
m.previousElementSibling?.classList.remove('show');
});
menu.classList.add('show');
this.classList.add('show');
this.setAttribute('aria-expanded', 'true');
}
}
});
});
// Cerrar dropdowns al hacer clic en un item
const dropdownItems = document.querySelectorAll('.dropdown-item');
dropdownItems.forEach(item => {
item.addEventListener('click', function() {
// Cerrar todos los dropdowns
document.querySelectorAll('.dropdown-menu.show').forEach(m => {
m.classList.remove('show');
m.previousElementSibling?.classList.remove('show');
});
document.querySelectorAll('.dropdown-toggle.show').forEach(t => {
t.classList.remove('show');
t.setAttribute('aria-expanded', 'false');
});
});
});
// Cerrar dropdowns al hacer clic fuera
document.addEventListener('click', function(e) {
if (!e.target.closest('.dropdown') && !e.target.closest('.nav-item.dropdown')) {
document.querySelectorAll('.dropdown-menu.show').forEach(m => {
m.classList.remove('show');
m.previousElementSibling?.classList.remove('show');
});
document.querySelectorAll('.dropdown-toggle.show').forEach(t => {
t.classList.remove('show');
t.setAttribute('aria-expanded', 'false');
});
}
});
}); });
</script> </script>

View File

@@ -95,10 +95,22 @@ if (!isset($_SESSION['language'])) {
</ul> </ul>
</li> </li>
<?php endif; ?> <?php endif; ?>
<!-- User menu -->
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navUser" role="button" data-bs-toggle="dropdown" aria-expanded="false" style="cursor: pointer;">
<i class="bi bi-person-circle me-1"></i><?php echo htmlspecialchars($_SESSION['username']); ?>
</a>
<ul class="dropdown-menu" aria-labelledby="navUser">
<li><a class="dropdown-item" href="<?php echo site_url('profile.php'); ?>" data-translate="true"><i class="bi bi-person-circle me-2"></i>Perfil</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="<?php echo site_url('logout.php'); ?>" data-translate="true"><i class="bi bi-box-arrow-right me-2"></i>Cerrar Sesión</a></li>
</ul>
</li>
</ul> </ul>
<!-- Right side: Language selector, DB info, Profile, Logout --> <!-- Right side: Language selector, DB info -->
<div class="d-flex align-items-center gap-2 flex-wrap"> <div class="d-flex align-items-center gap-2 flex-wrap ms-auto">
<select class="form-select form-select-sm w-auto" id="language-selector" style="max-width: 120px;"> <select class="form-select form-select-sm w-auto" id="language-selector" style="max-width: 120px;">
<!-- Options will be populated by translate_frontend.js --> <!-- Options will be populated by translate_frontend.js -->
</select> </select>
@@ -121,18 +133,6 @@ if (!isset($_SESSION['language'])) {
</div> </div>
</div> </div>
<?php endif; ?> <?php endif; ?>
<!-- User menu -->
<div class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navUser" role="button" data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-person-circle me-1"></i><?php echo htmlspecialchars($_SESSION['username']); ?>
</a>
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="navUser">
<li><a class="dropdown-item" href="<?php echo site_url('profile.php'); ?>" data-translate="true"><i class="bi bi-person-circle me-2"></i>Perfil</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="<?php echo site_url('logout.php'); ?>" data-translate="true"><i class="bi bi-box-arrow-right me-2"></i>Cerrar Sesión</a></li>
</ul>
</div>
</div> </div>
</div> </div>
</div> </div>