style: move Clear All button to left side next to filter buttons (Task 11.1)

Moved Clear All from right-aligned separate sibling into the
pathway-filters__buttons group. Removed justify-content: space-between
from .pathway-filters. Added thin vertical separator between
Directorates and Clear All for visual distinction.
This commit is contained in:
Andrew Charlwood
2026-02-07 00:20:11 +00:00
parent 2b997fbb4f
commit 99ccddbb98
3 changed files with 61 additions and 7 deletions
+5 -1
View File
@@ -198,11 +198,15 @@ body {
border-bottom: 2px solid var(--nhs-blue);
padding: 8px 20px;
display: flex; align-items: center;
justify-content: space-between;
}
.pathway-filters__buttons {
display: flex; align-items: center; gap: 8px;
}
.pathway-filters__separator {
width: 1px; height: 24px;
background: var(--nhs-pale-grey);
margin: 0 4px;
}
/* Toggle pills */
.toggle-pills {
+7 -6
View File
@@ -51,13 +51,14 @@ def make_filter_bar():
className="filter-btn",
n_clicks=0,
),
html.Span(className="pathway-filters__separator"),
html.Button(
"Clear All",
id="clear-all-filters",
className="filter-btn filter-btn--clear",
n_clicks=0,
),
],
),
html.Button(
"Clear All",
id="clear-all-filters",
className="filter-btn filter-btn--clear",
n_clicks=0,
),
],
)