30 lines
1.2 KiB
Markdown
30 lines
1.2 KiB
Markdown
# navbar-branding Specification
|
|
|
|
## Purpose
|
|
TBD - created by archiving change final-touches. Update Purpose after archive.
|
|
## Requirements
|
|
### Requirement: Primary header shows logo and centered brand
|
|
The site MUST render a primary header that includes:
|
|
|
|
- a left-side logo that links to `/`
|
|
- a centered brand label "SanthoshJ" that links to `/`
|
|
- the primary navigation links (Videos, Podcast, Blog)
|
|
|
|
The logo MUST use the same visual asset as the site favicon.
|
|
|
|
#### Scenario: Desktop header layout
|
|
- **WHEN** a user loads the home page on a desktop viewport
|
|
- **THEN** the header shows the logo on the left, the brand label centered, and the nav links on the right
|
|
|
|
#### Scenario: Mobile header layout
|
|
- **WHEN** a user loads the home page on a mobile viewport
|
|
- **THEN** the header still shows the logo on the left and the brand label centered without overlapping the nav toggle
|
|
|
|
### Requirement: Logo size is visually aligned
|
|
The header logo MUST be sized to match the header rhythm and MUST not cause layout shift.
|
|
|
|
#### Scenario: Logo has fixed dimensions
|
|
- **WHEN** the header renders
|
|
- **THEN** the logo element has explicit width and height and does not change size on load
|
|
|