rene/banyaro
1
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Feature: Scan-Fortschrittsbalken während OSM-Daten geladen werden

Browse source
This commit is contained in:
rene 2026-04-17 10:39:58 +02:00
parent 7096ba8fea
commit 49d129e00c
4 changed files with 99 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

60
backend/static/css/components.css
View file

@ -2036,6 +2036,66 @@ textarea.form-control {
.map-place-btns .btn { flex: 1; }
/* Statusleiste: nur Info, unten links */
/* Scan-Fortschrittsbalken — oben im Kartenfenster */
.map-scan-bar {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 1001;
height: 40px;
background: rgba(255,255,255,0.92);
backdrop-filter: blur(6px);
border-bottom: 1px solid var(--c-border-light);
display: flex;
align-items: center;
gap: var(--space-3);
padding: 0 var(--space-4);
opacity: 0;
pointer-events: none;
transition: opacity 0.25s;
overflow: hidden;
}
.map-scan-bar.active {
opacity: 1;
}
.map-scan-bar__track {
flex: 1;
height: 6px;
background: var(--c-border-light);
border-radius: var(--radius-full);
overflow: hidden;
position: relative;
}
.map-scan-bar__fill {
height: 6px;
background: var(--c-primary);
border-radius: var(--radius-full);
width: 0%;
transition: width 0.4s ease;
position: relative;
}
.map-scan-bar__fill::after {
content: '';
position: absolute;
top: 0; right: 0; bottom: 0;
width: 60px;
background: linear-gradient(90deg, transparent, rgba(255,255,255,0.5), transparent);
animation: scan-shimmer 1.2s ease-in-out infinite;
}
@keyframes scan-shimmer {
0% { transform: translateX(-60px); opacity: 0; }
50% { opacity: 1; }
100% { transform: translateX(60px); opacity: 0; }
}
.map-scan-bar__label {
font-size: 12px;
font-weight: 600;
color: var(--c-primary);
min-width: 80px;
white-space: nowrap;
}
.map-statusbar {
position: absolute;
bottom: var(--space-3);