PostERG/xamxam
1
0
Fork 0
mirror of https://codeberg.org/PostERG/xamxam.git synced 2026-06-25 16:19:19 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: upload progress bar — fieldset layout, accent colors, file name display, completion animation, 800ms redirect delay; decorelate formats from fichiers; server-side poll via token; bump PeerTube embed audio player

Browse Source
This commit is contained in:
Pontoporeia
2026-05-11 13:12:36 +02:00
parent cdec3e96a6
commit 927ee2fe2a
12 changed files with 420 additions and 212 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
app/public/assets/css/form.css
View File

@@ -322,7 +322,7 @@
.licence-explanation {
background: var(--bg-secondary);
border-left: 4px solid var(--border-secondary, var(--border-primary));
padding: var(--space-m);
/* padding: var(--space-m); */
margin: 0;
}
@@ -1287,3 +1287,78 @@ a.recap-file-name:hover {
font-size: var(--step--2);
color: var(--text-tertiary);
}
/* ── Upload progress bar ─────────────────────────────────── */
#upload-progress-wrap {
border: 1px solid var(--accent-muted);
border-radius: var(--radius);
padding: var(--space-s);
margin-bottom: var(--space-s);
}
#upload-progress-wrap legend {
font-weight: 600;
font-size: var(--step--1);
color: var(--text-primary);
padding: 0 var(--space-2xs);
}
#upload-progress-bar {
display: block;
width: 100%;
height: 0.85rem;
border-radius: var(--radius);
overflow: hidden;
background: var(--accent-muted);
border: none;
}
#upload-progress-bar::-webkit-progress-bar {
background: var(--accent-muted);
border-radius: var(--radius);
}
#upload-progress-bar::-webkit-progress-value {
background: var(--accent-primary);
border-radius: var(--radius);
transition: width 0.3s ease;
}
#upload-progress-bar::-moz-progress-bar {
background: var(--accent-primary);
border-radius: var(--radius);
}
/* Completion state */
#upload-progress-bar[data-complete] {
box-shadow: 0 0 12px rgba(149, 87, 181, 0.4);
}
#upload-progress-bar[data-complete]::-webkit-progress-value {
background: var(--accent-green);
box-shadow: 0 0 8px rgba(76, 175, 80, 0.3);
}
#upload-progress-bar[data-complete]::-moz-progress-bar {
background: var(--accent-green);
}
/* ── Sticky formats fieldset ──────────────────────────────── */
#fieldset-formats {
position: sticky;
top: var(--space-s);
z-index: 10;
/* background: var(--bg-primary); */
border-radius: var(--radius);
}
legend {
text-shadow: var(--bg-primary) 0px 0px 2px;
}
/* Stickiness is scoped to the parent container */
#format-fichiers-block {
container-type: inline-size;
}