e8919e5842
Update petition map counter to show animated count of signatures with matching timing to dot animation and improved text formatting Remove redundant header styles from CSS Move counter styling to dedicated CSS section Update counter text to be more concise and present tense
105 lines
2 KiB
CSS
105 lines
2 KiB
CSS
/* Petition map page styles */
|
|
|
|
.petition-map-section {
|
|
|
|
#petition-map {
|
|
position: relative;
|
|
height: clamp(420px, 70vh, 800px);
|
|
background: oklch(0.96 0.005 220);
|
|
|
|
.map-loading {
|
|
position: absolute;
|
|
inset: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: oklch(0.55 0.03 220);
|
|
font-size: 0.9rem;
|
|
z-index: 10;
|
|
pointer-events: none;
|
|
}
|
|
|
|
/* Leaflet overrides for muted style */
|
|
.leaflet-container {
|
|
background: oklch(0.96 0.005 220);
|
|
font-family: var(--font-body);
|
|
}
|
|
|
|
.leaflet-control-attribution {
|
|
font-size: 0.65rem;
|
|
background: oklch(1 0 0 / 0.75);
|
|
}
|
|
}
|
|
|
|
.petition-map-footer {
|
|
padding-block: 1rem 2rem;
|
|
|
|
.back-link {
|
|
font-size: 0.9rem;
|
|
}
|
|
}
|
|
}
|
|
|
|
/* Fylke polygon styles (set via Leaflet path options, these are fallbacks) */
|
|
.leaflet-interactive {
|
|
cursor: pointer;
|
|
}
|
|
|
|
/* Signer name tooltip */
|
|
.signer-tip {
|
|
background: oklch(0.618 0.1176 173.93);
|
|
color: oklch(0.97 0 0);
|
|
border: none;
|
|
box-shadow: none;
|
|
font-family: var(--font-body);
|
|
font-size: 0.65rem;
|
|
font-weight: 600;
|
|
padding: 1px 5px;
|
|
border-radius: 8px;
|
|
line-height: 1.4;
|
|
white-space: nowrap;
|
|
pointer-events: none;
|
|
|
|
&::before { display: none; } /* hide tooltip arrow */
|
|
}
|
|
|
|
/* Anonymous tooltip */
|
|
.signer-tip--anon {
|
|
background: oklch(0.618 0.1176 173.93);
|
|
padding: 2px 5px 2px 4px;
|
|
|
|
.anon-icon {
|
|
width: 14px;
|
|
height: 14px;
|
|
vertical-align: middle;
|
|
}
|
|
}
|
|
|
|
/* Fylke popup / info panel */
|
|
.fylke-popup {
|
|
font-family: var(--font-body);
|
|
font-size: 0.85rem;
|
|
max-width: 220px;
|
|
|
|
.fylke-popup-title {
|
|
font-family: var(--font-heading);
|
|
font-weight: 600;
|
|
font-size: 1rem;
|
|
margin-bottom: 0.4rem;
|
|
color: var(--color-green);
|
|
}
|
|
|
|
.fylke-popup-count {
|
|
font-size: 0.8rem;
|
|
color: oklch(0.5 0.03 173.93);
|
|
}
|
|
}
|
|
|
|
/* Petition map counter */
|
|
#petition-map-count {
|
|
background: var(--color-green-light);
|
|
padding: 0 1.5rem 1rem;
|
|
margin-bottom: 0;
|
|
text-align: center;
|
|
color: var(--color-green);
|
|
}
|