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

Use native sleep progress and iOS delete

Browse Source
This commit is contained in:
Florian Heinz
2026-05-21 19:14:03 +02:00
parent d4d2313b01
commit fda92eb47b
2 changed files with 27 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/app.css
+26 -8
View File
@@ -1009,15 +1009,31 @@ body.page-dashboard .content {
background: rgba(255, 255, 255, 0.16);
}
.sleep-phase-bar__fill {
.sleep-phase-bar__progress {
position: absolute;
inset: 0 auto 0 0;
display: block;
inset: 0;
width: 100%;
height: 100%;
width: var(--sleep-actual-left, 0);
min-width: 0.28rem;
max-width: 100%;
overflow: hidden;
border: 0;
border-radius: inherit;
appearance: none;
-webkit-appearance: none;
background: transparent;
}
.sleep-phase-bar__progress::-webkit-progress-bar {
border-radius: inherit;
background: transparent;
}
.sleep-phase-bar__progress::-webkit-progress-value {
border-radius: inherit;
background: linear-gradient(90deg, #64d2ff, #0a84ff);
box-shadow: 0 0 18px rgba(10, 132, 255, 0.38);
}
.sleep-phase-bar__progress::-moz-progress-bar {
border-radius: inherit;
background: linear-gradient(90deg, #64d2ff, #0a84ff);
box-shadow: 0 0 18px rgba(10, 132, 255, 0.38);
@@ -4949,10 +4965,12 @@ input[type="range"] {
min-width: 2.85rem;
min-height: 2.85rem;
border-radius: 999px;
background: rgba(242, 242, 247, 0.92);
color: rgba(28, 28, 30, 0.86);
border-color: rgba(255, 255, 255, 0.48);
background: #ff3b30;
color: #fff;
font-size: 1.05rem;
font-weight: 560;
box-shadow: 0 10px 26px rgba(255, 59, 48, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.28);
}
.timeline-card__delete .trash-button span {
templates/pages/dashboard.php
+1 -1
View File
@@ -222,7 +222,7 @@ $formatBalanceValue = static function (?array $entry) use ($settings): string {
<?php if ($eventType === 'sleep' && $sleepActualTotal > 0): ?>
<div class="sleep-phase-bar" aria-label="Schlafdauer" style="--sleep-optimal-left: <?= e((string) $sleepOptimalPercent) ?>%; --sleep-actual-left: <?= e((string) $sleepActualPercent) ?>%">
<span class="sleep-phase-bar__fill" aria-hidden="true"></span>
<progress class="sleep-phase-bar__progress" value="<?= e((string) $sleepActualTotal) ?>" max="<?= e((string) $sleepBarTotal) ?>"><?= e(format_duration_hours($sleepActualTotal)) ?></progress>
<span class="sleep-phase-bar__target"><span><?= e(format_duration_hours($optimalSleepHours)) ?></span></span>
</div>
<div class="sleep-phase-summary"><span><?= e(format_duration_hours($sleepActualTotal)) ?></span><span>Ziel <?= e(format_duration_hours($optimalSleepHours)) ?></span></div>