Brand & layout
Change the identity consistently, then check a representative product and collection at narrow and wide widths.
Logo and navigation
Edit the wordmark and its accessible name in each included page. Keep the visible Vender dot treatment or replace it with your own identity. Update both desktop links and the mobile navigation drawer in Pro.
Customer HTML contains repeated header markup. Apply edits consistently across your pages. The author's templates/shared and sync-shell.py are development tools, not prerequisites included in the customer ZIP.
Stylesheet ownership
- Free
- assets/css/catalog.css owns the catalog presentation.
- Pro foundations
- assets/css/base.css and assets/css/home.css contain the shared foundations and cards. Some assets/css/home.css tokens override assets/css/base.css; change the active definition.
- Pro identity
- assets/css/identity.css carries the approved colour and typography treatment. Page styles load before it.
- Pro responsive
- assets/css/responsive.css loads last and owns the header breakpoints, department navigation and grid refinements.
Inspect the computed style before adding overrides. Preserve visible focus and readable text when replacing colours. The compact bag control still needs an accessible name and readable count.
Check the composition
Review 390px, 768px and 1440px widths, plus 320px for a narrow-phone check. Verify the menu, search, bag and product grids. The mobile department row intentionally scrolls within itself; the page should not acquire a horizontal scrollbar.