Responsividad dashboard importadores

This commit is contained in:
2025-05-12 15:35:24 -06:00
parent 485e249dab
commit ea794dba15
18 changed files with 622 additions and 125 deletions

View File

@@ -9,13 +9,54 @@
<link href="https://cdn.datatables.net/1.13.4/css/jquery.dataTables.min.css" rel="stylesheet">
<style>
body { background: #f4f6f9; font-family: 'Segoe UI', sans-serif; }
.sidebar { width: 220px; position: fixed; height: 100vh; background: #343a40; padding-top: 60px; }
.sidebar .nav-link { color: #ccc; padding: 12px 20px; }
.sidebar .nav-link.active,
.sidebar .nav-link:hover { background: #495057; color: #fff; }
.content { margin-left: 220px; padding: 40px 20px; }
.card { border-radius: 12px; }
table.dataTable thead th { background: #343a40; color: #fff; }
.sidebar {
width: 220px;
height: 100vh;
background-color: #343a40;
position: fixed;
top: 0;
left: 0;
padding-top: 56px; /* Alineado con la altura de la navbar */
z-index: 1040; /* Asegura que esté por encima del contenido */
}
.sidebar .nav-link {
color: #ccc;
padding: 12px 20px;
}
.sidebar .nav-link:hover, .sidebar .nav-link.active {
background-color: #495057;
color: #fff;
}
.content {
margin-top: 56px; /* Ajusta debajo de navbar */
padding: 40px 20px;
position: relative;
z-index: 1;
background-color: #f4f6f9; /* Asegura fondo uniforme */
transition: margin-left 0.3s ease;
}
.navbar {
position: fixed;
top: 0;
width: 100%;
z-index: 1050;
}
/* A partir de dispositivos medianos (>=768px), deja espacio lateral */
@media (min-width: 768px) {
.content {
margin-left: 250px; /* Ancho del sidebar */
}
}
/* En móviles, sin margen lateral */
@media (max-width: 767.98px) {
.content {
margin-left: 0;
}
}
.card {
border-radius: 12px;
}
</style>
</head>
<body>