boton cerrar sesion arriba a la derecha
This commit is contained in:
+8
-2
@@ -66,9 +66,15 @@
|
|||||||
"createdAt": 1780726025468
|
"createdAt": 1780726025468
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"token": "901dc29fdf21ee6ac2a96fd6844fe956f898eaf748c3f9008a34362f1febc87c",
|
"token": "b7c6e592ca90af4ad27604116f26c96cdc706e060d3da7b2648404c0684ab368",
|
||||||
"usuario": "admin",
|
"usuario": "admin",
|
||||||
"rol": "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);
|
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 {
|
.nav-item {
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@@ -462,13 +453,66 @@ select {
|
|||||||
|
|
||||||
/* Visibilidad de nav-items y secciones admin-only se controla por JS (aplicarPermisos) */
|
/* 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);
|
background: var(--danger-soft);
|
||||||
|
border-color: rgba(220, 38, 38, 0.4);
|
||||||
color: var(--danger);
|
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 {
|
.nav-icon {
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.topbar-divider {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.nav-item-logout {
|
|
||||||
margin-left: 0;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 480px) {
|
@media (max-width: 480px) {
|
||||||
|
|||||||
@@ -7,7 +7,7 @@
|
|||||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
<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 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>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
@@ -85,11 +85,6 @@
|
|||||||
<span class="nav-icon">👥</span>
|
<span class="nav-icon">👥</span>
|
||||||
<span class="nav-label">Usuarios</span>
|
<span class="nav-label">Usuarios</span>
|
||||||
</button>
|
</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>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
@@ -377,6 +372,12 @@
|
|||||||
</section>
|
</section>
|
||||||
|
|
||||||
</main>
|
</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>
|
</div>
|
||||||
|
|
||||||
<!-- MODAL: Crear usuario -->
|
<!-- MODAL: Crear usuario -->
|
||||||
|
|||||||
Reference in New Issue
Block a user