Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Improve full width components (masthead and primary navigation) #192

Merged
merged 3 commits into from
Dec 19, 2023
Merged

Improve full width components (masthead and primary navigation) #192

merged 3 commits into from
Dec 19, 2023

Conversation

paulrobertlloyd
Copy link
Contributor

@paulrobertlloyd paulrobertlloyd commented Dec 18, 2023 •
edited
Loading

The 2 full width components are a little tricky to integrate and currently have overly opinionated design features (i.e. negative margins) that should be removed. Instead we can provided improved documentation on how to adjust surrounding components.

Masthead

This PR:

  • Removes the negative top margin (-10px)
  • Adds example of the component below the header component (remove its bottom border)
  • Adds example of the component below the primary navigation component
  • Adds ‘When to use this component’ section
  • Adds ‘How it works’ section
  • Adds ‘Research on this component’ section

Primary navigation

This PR:

  • Removes the negative top margin (-1px) when it appears after a phase banner (fixing Suggestion for primary navigation component #161)
  • Adds example of the component below the header component (add full width bottom border)
  • Adds example of the component below the phase banner component (remove its bottom border)
  • Adds ‘When to use this component’ section
  • Adds ‘How it works’ section
  • Adds ‘Research on this component’ section

@paulrobertlloyd paulrobertlloyd mentioned this pull request Dec 18, 2023
Merged
@paulrobertlloyd paulrobertlloyd added documentation Improvements or additions to documentation enhancement New feature or request labels Dec 18, 2023
@paulrobertlloyd paulrobertlloyd added this to the v3.0 milestone Dec 18, 2023
This was referenced Dec 18, 2023
Closed
Merged
@paulrobertlloyd paulrobertlloyd force-pushed the improve-full-width-components branch 2 times, most recently from 8afbc4f to 1e2a470 Compare December 19, 2023 00:06
frankieroberto
frankieroberto reviewed Dec 19, 2023
View reviewed changes
Copy link
Contributor

@frankieroberto frankieroberto left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice!

docs/masthead.md Show resolved Hide resolved
docs/masthead.md Show resolved Hide resolved
docs/examples/masthead-below-header.njk Show resolved Hide resolved
docs/examples/masthead-below-header.njk Outdated Show resolved Hide resolved
docs/examples/masthead-below-primary-navigation.njk Outdated Show resolved Hide resolved
docs/masthead.md Outdated Show resolved Hide resolved
docs/masthead.md Outdated Show resolved Hide resolved
docs/masthead.md Outdated Show resolved Hide resolved
@paulrobertlloyd paulrobertlloyd force-pushed the improve-full-width-components branch from 1e2a470 to def54d7 Compare December 19, 2023 10:27
@paulrobertlloyd paulrobertlloyd mentioned this pull request Dec 19, 2023
Merged
@paulrobertlloyd paulrobertlloyd force-pushed the improve-full-width-components branch 2 times, most recently from 6517aac to 237e951 Compare December 19, 2023 19:42
@paulrobertlloyd
Masthead: Improve documentation
109e154 
- Add section on how it works
- How to incorporate below header
- How to incorporate below primary navigation
- Add section on research and usage
@paulrobertlloyd
Primary navigation: Remove negative top margin below phase banner
dc02fca
@paulrobertlloyd
Primary navigation: Improve documentation
cfbd4a4 
- Add section on how it works
- How to incorporate below header
- How to incorporate below phase banner
- Add section on research and usage
@paulrobertlloyd paulrobertlloyd force-pushed the improve-full-width-components branch from 237e951 to cfbd4a4 Compare December 19, 2023 19:45
@paulrobertlloyd paulrobertlloyd merged commit fb84df2 into main Dec 19, 2023
2 checks passed
@paulrobertlloyd paulrobertlloyd deleted the improve-full-width-components branch December 19, 2023 19:47
@paulrobertlloyd paulrobertlloyd mentioned this pull request Dec 19, 2023
Closed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@frankieroberto frankieroberto frankieroberto left review comments

Assignees
No one assigned
Labels
documentation Improvements or additions to documentation enhancement New feature or request
Projects
None yet
Milestone
v3.0
Development

Successfully merging this pull request may close these issues.
2 participants
@paulrobertlloyd @frankieroberto