jacobh2/F-r-ldraledigplannerare
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Flip a single holiday to a working day by clicking it

Browse Source 
The status on the right of each public holiday is now a button. Clicking
it writes an override for that one date, and clicking it back removes the
override rather than storing a row that agrees with the almanac. Because
an override is keyed on an absolute date, the same holiday in other years
is left alone — which is what was asked for and needed no schema change.

The separate badge saying an override exists stays, so the fact that a
day has been changed is not carried by the button alone.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01Ei7gCZzdd751uZtPzb1Pep
This commit is contained in:
Jacob Hagstedt
2026-09-19 14:38:45 +02:00
parent b87ad0e7ad
commit 663d5fcd92
7 changed files with 277 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/styles/components.css
+41 -1
View File
@@ -818,18 +818,58 @@ legend {
color: var(--c-text);
}
/* `.red-days-list__effective` is a real `<button>` — clicking it toggles
* that one absolute date between its statutory value and the opposite
* override (§Task8). Sized by its own (bilingual) content, not a fixed
* width, since the Swedish labels run longer than the English ones. */
.red-days-list__effective {
margin-left: auto;
font-size: var(--fs-sm);
font-weight: 500;
color: var(--c-text-muted);
background-color: var(--c-bg);
border: 1px solid var(--c-border);
border-radius: var(--radius-full);
padding: 2px var(--sp-3);
cursor: pointer;
white-space: nowrap;
transition: background-color 0.2s, border-color 0.2s, color 0.2s;
}
.red-days-list__effective:hover:not(:disabled) {
background-color: var(--c-accent-weak);
border-color: var(--c-accent);
color: var(--c-text);
}
.red-days-list__effective:focus-visible {
outline: 2px solid var(--c-accent);
outline-offset: 2px;
}
.red-days-list__effective:disabled {
opacity: 0.55;
cursor: not-allowed;
}
.red-days-list__effective--working {
background-color: var(--c-danger-weak);
color: var(--c-danger);
border-color: var(--c-danger-weak);
}
.red-days-list__loading,
.red-days-list__error {
.red-days-list__error,
.red-days-list__toggle-error {
color: var(--c-text-muted);
font-size: var(--fs-sm);
}
.red-days-list__toggle-error {
color: var(--c-danger);
margin: var(--sp-2) 0 0;
}
/* Tip Card (Optimization Tips, Översikt) — previously had no CSS at all,
* so every tip fell back to a plain `<button>` for its dismiss control
* (a solid accent-green square) and no visual grouping. The severity