diff --git a/Elecciones-Web/frontend/src/components/MapaBsAs.css b/Elecciones-Web/frontend/src/components/MapaBsAs.css index 592c6ad..c82150b 100644 --- a/Elecciones-Web/frontend/src/components/MapaBsAs.css +++ b/Elecciones-Web/frontend/src/components/MapaBsAs.css @@ -128,18 +128,51 @@ border-bottom: 1px solid var(--border-color); margin-bottom: 1rem; } -.resultados-lista { list-style: none; padding: 0; margin: 0; } -.resultados-lista li { margin-bottom: 1rem; } +.resultados-lista { + list-style: none; + padding: 0; + margin: 0; +} +.resultados-lista li { + margin-bottom: 1.1rem; +} .resultado-info { display: flex; justify-content: space-between; - margin-bottom: 0.25rem; + align-items: baseline; + margin-bottom: 0.35rem; font-size: 0.9rem; } -.partido-nombre { font-weight: 500; } -.partido-votos { font-weight: 400; color: var(--text-color-muted); } -.progress-bar { height: 8px; background-color: var(--progress-bar-background); border-radius: 4px; overflow: hidden; } -.progress-fill { height: 100%; background-color: var(--primary-accent-color); border-radius: 4px; transition: width 0.5s ease-out; } + +.partido-nombre { + font-weight: 500; + color: #343a40; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + padding-right: 1rem; +} + +.partido-votos { + font-weight: 400; + color: var(--text-color-muted); + text-align: right; + white-space: nowrap; + flex-shrink: 0; +} + +.progress-bar { + height: 6px; + background-color: var(--progress-bar-background); + border-radius: 3px; + overflow: hidden; +} +.progress-fill { + height: 100%; + background-color: var(--primary-accent-color); + border-radius: 3px; + transition: width 0.5s ease-out; +} .spinner { width: 40px; height: 40px; border: 4px solid var(--border-color); border-top-color: var(--primary-accent-color); border-radius: 50%; animation: spin 1s linear infinite; margin: 1rem auto; } @keyframes spin { to { transform: rotate(360deg); } } @@ -189,8 +222,8 @@ .legend-item { display: flex; align-items: center; - margin-bottom: 0.5rem; - font-size: 0.85rem; + margin-bottom: 0.35rem; + font-size: 0.75rem; } .legend-color-box { width: 16px; height: 16px; margin-right: 8px; border-radius: 3px; border: 1px solid #ccc; } diff --git a/Elecciones-Web/frontend/src/components/MapaBsAsSecciones.tsx b/Elecciones-Web/frontend/src/components/MapaBsAsSecciones.tsx index 35b185a..f416cf2 100644 --- a/Elecciones-Web/frontend/src/components/MapaBsAsSecciones.tsx +++ b/Elecciones-Web/frontend/src/components/MapaBsAsSecciones.tsx @@ -292,7 +292,7 @@ const LegendSecciones = ({ resultados, nombresAgrupaciones }: { resultados: Map< return (
-

Ganadores por Sección

+

Leyenda de Ganadores

{legendItems.map(item => (