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.

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

feat: initial mobile header pattern #18

Merged
merged 2 commits into from
May 17, 2023

Conversation

laurelfulford
Copy link
Contributor

All Submissions:

Changes proposed in this Pull Request:

This PR adds the initial mobile header and menu styles, including icons for the open and close buttons.

The mockups I followed are:

mobile-header-2 hamburger menu 3

Known outstanding elements are:

  • Spacing - this isn't great, and not exactly following the mockups. I need to revisit this setting in theme.json, and likely set some fixed values instead of the auto-multiplied ones so we have more control.
  • Menu behaviour within this slideout -- the menu does have an on-click option, which is set in the menu in this PR, but it still "acts" like a dropdown -- it would be better if it was inline, and pushed the contents down vs. sitting on top of them.
  • RAS integration.
  • Search button sizing and spacing.

Other information:

  • Have you added an explanation of what your changes do and why you'd like us to include them?
  • Have you written new tests for your changes, as applicable?
  • Have you successfully ran tests with your changes locally?

@laurelfulford laurelfulford requested a review from a team as a code owner May 17, 2023 16:51
@laurelfulford
Copy link
Contributor Author

I'm going to go ahead and merge this PR because it largely just touches the HTML and theme.json. It does add a bit of CSS for the icons (something I also need to standardize), but it's minor.

@laurelfulford laurelfulford merged commit b088c54 into master May 17, 2023
@laurelfulford laurelfulford deleted the feat/add-mobile-header-mvp branch May 17, 2023 16:52
matticbot pushed a commit that referenced this pull request May 25, 2023
# [1.2.0-alpha.1](v1.1.0...v1.2.0-alpha.1) (2023-05-25)

### Bug Fixes

* correct block formatting error in the mobile header ([#22](#22)) ([96e727b](96e727b))
* remove style that doesn't work from theme.json ([#31](#31)) ([0762bac](0762bac))
* remove unnecessary spacing from navigation menu ([#20](#20)) ([9e8fbdd](9e8fbdd))
* replace query with HPB in no-results view ([#39](#39)) ([c77aa29](c77aa29))

### Features

* add archive, author archive templates ([#35](#35)) ([927a982](927a982))
* add block styles; tweak nav styles ([#21](#21)) ([7e2c22a](7e2c22a))
* add content width and wide width, and apply the wide width to the header/footer ([#15](#15)) ([9d53a26](9d53a26))
* add copyright symbol to footer ([#34](#34)) ([7ce6f74](7ce6f74))
* add front page template ([#23](#23)) ([7f44cfe](7f44cfe))
* add greys from WordPress to custom variables ([#25](#25)) ([08f2d7b](08f2d7b))
* add initial search template ([#36](#36)) ([6c80dba](6c80dba))
* add spacing scale ([#19](#19)) ([8c7ae41](8c7ae41))
* add styles to homepage posts block, post carousel ([#38](#38)) ([6d5f871](6d5f871))
* adding desktop header MVP ([#17](#17)) ([f155af4](f155af4))
* first pass at base fonts, colours ([#11](#11)) ([bf6b91b](bf6b91b))
* first pass at initial footer pattern ([#24](#24)) ([301852d](301852d))
* initial mobile header pattern ([#18](#18)) ([b088c54](b088c54))
* initial pass at comments styles ([#27](#27)) ([f04de4b](f04de4b))
* initial single post layout ([#26](#26)) ([603abb7](603abb7))
* update dropcap height and size, pullquotes, captions ([3d8c3f0](3d8c3f0))
@matticbot
Copy link

🎉 This PR is included in version 1.2.0-alpha.1 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

matticbot pushed a commit that referenced this pull request Jun 5, 2023
# [1.2.0](v1.1.0...v1.2.0) (2023-06-05)

### Bug Fixes

* correct block formatting error in the mobile header ([#22](#22)) ([96e727b](96e727b))
* correct spacer block values ([#42](#42)) ([05980d9](05980d9))
* remove style that doesn't work from theme.json ([#31](#31)) ([0762bac](0762bac))
* remove style.css from the theme repo ([#32](#32)) ([51d849f](51d849f))
* remove unnecessary spacing from navigation menu ([#20](#20)) ([9e8fbdd](9e8fbdd))
* replace query with HPB in no-results view ([#39](#39)) ([c77aa29](c77aa29))

### Features

* add archive, author archive templates ([#35](#35)) ([927a982](927a982))
* add block style to 'flatten' mobile nav ([#37](#37)) ([7b00671](7b00671))
* add block styles; tweak nav styles ([#21](#21)) ([7e2c22a](7e2c22a))
* add content width and wide width, and apply the wide width to the header/footer ([#15](#15)) ([9d53a26](9d53a26))
* add copyright symbol to footer ([#34](#34)) ([7ce6f74](7ce6f74))
* add front page template ([#23](#23)) ([7f44cfe](7f44cfe))
* add greys from WordPress to custom variables ([#25](#25)) ([08f2d7b](08f2d7b))
* add initial search template ([#36](#36)) ([6c80dba](6c80dba))
* add spacing scale ([#19](#19)) ([8c7ae41](8c7ae41))
* add styles to homepage posts block, post carousel ([#38](#38)) ([6d5f871](6d5f871))
* adding desktop header MVP ([#17](#17)) ([f155af4](f155af4))
* building out 404 page ([#43](#43)) ([514111e](514111e))
* first pass at base fonts, colours ([#11](#11)) ([bf6b91b](bf6b91b))
* first pass at initial footer pattern ([#24](#24)) ([301852d](301852d))
* initial mobile header pattern ([#18](#18)) ([b088c54](b088c54))
* initial pass at comments styles ([#27](#27)) ([f04de4b](f04de4b))
* initial single post layout ([#26](#26)) ([603abb7](603abb7))
* update dropcap height and size, pullquotes, captions ([3d8c3f0](3d8c3f0))
@matticbot
Copy link

🎉 This PR is included in version 1.2.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants