hnzio/mood-tracking
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 7 Wiki Activity

Fix proportional sleep bar and image overlays

Browse Source
This commit is contained in:
Florian Heinz
2026-05-19 16:39:25 +02:00
parent adaff22651
commit 3b2c36c849
1 changed files with 15 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/app.css
+15 -7
View File
@@ -890,7 +890,7 @@ body.page-dashboard .content {
display: flex; display: flex;
min-height: 2.35rem; min-height: 2.35rem;
margin-top: 1.55rem; margin-top: 1.55rem;
overflow: hidden; overflow: visible;
border-radius: 999px; border-radius: 999px;
border: 1px solid rgba(255, 255, 255, 0.14); border: 1px solid rgba(255, 255, 255, 0.14);
background: rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.08);
@@ -898,13 +898,14 @@ body.page-dashboard .content {
.sleep-phase-bar__target { .sleep-phase-bar__target {
position: absolute; position: absolute;
left: var(--sleep-optimal-left, 100%); left: min(var(--sleep-optimal-left, 100%), calc(100% - 2px));
top: -1.28rem; top: -1.28rem;
bottom: 0; bottom: 0;
width: 0; width: 0;
border-left: 2px solid rgba(255, 255, 255, 0.92); border-left: 2px solid rgba(255, 255, 255, 0.92);
filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.45)); filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.45));
pointer-events: none; pointer-events: none;
z-index: 2;
} }
.sleep-phase-bar__target span { .sleep-phase-bar__target span {
@@ -924,7 +925,8 @@ body.page-dashboard .content {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
gap: 0.25rem; gap: 0.25rem;
min-width: max-content; min-width: 0;
flex-basis: 0;
padding: 0.35rem 0.65rem; padding: 0.35rem 0.65rem;
color: rgba(255, 255, 255, 0.94); color: rgba(255, 255, 255, 0.94);
font-size: 0.82rem; font-size: 0.82rem;
@@ -934,6 +936,7 @@ body.page-dashboard .content {
} }
.sleep-phase-bar__segment--deep { .sleep-phase-bar__segment--deep {
border-radius: 999px 0 0 999px;
background: linear-gradient(135deg, rgba(44, 82, 180, 0.92), rgba(38, 52, 124, 0.92)); background: linear-gradient(135deg, rgba(44, 82, 180, 0.92), rgba(38, 52, 124, 0.92));
} }
@@ -948,9 +951,14 @@ body.page-dashboard .content {
.sleep-phase-bar__segment--rest { .sleep-phase-bar__segment--rest {
min-width: 0; min-width: 0;
padding: 0; padding: 0;
border-radius: 0 999px 999px 0;
background: rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.1);
} }
.sleep-phase-bar__segment:last-of-type {
border-radius: 0 999px 999px 0;
}
.media-lightbox[hidden] { .media-lightbox[hidden] {
display: none; display: none;
} }
@@ -2297,7 +2305,7 @@ body.page-dashboard .content {
.timeline-card--with-image .timeline-card__time-chip, .timeline-card--with-image .timeline-card__time-chip,
.timeline-card--with-image .timeline-card__delete { .timeline-card--with-image .timeline-card__delete {
top: 0.75rem; top: 2.05rem;
} }
.timeline-card--with-image .timeline-card__time-chip { .timeline-card--with-image .timeline-card__time-chip {
@@ -2310,7 +2318,7 @@ body.page-dashboard .content {
} }
.timeline-card--with-image .timeline-card__delete { .timeline-card--with-image .timeline-card__delete {
right: 0.75rem; right: 1.6rem;
} }
.timeline-card__delete .ghost-button { .timeline-card__delete .ghost-button {
@@ -2333,8 +2341,8 @@ body.page-dashboard .content {
} }
.timeline-card--with-image .signal-row { .timeline-card--with-image .signal-row {
top: 0.75rem; top: 2.05rem;
left: 0.75rem; left: 2.05rem;
} }
.timeline-card .signal-pill { .timeline-card .signal-pill {