feat(ui): make app header full-width and move Doctor into header controls

- Drop the fixed max-width on .header-container so the header spans the
  viewport while the card grid keeps its own content width
- Keep header icon click targets at 32px at all breakpoints and add
  role/tabindex/aria-label plus Enter/Space activation
- Relocate the Doctor trigger from the page toolbar to the header icon
  group (also available on the statistics page and in the hamburger
  menu), removing the now-unused .doctor-trigger styles
This commit is contained in:
Will Miao
2026-09-12 09:28:16 +08:00
parent 6d3f82976f
commit fe160134d0
5 changed files with 61 additions and 50 deletions
@@ -1,13 +1,3 @@
.doctor-trigger {
min-width: 120px;
position: relative;
border-color: color-mix(in srgb, var(--lora-accent) 24%, var(--border-color));
}
.doctor-trigger i {
color: var(--lora-accent);
}
.doctor-status-badge {
display: inline-flex;
align-items: center;
@@ -247,15 +237,6 @@
}
@media (max-width: 760px) {
.doctor-trigger {
min-width: auto;
padding-inline: 10px;
}
.doctor-trigger span:not(.doctor-status-badge) {
display: none;
}
.doctor-hero,
.doctor-footer {
flex-direction: column;