Update index.html

index.html

@@ -10,9 +10,6 @@
       position: absolute;
       bottom: 2%;
       left: 2%;
-      background: rgba(0, 0, 0, 0.8);
-      padding: 10px;
-      border-radius: 8px;
       z-index: 100; /* Siempre por encima */
       display: flex;
       flex-direction: column;
@@ -21,6 +18,8 @@
 
     /* Estilo de las opciones del menú */
     .menu-item {
+      background-color: #3498db;
+      clip-path: polygon(0% 0%, 100% 0%, 85% 100%, 0% 100%);
       display: flex;
       align-items: center;
       justify-content: flex-start;
@@ -50,12 +49,20 @@
     /* Contenido desplegable */
     .menu-content {
       display: none;
-      flex-direction: column;
-      gap: 10px;
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: rgba(0, 0, 0, 0.8); /* Mantener el fondo oscuro */
+      padding-top: 60px; /* Asegura un pequeño espacio en la parte superior */
+      box-sizing: border-box;
     }
 
     #toggle:checked ~ .menu-content {
       display: flex;
+      flex-direction: column;
+      gap: 10px;
     }
 
     .hidden-input {