|
|
@@ -1,5 +1,9 @@
|
|
|
@import url('https://fonts.gogleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');
|
|
|
|
|
|
+:root {
|
|
|
+ --ancho-menu: 250px;
|
|
|
+ }
|
|
|
+
|
|
|
* {
|
|
|
margin: 0;
|
|
|
padding: 0;
|
|
|
@@ -16,7 +20,7 @@ body {
|
|
|
|
|
|
#menu {
|
|
|
background: #E3DBFC;
|
|
|
- width: 200px; /* si cambia este valor puede afectar a otros calculos más abajo, por ejemplo el ancho de navigation */
|
|
|
+ width: var(--ancho-menu); /* si cambia este valor puede afectar a otros calculos más abajo, por ejemplo el ancho de navigation */
|
|
|
height: 100%;
|
|
|
position: fixed;
|
|
|
top: 0;
|
|
|
@@ -78,8 +82,8 @@ body {
|
|
|
}
|
|
|
|
|
|
#interface {
|
|
|
- width: calc(100% - 200px); /* el 200px es el ancho del menú. Si cambia este hay que cambiarlo aquí */
|
|
|
- margin-left: 200px; /* el 200px es el ancho del menú. Si cambia este hay que cambiarlo aquí */
|
|
|
+ width: calc(100% - var(--ancho-menu)); /* el 200px es el ancho del menú. Si cambia este hay que cambiarlo aquí */
|
|
|
+ margin-left: var(--ancho-menu); /* el 200px es el ancho del menú. Si cambia este hay que cambiarlo aquí */
|
|
|
position: relative;
|
|
|
}
|
|
|
|
|
|
@@ -105,7 +109,7 @@ body {
|
|
|
padding: 20px 30px;
|
|
|
border-bottom: 3px solid #E3DBFC;
|
|
|
position: fixed;
|
|
|
- width: calc(100% - 200px); /* el 200px es el ancho del menú. Si cambia este hay que cambiarlo aquí */
|
|
|
+ width: calc(100% - var(--ancho-menu)); /* el 200px es el ancho del menú. Si cambia este hay que cambiarlo aquí */
|
|
|
}
|
|
|
|
|
|
#interface .navigation .search{
|
