dmolinari/Elecciones-2025
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects 1 Releases Wiki Activity

Fix Mapas Css

Browse Source
This commit is contained in:
dmolinari
2025-09-08 13:09:30 -03:00
parent 865cc488df
commit 2169b57bc6
2 changed files with 43 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
Elecciones-Web/frontend/src/components/MapaBsAs.css
View File

@@ -128,18 +128,51 @@
border-bottom: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color);
margin-bottom: 1rem; margin-bottom: 1rem;
} }
.resultados-lista { list-style: none; padding: 0; margin: 0; } .resultados-lista {
.resultados-lista li { margin-bottom: 1rem; } list-style: none;
padding: 0;
margin: 0;
}
.resultados-lista li {
margin-bottom: 1.1rem;
}
.resultado-info { .resultado-info {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
margin-bottom: 0.25rem; align-items: baseline;
margin-bottom: 0.35rem;
font-size: 0.9rem; font-size: 0.9rem;
} }
.partido-nombre { font-weight: 500; }
.partido-votos { font-weight: 400; color: var(--text-color-muted); } .partido-nombre {
.progress-bar { height: 8px; background-color: var(--progress-bar-background); border-radius: 4px; overflow: hidden; } font-weight: 500;
.progress-fill { height: 100%; background-color: var(--primary-accent-color); border-radius: 4px; transition: width 0.5s ease-out; } 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; } .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); } } @keyframes spin { to { transform: rotate(360deg); } }
@@ -189,8 +222,8 @@
.legend-item { .legend-item {
display: flex; display: flex;
align-items: center; align-items: center;
margin-bottom: 0.5rem; margin-bottom: 0.35rem;
font-size: 0.85rem; font-size: 0.75rem;
} }
.legend-color-box { width: 16px; height: 16px; margin-right: 8px; border-radius: 3px; border: 1px solid #ccc; } .legend-color-box { width: 16px; height: 16px; margin-right: 8px; border-radius: 3px; border: 1px solid #ccc; }

2
Elecciones-Web/frontend/src/components/MapaBsAsSecciones.tsx
View File

@@ -292,7 +292,7 @@ const LegendSecciones = ({ resultados, nombresAgrupaciones }: { resultados: Map<
return ( return (
<div className="legend"> <div className="legend">
<h4>Ganadores por Sección</h4> <h4>Leyenda de Ganadores</h4>
{legendItems.map(item => ( {legendItems.map(item => (
<div key={item.nombre} className="legend-item"> <div key={item.nombre} className="legend-item">
<div className="legend-color-box" style={{ backgroundColor: item.color }} /> <div className="legend-color-box" style={{ backgroundColor: item.color }} />