Fix Styles
This commit is contained in:
		| @@ -6,17 +6,15 @@ | ||||
|   border: 1px solid #e0e0e0; | ||||
|   border-radius: 8px; | ||||
|   position: relative; | ||||
|   padding: 10px; | ||||
| } | ||||
|  | ||||
| .panel-header { | ||||
|   padding: 1rem 1.5rem; | ||||
|   border-bottom: 1px solid #e0e0e0; | ||||
|   position: relative; | ||||
|   /* Necesario para que z-index funcione */ | ||||
|   z-index: 20; | ||||
|   /* Un número alto para ponerlo al frente */ | ||||
|   background-color: white; | ||||
|   /* Asegura que no sea transparente */ | ||||
| } | ||||
|  | ||||
| /* Contenedor para alinear título y selector */ | ||||
| @@ -34,10 +32,8 @@ | ||||
| /* El contenedor principal del selector (la parte visible antes de hacer clic) */ | ||||
| .categoria-selector__control { | ||||
|   border-radius: 8px !important; | ||||
|   /* Coincide con el radio de los otros elementos */ | ||||
|   border: 1px solid #e0e0e0 !important; | ||||
|   box-shadow: none !important; | ||||
|   /* Quitamos la sombra por defecto */ | ||||
|   transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out; | ||||
| } | ||||
|  | ||||
| @@ -156,31 +152,26 @@ | ||||
|   transition: all 0.5s ease-in-out; | ||||
| } | ||||
|  | ||||
| /* Columna del mapa */ | ||||
| .mapa-column { | ||||
|   flex: 2; | ||||
|   /* Por defecto, ocupa 2/3 del espacio */ | ||||
|   position: relative; | ||||
|   transition: flex 0.5s ease-in-out; | ||||
| } | ||||
|  | ||||
| /* Columna de resultados */ | ||||
| .resultados-column { | ||||
|   flex: 1; | ||||
|   /* Por defecto, ocupa 1/3 */ | ||||
|   overflow-y: auto; | ||||
|   padding: 1.5rem; | ||||
|   padding: 1.25rem; /* ANTES: 1.5rem */ | ||||
|   transition: all 0.5s ease-in-out; | ||||
|   min-width: 320px; | ||||
|   /* Un ancho mínimo para que no se comprima demasiado */ | ||||
| } | ||||
|  | ||||
| /* --- NUEVO LAYOUT PARA TARJETAS DE PARTIDO --- */ | ||||
| /* --- AJUSTES EN FILAS DE PARTIDOS --- */ | ||||
| .partido-fila { | ||||
|   display: flex; | ||||
|   align-items: center; | ||||
|   gap: 1rem; | ||||
|   padding: 1rem 0; | ||||
|   gap: 0.75rem;         /* ANTES: 1rem */ | ||||
|   padding: 0.75rem 0;   /* ANTES: 1rem 0 */ | ||||
|   border-bottom: 1px solid #f0f0f0; | ||||
|   border-left: 5px solid; | ||||
|   border-radius: 12px; | ||||
| @@ -189,8 +180,8 @@ | ||||
|  | ||||
| .partido-logo { | ||||
|   flex-shrink: 0; | ||||
|   width: 75px; | ||||
|   height: 75px; | ||||
|   width: 65px;  /* ANTES: 75px */ | ||||
|   height: 65px; /* ANTES: 75px */ | ||||
| } | ||||
|  | ||||
| .partido-logo img { | ||||
| @@ -203,32 +194,24 @@ | ||||
| .partido-main-content { | ||||
|   flex-grow: 1; | ||||
|   display: grid; | ||||
|   /* CAMBIO: De flex a grid */ | ||||
|   grid-template-columns: 1fr auto; | ||||
|   /* Columna 1 (nombre) flexible, Columna 2 (stats) se ajusta al contenido */ | ||||
|   grid-template-rows: auto auto; | ||||
|   /* Dos filas: una para la info, otra para la barra */ | ||||
|   align-items: center; | ||||
|   /* Alinea verticalmente el contenido de ambas filas */ | ||||
|   gap: 0.25rem 1rem; | ||||
|   /* Espacio entre filas y columnas (0.25rem vertical, 1rem horizontal) */ | ||||
|   gap: 0.25rem 0.75rem; /* ANTES: gap: 0.25rem 1rem */ | ||||
| } | ||||
|  | ||||
| .partido-top-row { | ||||
|   /* Hacemos que este contenedor sea "invisible" para el grid,  | ||||
|      promoviendo a sus hijos (info y stats) a la cuadrícula principal. */ | ||||
|   display: contents; | ||||
| } | ||||
|  | ||||
| .partido-info-wrapper { | ||||
|   /* Ocupa el espacio disponible a la izquierda */ | ||||
|   min-width: 0; | ||||
|   text-align: left; | ||||
| } | ||||
|  | ||||
| .partido-nombre { | ||||
|   font-weight: 700; | ||||
|   font-size: 1.05rem; | ||||
|   font-size: 1rem; /* ANTES: 1.05rem */ | ||||
|   color: #212529; | ||||
|   white-space: nowrap; | ||||
|   overflow: hidden; | ||||
| @@ -237,7 +220,7 @@ | ||||
| } | ||||
|  | ||||
| .candidato-nombre { | ||||
|   font-size: 0.8rem; | ||||
|   font-size: 0.75rem; /* ANTES: 0.8rem */ | ||||
|   color: #6c757d; | ||||
|   text-transform: uppercase; | ||||
|   font-weight: 500; | ||||
| @@ -248,27 +231,25 @@ | ||||
|   flex-shrink: 0; | ||||
|   text-align: right; | ||||
|   padding-left: 1rem; | ||||
|   /* Ya no necesita ser un contenedor flex, el grid lo posiciona */ | ||||
| } | ||||
|  | ||||
| .partido-porcentaje { | ||||
|   font-size: 1.5rem; | ||||
|   font-size: 1.35rem; /* ANTES: 1.5rem */ | ||||
|   font-weight: 700; | ||||
|   display: block; | ||||
| } | ||||
|  | ||||
| .partido-votos { | ||||
|   font-size: 1rem; | ||||
|   font-size: 0.9rem; /* ANTES: 1rem */ | ||||
|   color: #666; | ||||
|   display: block; | ||||
| } | ||||
|  | ||||
| .partido-barra-background { | ||||
|   height: 20px; | ||||
|   height: 12px; /* ANTES: 20px */ | ||||
|   background-color: #f0f0f0; | ||||
|   border-radius: 4px; | ||||
|   grid-column: 1 / 3; | ||||
|   /* Le indicamos que ocupe ambas columnas (de la línea 1 a la 3) */ | ||||
| } | ||||
|  | ||||
| .partido-barra-foreground { | ||||
| @@ -277,24 +258,23 @@ | ||||
|   transition: width 0.5s ease-in-out; | ||||
| } | ||||
|  | ||||
| /* ------------------------------------------- */ | ||||
|  | ||||
| /* --- AJUSTES EN CÍRCULOS DE ESTADÍSTICAS --- */ | ||||
| .panel-estado-recuento { | ||||
|   display: flex; | ||||
|   justify-content: space-around; | ||||
|   padding-bottom: 1.5rem; | ||||
|   margin-bottom: 1.5rem; | ||||
|   padding-bottom: 1rem; /* ANTES: 1.5rem */ | ||||
|   margin-bottom: 1rem;  /* ANTES: 1.5rem */ | ||||
|   border-bottom: 1px solid #e0e0e0; | ||||
| } | ||||
|  | ||||
| .estado-item { | ||||
|   width: 100px; | ||||
|   width: 95px; /* ANTES: 100px */ | ||||
|   text-align: center; | ||||
| } | ||||
|  | ||||
| .estado-item span { | ||||
|   margin-top: 0.5rem; | ||||
|   font-size: 0.9rem; | ||||
|   font-size: 0.85rem; /* ANTES: 0.9rem */ | ||||
|   color: #666; | ||||
|   display: block; | ||||
| } | ||||
|   | ||||
| @@ -4,7 +4,7 @@ | ||||
| :root { | ||||
|     --card-border-color: #e0e0e0; | ||||
|     --card-bg-color: #ffffff; | ||||
|     --card-header-bg-color: #f8f9fa; | ||||
|     --card-header-bg-color: #e6f1fd; | ||||
|     --card-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); | ||||
|     --text-primary: #212529; | ||||
|     --text-secondary: #6c757d; | ||||
| @@ -77,7 +77,7 @@ | ||||
|     flex-shrink: 0; | ||||
|     border-radius: 4px; | ||||
|     overflow: hidden; | ||||
|     background-color: #e9ecef; | ||||
|     background-color: #f7fbff; | ||||
|     padding: 0.25rem; | ||||
|     box-sizing: border-box; /* Para que el padding no aumente el tamaño total */ | ||||
| } | ||||
| @@ -86,6 +86,7 @@ | ||||
| .map-svg-container, .map-placeholder { | ||||
|     width: 100%; | ||||
|     height: 100%; | ||||
|     border-radius: 16px; | ||||
| } | ||||
|  | ||||
| /* Estilo para el SVG renderizado */ | ||||
|   | ||||
| @@ -21,7 +21,7 @@ type PointTuple = [number, number]; | ||||
|  | ||||
| const PROVINCE_VIEW_CONFIG: Record<string, { center: PointTuple; zoom: number }> = { | ||||
|   "BUENOS AIRES": { center: [-60.5, -37.3], zoom: 5 }, | ||||
|   "SANTA CRUZ": { center: [-69.5, -48.8], zoom: 5 }, | ||||
|   "SANTA CRUZ": { center: [-69.5, -49.3], zoom: 5 }, | ||||
|   "CIUDAD AUTONOMA DE BUENOS AIRES": { center: [-58.45, -34.6], zoom: 85 }, | ||||
|   "CHUBUT": { center: [-68.5, -44.5], zoom: 5.5 }, | ||||
|   "SANTA FE": { center: [-61, -31.2], zoom: 6 }, | ||||
|   | ||||
		Reference in New Issue
	
	Block a user