hnzio/nouri-App
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 18 Wiki Activity

Refine mobile planner icons and nav states

Browse Source
This commit is contained in:
Florian Heinz
2026-04-13 14:33:42 +02:00
parent d0d5bad803
commit 0d03f21a4c
7 changed files with 65 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
nouri/static/css/styles.css
+59 -13
View File
@@ -980,23 +980,46 @@ legend {
}
.day-tile-icon {
width: 2.8rem;
height: 2.8rem;
width: 2.95rem;
height: 2.95rem;
flex: 0 0 2.95rem;
display: grid;
place-items: center;
border-radius: 1rem;
background: linear-gradient(145deg, rgba(255, 255, 255, 0.92), var(--peach-soft));
color: var(--accent-strong);
border-radius: 0.9rem;
background: linear-gradient(
180deg,
color-mix(in srgb, var(--surface-soft) 72%, #fff 28%),
color-mix(in srgb, var(--surface-soft) 92%, #f7e2cf 8%)
);
border: 1px solid color-mix(in srgb, var(--accent) 26%, var(--line) 74%);
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.82),
0 10px 24px rgba(223, 177, 134, 0.12);
color: #cf8450;
}
.day-tile-icon .ui-icon {
width: 1.15rem;
height: 1.15rem;
width: 1.28rem;
height: 1.28rem;
}
[data-theme="dark"] .day-tile-icon {
background: linear-gradient(180deg, rgba(86, 74, 69, 0.98), rgba(67, 58, 55, 0.98));
border: 1px solid rgba(243, 177, 125, 0.14);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
color: #f3bf90;
}
.day-tile.has-entries .day-tile-icon {
background: linear-gradient(145deg, rgba(255, 255, 255, 0.98), color-mix(in srgb, var(--accent-soft) 68%, #fff 32%));
box-shadow: 0 10px 22px rgba(94, 68, 49, 0.14);
background: linear-gradient(
180deg,
color-mix(in srgb, var(--surface-soft) 82%, #fff 18%),
color-mix(in srgb, var(--accent-soft) 72%, #fff 28%)
);
border-color: color-mix(in srgb, var(--accent) 36%, var(--line) 64%);
box-shadow:
inset 0 1px 0 rgba(255, 255, 255, 0.84),
0 12px 26px rgba(94, 68, 49, 0.14);
}
.day-tile-summary-text {
@@ -1023,8 +1046,9 @@ legend {
}
[data-theme="dark"] .day-tile.has-entries .day-tile-icon {
background: linear-gradient(145deg, rgba(255, 255, 255, 0.12), rgba(243, 177, 125, 0.16));
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
background: linear-gradient(180deg, rgba(97, 82, 76, 0.98), rgba(76, 65, 61, 0.98));
border-color: rgba(243, 177, 125, 0.18);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
[data-theme="dark"] .day-tile.has-entries .status-pill {
@@ -1990,6 +2014,18 @@ legend {
display: none;
}
.day-tile-icon {
width: 2.8rem;
height: 2.8rem;
flex-basis: 2.8rem;
border-radius: 0.85rem;
}
.day-tile-icon .ui-icon {
width: 1.12rem;
height: 1.12rem;
}
.hero,
.page-intro,
.panel,
@@ -2169,18 +2205,28 @@ legend {
box-shadow: none;
}
[data-theme="dark"] .mobile-nav-stack .mobile-nav-button {
[data-theme="dark"] .mobile-nav-stack button.mobile-nav-button:not(.secondary):not(.ghost-button) {
background: transparent;
color: var(--muted);
border: 0;
box-shadow: none;
}
[data-theme="dark"] .mobile-nav-stack .mobile-nav-button.is-open {
[data-theme="dark"] .mobile-nav-stack button.mobile-nav-button:not(.secondary):not(.ghost-button):hover {
background: transparent;
color: var(--muted);
border: 0;
box-shadow: none;
transform: none;
}
[data-theme="dark"] .mobile-nav-stack button.mobile-nav-button.is-open:not(.secondary):not(.ghost-button),
[data-theme="dark"] .mobile-nav-stack button.mobile-nav-button.is-open:not(.secondary):not(.ghost-button):hover {
background: var(--accent-soft);
color: var(--text);
border: 0;
box-shadow: none;
transform: none;
}
[data-theme="dark"] .mobile-nav-extension .mobile-extra-button,