gitadmin/sunscope
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

2.2.2

Browse Source 
Updated new box labels
Update about and faq
This commit is contained in:
fraxle
2026-06-02 18:39:59 +01:00
parent 91ff762c5f
commit 51e5381de6
3 changed files with 39 additions and 283 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/js/app.js
+16 -3
View File
@@ -125,7 +125,7 @@ export function UTCIForecast() {
// columns are skipped entirely. Hour always gets a blank lead cell.
const groupLabelRow = () => {
const groups = Object.keys(GROUP_ORDER);
const cells = [html`<th class="grp-label-hour" scope="col"></th>`];
const cells = [html`<th class="grp-label-hour" scope="col"><span class="grp-label-date">${glanceDate}</span></th>`];
for (const g of groups) {
const span = GROUP_ORDER[g].filter(isColVisible).length;
if (span === 0) continue;
@@ -177,7 +177,20 @@ export function UTCIForecast() {
skinType,
);
// Day's events surfaced in the "Today at a glance" box. Reuses the same
// Human-readable date for the "Day at a glance" heading, e.g. "Mon 2nd June 2026".
const glanceDate = (() => {
const key = days[selectedDay]?.key;
if (!key) return '';
const d = new Date(key + 'T00:00Z');
const wd = d.toLocaleDateString('en-GB', { weekday: 'short', timeZone: 'UTC' });
const day = d.getUTCDate();
const mon = d.toLocaleDateString('en-GB', { month: 'long', timeZone: 'UTC' });
const yr = d.getUTCFullYear();
const ord = (n => { const s = ['th', 'st', 'nd', 'rd'], v = n % 100; return s[(v - 20) % 10] || s[v] || s[0]; })(day);
return `${wd} ${day}${ord} ${mon} ${yr}`;
})();
// Day's events surfaced in the "Day at a glance" box. Reuses the same
// row shape as glanceSummary items: { icon, label, value, alert }.
const hhmm = (iso) => (iso ? iso.slice(11, 16) : '');
const eventGlanceItems = (selectedDayEvents ?? [])
@@ -921,7 +934,7 @@ export function UTCIForecast() {
${forecast && ((glanceSummary && glanceSummary.length > 0) || eventGlanceItems.length > 0) && html`
<aside class="glance-rail">
<div class="insight-panel insight-panel--glance">
<div class="insight-panel-title">Today at a glance</div>
<div class="insight-panel-title">At a glance${glanceDate ? ` · ${glanceDate}` : ''}</div>
${glanceSummary.map(({ icon, label, value, alert }) => html`
<div class=${`insight-row${alert ? ' insight-row--alert' : ''}`} key=${label}>
<span class="insight-icon">${icon}</span>