Base Header

[slowbot]

Base Header

• Nested

  • Global Bar
  • Nav Primary Base
    • Variants
      • Simple
      • Mega

• Variants

  • Height
    • Basic
    • Extended
  • Background
    • Default
    • Inverted

• Notes

  • CSS is organized to mirror the structure of the original usa components reading order
  • Logos are currently svgs. I did not use the sprite because I was assuming these would be uploaded via the admin. I include multiple form factors for each logo for header and footer placements as well as mobile.
  • Secondary nav in header is positioned outside of header hat so it can conform to mobile layout.
  • Started to extract repeating variables
  • Isolated inverted values, we can talk about a more elegant way to do this.
  • Had to make some modifications to mobile navigation. PL only styles account for header offset. Relocated close button to account for design.