boton cerrar sesion arriba a la derecha
This commit is contained in:
+8
-2
@@ -66,9 +66,15 @@
|
||||
"createdAt": 1780726025468
|
||||
},
|
||||
{
|
||||
"token": "901dc29fdf21ee6ac2a96fd6844fe956f898eaf748c3f9008a34362f1febc87c",
|
||||
"token": "b7c6e592ca90af4ad27604116f26c96cdc706e060d3da7b2648404c0684ab368",
|
||||
"usuario": "admin",
|
||||
"rol": "admin",
|
||||
"createdAt": 1780726303152
|
||||
"createdAt": 1780759863126
|
||||
},
|
||||
{
|
||||
"token": "b1798edc58b621eea0e8b04adc9507a1518451f4088313550bdb573d537cbe65",
|
||||
"usuario": "admin",
|
||||
"rol": "admin",
|
||||
"createdAt": 1780762827102
|
||||
}
|
||||
]
|
||||
|
||||
@@ -413,15 +413,6 @@ select {
|
||||
box-shadow: 0 6px 24px rgba(167, 139, 250, 0.18);
|
||||
}
|
||||
|
||||
.topbar-divider {
|
||||
width: 1px;
|
||||
height: 24px;
|
||||
background: var(--line);
|
||||
margin: 0 6px;
|
||||
flex-shrink: 0;
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.nav-item {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
@@ -462,13 +453,66 @@ select {
|
||||
|
||||
/* Visibilidad de nav-items y secciones admin-only se controla por JS (aplicarPermisos) */
|
||||
|
||||
.nav-item-logout {
|
||||
margin-left: auto;
|
||||
/* ════════════════════════════════
|
||||
BOTÓN CERRAR SESIÓN — fixed en la esquina superior derecha
|
||||
Independiente de la topbar. Vive en la esquina para tener
|
||||
acceso rápido sin importar la vista/scroll.
|
||||
════════════════════════════════ */
|
||||
.btn-logout-fixed {
|
||||
position: fixed;
|
||||
top: 18px;
|
||||
right: 20px;
|
||||
z-index: 60; /* por encima de la topbar (z:50) */
|
||||
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
padding: 10px 18px;
|
||||
background: rgba(255, 255, 255, 0.92);
|
||||
backdrop-filter: blur(20px) saturate(180%);
|
||||
-webkit-backdrop-filter: blur(20px) saturate(180%);
|
||||
border: 1.5px solid var(--line-strong);
|
||||
border-radius: var(--radius-pill);
|
||||
font-family: inherit;
|
||||
font-size: 0.92rem;
|
||||
font-weight: 500;
|
||||
color: var(--ink-soft);
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
box-shadow: 0 6px 24px rgba(167, 139, 250, 0.18);
|
||||
transition: background var(--transition), color var(--transition), border-color var(--transition), transform var(--transition), box-shadow var(--transition);
|
||||
}
|
||||
|
||||
.nav-item-logout:hover {
|
||||
.btn-logout-fixed:hover {
|
||||
background: var(--danger-soft);
|
||||
border-color: rgba(220, 38, 38, 0.4);
|
||||
color: var(--danger);
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 8px 28px rgba(220, 38, 38, 0.22);
|
||||
}
|
||||
|
||||
.btn-logout-fixed .logout-icon {
|
||||
font-size: 1rem;
|
||||
line-height: 1;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 760px) {
|
||||
.btn-logout-fixed {
|
||||
top: 12px;
|
||||
right: 12px;
|
||||
padding: 9px 14px;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 380px) {
|
||||
.btn-logout-fixed .logout-label {
|
||||
display: none; /* solo el icono ↪ en pantallas muy chicas */
|
||||
}
|
||||
.btn-logout-fixed {
|
||||
padding: 9px 12px;
|
||||
}
|
||||
}
|
||||
|
||||
/* ════════════════════════════════
|
||||
@@ -1607,14 +1651,6 @@ select {
|
||||
.nav-icon {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.topbar-divider {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.nav-item-logout {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 480px) {
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
|
||||
<link rel="stylesheet" href="admin.css?v=16">
|
||||
<link rel="stylesheet" href="admin.css?v=17">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
@@ -85,11 +85,6 @@
|
||||
<span class="nav-icon">👥</span>
|
||||
<span class="nav-label">Usuarios</span>
|
||||
</button>
|
||||
<span class="topbar-divider" aria-hidden="true"></span>
|
||||
<button type="button" class="nav-item nav-item-logout" id="btnLogout">
|
||||
<span class="nav-icon">↪</span>
|
||||
<span class="nav-label">Cerrar sesión</span>
|
||||
</button>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
@@ -377,6 +372,12 @@
|
||||
</section>
|
||||
|
||||
</main>
|
||||
|
||||
<!-- BOTÓN FIJO: Cerrar sesión (esquina superior derecha) -->
|
||||
<button type="button" class="btn-logout-fixed" id="btnLogout" aria-label="Cerrar sesión">
|
||||
<span class="logout-icon" aria-hidden="true">↪</span>
|
||||
<span class="logout-label">Cerrar sesión</span>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<!-- MODAL: Crear usuario -->
|
||||
|
||||
Reference in New Issue
Block a user