Smaller welcome popup for mobile. Deeper simple graph colours
This commit is contained in:
fraxle
2026-06-23 13:30:14 +01:00
parent c0578bd32f
commit c090367f7c
3 changed files with 90 additions and 8 deletions
+63 -6
View File
@@ -1040,12 +1040,69 @@
transform: translateY(1px);
}
@media (max-width: 800px) {
.welcome-card {
padding: 26px 20px;
}
.welcome-title {
font-size: 1.3rem;
}
.welcome-card {
padding: 26px 20px;
margin-top: 80px; /* Ensure it sits below the fixed header */
}
.welcome-title {
font-size: 1.1rem;
}
.welcome-intro {
font-size: 0.85rem;
}
.welcome-step-text {
font-size: 0.85rem;
}
.welcome-step-title {
font-size: 0.9rem;
}
.welcome-step-body {
font-size: 0.8rem;
}
.welcome-cta {
font-size: 0.85rem;
}
.welcome-step-num {
font-size: 0.75rem;
}
margin-top: 80px; /* Ensure it sits below the fixed mobile header */
}
.welcome-title {
font-size: 1.1rem;
}
.welcome-intro {
font-size: 0.85rem;
}
.welcome-step-text {
font-size: 0.85rem;
}
.welcome-step-title {
font-size: 0.9rem;
}
.welcome-step-body {
font-size: 0.8rem;
}
.welcome-cta {
font-size: 0.85rem;
}
.welcome-step-num {
font-size: 0.75rem;
}
.welcome-intro {
font-size: 0.85rem;
}
.welcome-step-text {
font-size: 0.85rem;
}
.welcome-step-title {
font-size: 0.9rem;
}
.welcome-step-body {
font-size: 0.8rem;
}
.welcome-cta {
font-size: 0.85rem;
}
}
.utci-fetch-time {
text-align: right;
+3 -2
View File
@@ -405,6 +405,7 @@ export function UTCIForecast() {
return raw.map(c => Math.min(255, Math.round(c + (255 - c) * whiteMix)));
};
const airTempRgbStrong = (t) => airTempRgb(t, 0.42);
const airTempRgbVeryStrong = (t) => airTempRgb(t, 0.25);
// ─── 3b. PANEL COMPUTATIONS ──────────────────────────────────────────
// Derived from currentRow and the active day - no side effects.
@@ -1138,14 +1139,14 @@ export function UTCIForecast() {
<defs>
<linearGradient id="fsc-grad" x1="0" y1="0" x2="1" y2="0" gradientUnits="objectBoundingBox">
${fscSrc.map((r, j) => {
const rgb = airTempRgb(getT(r)) || [200, 200, 200];
const rgb = airTempRgbStrong(getT(r)) || [200, 200, 200];
const fc = `rgb(${rgb[0]},${rgb[1]},${rgb[2]})`;
return html`<stop key=${j} offset=${`${((j + 0.5) / fscSrc.length * 100).toFixed(1)}%`} stop-color=${fc} />`;
})}
</linearGradient>
<linearGradient id="fsc-grad-strong" x1="0" y1="0" x2="1" y2="0" gradientUnits="objectBoundingBox">
${fscSrc.map((r, j) => {
const rgb = airTempRgbStrong(getT(r)) || [200, 200, 200];
const rgb = airTempRgbVeryStrong(getT(r)) || [200, 200, 200];
const fc = `rgb(${rgb[0]},${rgb[1]},${rgb[2]})`;
return html`<stop key=${`s${j}`} offset=${`${((j + 0.5) / fscSrc.length * 100).toFixed(1)}%`} stop-color=${fc} />`;
})}