AdguardTeam / AdguardTeam/AdGuardHome

Enable sticky header CSS position on top navbar

Offen
#7,080 7 Kommentare 4 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
feature request UI
Vorherrschende Sprache
TypeScript
Sterne
36.9k
Forks
2.5k
PR-Merge-Kennzahlen
Keine gemergten PRs in 30 T.

Beschreibung

### Prerequisites

- [x] I have checked the [Wiki](https://github.com/AdguardTeam/AdGuardHome/wiki) and [Discussions](https://github.com/AdguardTeam/AdGuardHome/discussions) and found no answer

- [x] I have searched other issues and found no duplicates

- [x] I want to request a feature or enhancement and not ask a question

### The problem

As I've been navigating around in the portal and scrolling I wanted the header to always be there for quick navigation. I have to scroll back up to the top to change filter views, etc. It's small but a delightful UX to have the headers stick.

### Proposed solution

Enable CSS sticky positioning on the header

In https://github.com/AdguardTeam/AdGuardHome/blob/master/client/src/components/Header/Header.css#L35-L39, updating Line 35 to:

```css
.header {
position: sticky;
top: 0;
padding: 5px 0;
z-index: 102;
}
```

Would result in this experience:

https://github.com/user-attachments/assets/7e1d9c83-4672-49eb-b412-d7eee66f99d7

### Alternatives considered and additional information

_No response_

Beitragsleitfaden

Beitragsleitfaden öffnen

Bewertung

Dieses Issue wurde noch nicht bewertet.

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.