Stefan/evcc-io
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Config UI: mobile optimized section navigation (#32810)

Browse source
This commit is contained in:
Michael Geers 2026-08-13 17:19:50 +02:00 • committed by GitHub
parent 070c16cb4f
commit 0e58436ca4
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
19 changed files with 1190 additions and 474 deletions
Download patch file Download diff file Expand all files Collapse all files

37
assets/css/app.css
View file

@ -800,6 +800,43 @@ html.app .modal-dialog {
}
}
/* in-place fade-swipe between two views (Vue transition classes, e.g. config list>detail) */
.fade-swap-left-enter-active,
.fade-swap-left-leave-active,
.fade-swap-right-enter-active,
.fade-swap-right-leave-active {
transition:
opacity 150ms ease,
transform 150ms ease;
}
/* leaving view overlaps the entering one instead of pushing it down;
ancestor must be position:relative and unpadded, or the view jumps when going absolute */
.fade-swap-left-leave-active,
.fade-swap-right-leave-active {
position: absolute;
top: 0;
left: 0;
right: 0;
}
.fade-swap-left-enter-from,
.fade-swap-left-leave-to {
opacity: 0;
transform: translateX(-1rem);
}
.fade-swap-right-enter-from,
.fade-swap-right-leave-to {
opacity: 0;
transform: translateX(1rem);
}
@media (prefers-reduced-motion: reduce) {
.fade-swap-left-enter-active,
.fade-swap-left-leave-active,
.fade-swap-right-enter-active,
.fade-swap-right-leave-active {
transition: none;
}
}
.round-box--error {
box-shadow: 0 0 0.5rem var(--bs-danger);
border: 1px solid var(--bs-danger);