LG-10765 dev doc layout updates #367
Conversation
nprimak
requested review from
Jeremy1026 and
aduth
and removed request for
a team
|
The snippets.md file was just an example of how we might be able to insert the snippets into the sidebar column - but the majority of that work would happen in LG-11341 not this ticket |
|
This broke the sticky left-nav :( |
Sigh. I was testing that locally and it seemed to be working but I was worried having so many classes there might mess it up |
|
At large viewports, the main logo / navigation header isn't centered or width-constrained. Should it be?
|
anniehirshman-gsa
left a comment
anniehirshman-gsa
left a comment
There was a problem hiding this comment.
This looks great, thanks! Just a couple of suggestions:
- Set max width of header and return to top button at 100rem/1600px (or a similar breakpoint)
- Align “Edit this page” button with left edge of main content area
- Align “An official website of the United States government” text/button with left edge of logo/header
|
New widescreen screenshots of header and footer |
Co-authored-by: Jeremy Curcio <jeremy.curcio@gsa.gov>
aduth
left a comment
aduth
left a comment
There was a problem hiding this comment.
Couple non-blocking, nit-picky items, but LGTM otherwise 👍
_layouts/base.html
Outdated
| <header aria-label="hero" class="usa-dark-background usa-section--dark"> | ||
| <section class="usa-section"> |
There was a problem hiding this comment.
With BEM class conventions, I'd expect to see the modifier usa-section--dark assigned to the same element as the usa-section class. I'd also wonder if we'd need both, vs. just assigning usa-section to the <header> element.
Co-authored-by: Andrew Duthie <andrew.duthie@gsa.gov>
Layout updates for LG-10765
These updates are based on the Figma design found here
The code sidebar that will show the snippets will be hidden until LG-11341 is complete and feature flag is turned on. This ticket just adds space for that column. There is commented out code that will help whoever works on LG-11341 to add snippets.
I tried my best to adhere to the USWDS guidelines while also adding custom css where I saw no other workaround.