copy of react-dev-luzma

geomapp/src/pages/mapa.jsx

@@ -39,6 +39,11 @@ const Mapa = () => {
                 <GoogleMapComponent></GoogleMapComponent>
                 <br></br>
                 <UpdateLocationButton className="update-location-btnn" onClick={updateLocation} />
+                <br></br>
+                <br></br>
+                <br></br>
+                <br></br>
+                <br></br>
 
 
 

geomapp/src/styles/footer.css

@@ -1,30 +1,40 @@
+html, body {
+    height: 100%;
+    margin: 0;
+    display: flex;
+    flex-direction: column;
+}
+
+main {
+    flex: 1;
+    padding: 20px;
+}
+
 .footer {
     padding: 32px 0;
-    background-color: #f1f1f1; /* Color de fondo del footer */
-    text-align: center; /* Centra el contenido textual */
-    box-shadow: 0 -2px 4px rgba(0,0,0,0.1); /* Sombra para dar un efecto elevado */
-    position: absolute;
-    bottom: 0;
+    background-color: #f1f1f1;
+    text-align: center;
+    box-shadow: 0 -2px 4px rgba(0,0,0,0.1);
     width: 100%;
 }
 
 .footer-links {
     display: flex;
-    justify-content: center; /* Alinea los enlaces horizontalmente al centro */
-    gap: 20px; /* Espacio entre los enlaces */
+    justify-content: center;
+    gap: 20px;
 }
 
 .footer-link {
     text-decoration: none;
-    color: #000; /* Color del texto de los enlaces */
-    font-weight: bold; /* Negrita para el texto */
-    padding: 8px 15px; /* Padding para hacer los enlaces más clickeables */
-    border-radius: 5px; /* Bordes redondeados para los enlaces */
-    transition: background-color 0.3s, color 0.3s; /* Transición suave para hover */
+    color: #000;
+    font-weight: bold;
+    padding: 8px 15px;
+    border-radius: 5px;
+    transition: background-color 0.3s, color 0.3s;
     cursor: pointer;
 }
 
 .footer-link:hover {
-    background-color: #ff914d; /* Cambia el fondo al pasar el ratón */
-    color: #fff; /* Cambia el color del texto al pasar el ratón */
+    background-color: #ff914d;
+    color: #fff;
 }

geomapp/src/styles/mapa.css

@@ -1,6 +1,6 @@
 /* Contenedor del mapa */
 #map {
-    height: 400px; /* Altura del mapa */
+    height: 300px; /* Altura del mapa */
     width: 50%;   /* Ancho del mapa */
   }
 
@@ -61,7 +61,7 @@
   .map-container {
     position: relative;
     width: 60%;
-    height: 700px;
+    height: 600px;
   }
 
   /* Contenedor principal que alinea mapa e información */