Pie de pagina y registro (3717ebbf) · Commits · Rogelio Zamarripa Martinez / Proyecto_Ing_Electrica

react_frontend/src/App.css

+26 −0

Original line number	Diff line number	Diff line
		@@ -62,6 +62,32 @@
		}

		/* Add margin above the footer */

		.Pie_pagina {
		margin-top: 20px;
		width: 100%;
		max-width: 100000px;
		margin-left: auto;
		margin-right: auto;
		text-align: center;
		background: #f0f2f5;
		border-radius: 0 0 18px 18px;
		color: #002a5c;
		font-size: 1rem;
		box-sizing: border-box;
		padding: 12px 0;
		}

		@media (max-width: 768px) {
		.Pie_pagina {
		width: 100%;
		max-width: 100000px;
		min-width: 500px;
		margin-left: auto;
		margin-right: auto;
		border-radius: 0 0 10px 10px;
		font-size: 0.9rem;
		padding: 10px 0;
		box-sizing: border-box;
		}
		}
		No newline at end of file

react_frontend/src/components/Pie_pagina.css

+22 −14

Original line number	Diff line number	Diff line
		@@ -59,28 +59,36 @@

		/* Media query para versiones móviles */
		@media (max-width: 768px) {
		.footer {
		width: 100%;
		min-width: 650px;
		margin-left: 0;
		margin-right: 0;
		border-radius: 0 0 10px 10px;
		font-size: 13px;
		padding: 10px 0;
		box-sizing: border-box;
		overflow-x: hidden;
		}
		.footer-container {
		flex-direction: column; /* Cambia la dirección a columna para mejor visualización en móviles */
		padding: 0 10px; /* Reduce el padding lateral en móviles */
		width: 100%; /* Asegura que el pie de página ocupe todo el ancho de la pantalla */
		padding: 10px; /* Ajusta el padding para mejor visualización en móviles */
		box-sizing: border-box; /* Incluye el padding en el ancho total */
		flex-direction: column;
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		padding: 0;
		box-sizing: border-box;
		overflow-x: hidden;
		}

		.footer-content {
		text-align: center; /* Centra el contenido en móviles */
		text-align: center;
		}

		.footer-image-1,
		.footer-image-2 {
		display: block;
		margin: 0 auto; /* Centra las imágenes horizontalmente */
		margin: 0 auto;
		}

		.footer-image-1 img, .footer-image-2 img {
		width: 80px; /* Ajusta el tamaño de las imágenes en móviles */
		margin: 5px; /* Reduce el margen en móviles */
		width: 80px;
		margin: 5px;
		}


		}
		No newline at end of file

react_frontend/src/components/Registro.css

+45 −14

Original line number	Diff line number	Diff line
		/* Pie de página general */
		.footer {
		width: 500px;
		margin: 0 auto;
		text-align: center;
		padding: 12px 0;
		background: #f0f2f5;
		border-radius: 0 0 18px 18px;
		color: #002a5c;
		font-size: 1rem;
		}

		@media (max-width: 768px) {
		.footer {
		width: 500px;
		max-width: 500px;
		margin-left: auto;
		margin-right: auto;
		border-radius: 0 0 10px 10px;
		font-size: 0.9rem;
		padding: 10px 0;
		}
		}
		.registro-layout {
		display: flex;
		justify-content: center;
		@@ -8,25 +31,32 @@
		gap: 15px; /* Margen horizontal entre los .registro-container */
		}

		.registro-container {
		width: 45%; /* Ancho del contenedor */
		max-width: 400px; /* Ancho máximo del contenedor */
		padding: 90px;
		background-color: white;
		border-radius: 5px;
		box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
		margin-top: 0px; /* Separación vertical superior */
		margin-bottom: 100px; /* Añade margen debajo del recuadro */
		min-height: 300px; /* Altura mínima */
		max-height: 300px; /* Altura máxima */
		.login-section {
		max-height: 420px;
		overflow-y: auto;
		padding-bottom: 10px;
		margin-right: 24px;
		}

		.registro-container {
		box-sizing: border-box;
		min-height: 500px;
		max-width: 100000px;
		margin: 1000 auto 30px auto;
		background: #fff;
		border-radius: 18px;
		box-shadow: 0 2px 16px rgba(0,0,0,0.08);
		padding: 32px 28px 24px 28px;
		position: relative;
		overflow: hidden;
		}
		.registro-container h1{
		margin-top: 20px; /* Margen superior para el título de bienvenida */
		}

		.field-group {
		display: flex;
		width: 500px;
		flex-wrap: wrap; /* Permite que el contenido se ajuste en columnas */
		align-items: center;
		margin-bottom: 5px;
		@@ -91,12 +121,13 @@

		.session-selection,
		.login-section {
		width: 100%; /* Asegura que ocupen el ancho completo del contenedor */
		width: 500px; /* Asegura que ocupen el ancho completo del contenedor */
		background-color: #f0f2f5;
		padding: 25px;
		border-radius: 10px;
		margin-bottom: 0px;
		margin-top: 0px
		margin-bottom: 10px;
		margin-top: 10px;
		margin-right: 24px;
		}

		.session-selection h2,