Administrator/dashboard-completo
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Actualizar frontend/src/styles.css

Browse Source
This commit is contained in:
Administrator
2026-09-02 11:21:43 -05:00
parent 0591c05323
commit 97b8b0639c
1 changed files with 33 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
frontend/src/styles.css
View File

@@ -14,17 +14,47 @@ body {
width: 240px; background: #0f172a; color: #e2e8f0;
display: flex; flex-direction: column; padding: 0;
position: fixed; height: 100vh; left: 0; top: 0;
transition: width 0.55s cubic-bezier(.22,1,.36,1);
overflow: hidden;
}
.sidebar-logo {
padding: 22px 20px; font-size: 16px; font-weight: 700; color: #fff;
border-bottom: 1px solid rgba(255,255,255,0.08); letter-spacing: 0.3px;
}
.sidebar-logo span { color: #60a5fa; }
/* Botón ☰ para colapsar/expandir */
.sidebar-toggle {
border: none; background: transparent; color: #cbd5e1; cursor: pointer;
font-size: 20px; padding: 6px 8px; border-radius: 8px; line-height: 1;
transition: background .15s, color .15s;
}
.sidebar-toggle:hover { background: rgba(255,255,255,0.08); color: #fff; }
/* ── Colapsado: barra vacía (solo el botón ☰), ancho reducido ── */
.sidebar.collapsed { width: 60px; }
.sidebar.collapsed .sidebar-logo { padding-left: 0; padding-right: 0; }
.sidebar.collapsed .sidebar-logo-text { display: none; }
.sidebar.collapsed .nav,
.sidebar.collapsed .sidebar-footer {
opacity: 0;
pointer-events: none;
transition: opacity .25s ease;
}
.sidebar .nav,
.sidebar .sidebar-footer {
opacity: 1;
transition: opacity .4s ease .18s;
}
.sidebar .sidebar-logo { transition: padding .55s cubic-bezier(.22,1,.36,1); }
.sidebar-toggle { opacity: 1 !important; pointer-events: auto !important; }
.app:has(.sidebar.collapsed) .main { margin-left: 60px; }
.nav { padding: 12px 10px; flex: 1; }
.nav-item {
display: flex; align-items: center; gap: 11px; padding: 11px 14px;
display: flex; align-items: center; gap: 11px; padding: 8px 14px;
border-radius: 10px; cursor: pointer; font-size: 13.5px; font-weight: 500;
color: #cbd5e1; margin-bottom: 3px; transition: all 0.15s; border: none;
color: #cbd5e1; margin-bottom: 1px; transition: all 0.15s; border: none;
background: transparent; width: 100%; text-align: left;
}
.nav-item:hover { background: rgba(255,255,255,0.06); color: #fff; }
@@ -32,7 +62,7 @@ body {
.nav-item .ico { font-size: 16px; }
/* ── Main content ── */
.main { margin-left: 240px; flex: 1; padding: 22px 28px; min-width: 0; overflow-x: hidden; }
.main { margin-left: 240px; flex: 1; padding: 22px 28px; min-width: 0; overflow-x: hidden; transition: margin-left 0.55s cubic-bezier(.22,1,.36,1); }
.page-title { font-size: 22px; font-weight: 700; color: #0f172a; margin-bottom: 14px; }
/* ── Filters bar ── */