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

Polish mobile media and sleep bars

Browse Source
This commit is contained in:
Florian Heinz
2026-05-19 16:34:25 +02:00
parent 36a15f3ed4
commit adaff22651
3 changed files with 23 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/app.css
+12 -7
View File
@@ -929,6 +929,8 @@ body.page-dashboard .content {
color: rgba(255, 255, 255, 0.94); color: rgba(255, 255, 255, 0.94);
font-size: 0.82rem; font-size: 0.82rem;
white-space: nowrap; white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} }
.sleep-phase-bar__segment--deep { .sleep-phase-bar__segment--deep {
@@ -2180,7 +2182,9 @@ body.page-dashboard .content {
.dashboard-shell { .dashboard-shell {
padding-inline: 0; padding-inline: 0;
padding-top: max(0.35rem, env(safe-area-inset-top)); margin-top: calc(-1 * env(safe-area-inset-top));
min-height: calc(100dvh + env(safe-area-inset-top));
padding-top: calc(env(safe-area-inset-top) + 0.35rem);
padding-bottom: calc(0.9rem + env(safe-area-inset-bottom)); padding-bottom: calc(0.9rem + env(safe-area-inset-bottom));
} }
@@ -2259,14 +2263,15 @@ body.page-dashboard .content {
.timeline-media-button { .timeline-media-button {
min-height: 0; min-height: 0;
height: auto; height: 18rem;
max-height: none; max-height: none;
margin: 0 0 0.7rem; margin: -2.65rem 0 0.7rem;
} }
.timeline-media-button .timeline-card__image { .timeline-media-button .timeline-card__image {
height: auto; height: 100%;
max-height: 24rem; max-height: none;
object-fit: cover;
} }
.timeline-card__time-chip { .timeline-card__time-chip {
@@ -2292,7 +2297,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: 2.05rem; top: 0.75rem;
} }
.timeline-card--with-image .timeline-card__time-chip { .timeline-card--with-image .timeline-card__time-chip {
@@ -2305,7 +2310,7 @@ body.page-dashboard .content {
} }
.timeline-card--with-image .timeline-card__delete { .timeline-card--with-image .timeline-card__delete {
right: 1.6rem; right: 0.75rem;
} }
.timeline-card__delete .ghost-button { .timeline-card__delete .ghost-button {
assets/js/app.js
+3 -3
View File
@@ -1440,10 +1440,10 @@
return; return;
} }
if (deltaX < 0 && swipeContainer.dataset.nextDate) { if (deltaX < 0 && swipeContainer.dataset.prevDate) {
window.location.href = dashboardDayPath(swipeContainer.dataset.nextDate);
} else if (deltaX > 0 && swipeContainer.dataset.prevDate) {
window.location.href = dashboardDayPath(swipeContainer.dataset.prevDate); window.location.href = dashboardDayPath(swipeContainer.dataset.prevDate);
} else if (deltaX > 0 && swipeContainer.dataset.nextDate) {
window.location.href = dashboardDayPath(swipeContainer.dataset.nextDate);
} }
}; };
templates/pages/dashboard.php
+8 -7
View File
@@ -102,14 +102,15 @@ $optimalSleepHours = max(1.0, min(16.0, (float) ($settings['sleep']['optimal_hou
<?php $showEventComment = in_array($eventType, ['sport', 'walk', 'sleep'], true) && $eventComment !== '' && !$isImportedHealth; ?> <?php $showEventComment = in_array($eventType, ['sport', 'walk', 'sleep'], true) && $eventComment !== '' && !$isImportedHealth; ?>
<?php <?php
$sleepPhases = ['deep' => (float) ($item['sleep_deep'] ?? 0), 'rem' => (float) ($item['sleep_rem'] ?? 0), 'core' => (float) ($item['sleep_core'] ?? 0)]; $sleepPhases = ['deep' => (float) ($item['sleep_deep'] ?? 0), 'rem' => (float) ($item['sleep_rem'] ?? 0), 'core' => (float) ($item['sleep_core'] ?? 0)];
if ($eventType === 'sleep' && array_sum($sleepPhases) <= 0 && $eventComment !== '') { $sleepPhaseSource = trim($eventComment . ' ' . (string) ($item['duration_label'] ?? '') . ' ' . (string) ($item['distance_label'] ?? '') . ' ' . (string) ($item['energy_label'] ?? '') . ' ' . (string) ($item['heart_rate_label'] ?? ''));
if (preg_match('/Tief\s+([0-9]+(?:[,.][0-9]+)?)/u', $eventComment, $match) === 1) { if ($eventType === 'sleep' && array_sum($sleepPhases) <= 0 && $sleepPhaseSource !== '') {
if (preg_match('/(?:Tief|Tiefschlaf)\s*:?[\s]+([0-9]+(?:[,.][0-9]+)?)/u', $sleepPhaseSource, $match) === 1) {
$sleepPhases['deep'] = (float) str_replace(',', '.', $match[1]); $sleepPhases['deep'] = (float) str_replace(',', '.', $match[1]);
} }
if (preg_match('/REM\s+([0-9]+(?:[,.][0-9]+)?)/u', $eventComment, $match) === 1) { if (preg_match('/REM(?:-Schlaf)?\s*:?[\s]+([0-9]+(?:[,.][0-9]+)?)/u', $sleepPhaseSource, $match) === 1) {
$sleepPhases['rem'] = (float) str_replace(',', '.', $match[1]); $sleepPhases['rem'] = (float) str_replace(',', '.', $match[1]);
} }
if (preg_match('/Kern\s+([0-9]+(?:[,.][0-9]+)?)/u', $eventComment, $match) === 1) { if (preg_match('/(?:Kern|Kernschlaf)\s*:?[\s]+([0-9]+(?:[,.][0-9]+)?)/u', $sleepPhaseSource, $match) === 1) {
$sleepPhases['core'] = (float) str_replace(',', '.', $match[1]); $sleepPhases['core'] = (float) str_replace(',', '.', $match[1]);
} }
} }
@@ -125,7 +126,7 @@ $optimalSleepHours = max(1.0, min(16.0, (float) ($settings['sleep']['optimal_hou
(string) ($item['heart_rate_label'] ?? ''), (string) ($item['heart_rate_label'] ?? ''),
], static function (string $value): bool { ], static function (string $value): bool {
$value = trim($value); $value = trim($value);
return $value !== '' && !preg_match('/^-\s*(Distanz|Energie|Puls|Route)(?:-?Label)?:?$/u', $value); return $value !== '' && !preg_match('/^-\s*(Distanz|Energie|Puls|Route|Tief|Tiefschlaf|REM|REM-Schlaf|Kern|Kernschlaf)(?:-?Label)?:?(?:\s*[0-9]+(?:[,.][0-9]+)?)?$/u', $value);
})); ?> })); ?>
<?php $eventPayload = encode_payload([ <?php $eventPayload = encode_payload([
'id' => (string) ($item['id'] ?? ''), 'id' => (string) ($item['id'] ?? ''),
@@ -190,12 +191,12 @@ $optimalSleepHours = max(1.0, min(16.0, (float) ($settings['sleep']['optimal_hou
<?php foreach (['deep' => ['Tief', 'deep'], 'rem' => ['REM', 'rem'], 'core' => ['Kern', 'core']] as $phase => [$label, $class]): ?> <?php foreach (['deep' => ['Tief', 'deep'], 'rem' => ['REM', 'rem'], 'core' => ['Kern', 'core']] as $phase => [$label, $class]): ?>
<?php $phaseHours = max(0.0, (float) ($sleepPhases[$phase] ?? 0)); ?> <?php $phaseHours = max(0.0, (float) ($sleepPhases[$phase] ?? 0)); ?>
<?php if ($phaseHours <= 0) { continue; } ?> <?php if ($phaseHours <= 0) { continue; } ?>
<span class="sleep-phase-bar__segment sleep-phase-bar__segment--<?= e($class) ?>" style="flex-grow: <?= e((string) max(0.1, $phaseHours)) ?>"> <span class="sleep-phase-bar__segment sleep-phase-bar__segment--<?= e($class) ?>" style="flex-grow: <?= e((string) max(0.1, $phaseHours)) ?>" title="<?= e($label) ?>: <?= e(format_points($phaseHours)) ?> h">
<strong><?= e($label) ?></strong> <?= e(format_points($phaseHours)) ?> h <strong><?= e($label) ?></strong> <?= e(format_points($phaseHours)) ?> h
</span> </span>
<?php endforeach; ?> <?php endforeach; ?>
<?php if ($sleepPhaseRemainder > 0): ?> <?php if ($sleepPhaseRemainder > 0): ?>
<span class="sleep-phase-bar__segment sleep-phase-bar__segment--rest" style="flex-grow: <?= e((string) max(0.1, $sleepPhaseRemainder)) ?>"></span> <span class="sleep-phase-bar__segment sleep-phase-bar__segment--rest" style="flex-grow: <?= e((string) max(0.1, $sleepPhaseRemainder)) ?>" title="Nicht phasenzugeordnet: <?= e(format_points($sleepPhaseRemainder)) ?> h"></span>
<?php endif; ?> <?php endif; ?>
<span class="sleep-phase-bar__target"><span><?= e(format_points($optimalSleepHours)) ?> h</span></span> <span class="sleep-phase-bar__target"><span><?= e(format_points($optimalSleepHours)) ?> h</span></span>
</div> </div>