Drop the app name from the header
The Platinum-informed fidelity choice keeps native window chrome, so the
title bar already carries the app name and the h1 was a second copy of it.
Removes the heading and the .header h1 rule that sized it.
Consequence to eyeball: .header keeps justify-content: space-between and
now has one child, so the action controls sit at the left edge.
- Co-Authored-By
- Claude Opus 5 (1M context) <noreply@anthropic.com>
2 files changed,
+0 insertions,
-8 deletions
| 14 |
14 |
|
<div id="app">
|
| 15 |
15 |
|
<!-- Header -->
|
| 16 |
16 |
|
<header class="header">
|
| 17 |
|
- |
<h1>Balanced Breakfast</h1>
|
| 18 |
17 |
|
<div class="header-actions">
|
| 19 |
18 |
|
<label for="search-input" class="sr-only">Search items</label>
|
| 20 |
19 |
|
<input type="text" id="search-input" placeholder="Search... (/) | ? for help" class="search-input">
|
| 311 |
311 |
|
position: relative;
|
| 312 |
312 |
|
}
|
| 313 |
313 |
|
|
| 314 |
|
- |
.header h1 {
|
| 315 |
|
- |
font-size: var(--font-size-2xl);
|
| 316 |
|
- |
font-weight: 700;
|
| 317 |
|
- |
color: var(--action);
|
| 318 |
|
- |
letter-spacing: -0.5px;
|
| 319 |
|
- |
}
|
| 320 |
|
- |
|
| 321 |
314 |
|
.header-actions {
|
| 322 |
315 |
|
display: flex;
|
| 323 |
316 |
|
gap: var(--gap-peer);
|