Responsividad dashboard importadores
This commit is contained in:
@@ -16,7 +16,8 @@
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding-top: 60px;
|
||||
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;
|
||||
@@ -27,34 +28,43 @@
|
||||
color: #fff;
|
||||
}
|
||||
.content {
|
||||
margin-left: 220px;
|
||||
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: 1000;
|
||||
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>
|
||||
|
||||
|
||||
|
||||
<?php include __DIR__ . '/../partials/sidebar_importador.php'; ?>
|
||||
|
||||
|
||||
|
||||
|
||||
<body>
|
||||
<br><br><br>
|
||||
|
||||
|
||||
<div class="content">
|
||||
<h4 class="mb-4">🚛 Alta de Transportista</h4>
|
||||
<form action="/IMPORTADORES/transportistas/guardar" method="POST" class="card p-4 shadow-sm">
|
||||
|
||||
@@ -20,7 +20,7 @@ unset($_SESSION['import_errors'], $_SESSION['import_success']);
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
|
||||
<style>
|
||||
body {
|
||||
body {
|
||||
font-family: 'Segoe UI', sans-serif;
|
||||
background-color: #f4f6f9;
|
||||
}
|
||||
@@ -31,7 +31,8 @@ unset($_SESSION['import_errors'], $_SESSION['import_success']);
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding-top: 60px;
|
||||
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;
|
||||
@@ -42,16 +43,32 @@ unset($_SESSION['import_errors'], $_SESSION['import_success']);
|
||||
color: #fff;
|
||||
}
|
||||
.content {
|
||||
margin-left: 220px;
|
||||
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: 1000;
|
||||
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;
|
||||
}
|
||||
|
||||
@@ -22,7 +22,8 @@ session_start();
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding-top: 60px;
|
||||
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;
|
||||
@@ -33,20 +34,35 @@ session_start();
|
||||
color: #fff;
|
||||
}
|
||||
.content {
|
||||
margin-left: 220px;
|
||||
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: 1000;
|
||||
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>
|
||||
|
||||
@@ -25,7 +25,8 @@
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding-top: 60px;
|
||||
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;
|
||||
@@ -36,20 +37,35 @@
|
||||
color: #fff;
|
||||
}
|
||||
.content {
|
||||
margin-left: 220px;
|
||||
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: 1000;
|
||||
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>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user