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

Add Mobile Menu Button #122

Merged
merged 5 commits into from
Sep 1, 2024
Merged

Add Mobile Menu Button #122

merged 5 commits into from
Sep 1, 2024

Conversation

vkoves
Copy link
Owner

@vkoves vkoves commented Sep 1, 2024

Description

Adds a button to open and close the header menu on mobile, and tweaks some mobile spacing to make it more compact and useful, like he search page in particular. Here's a diff:

Before After (closed) After (open)
Screenshot from 2024-08-31 22-36-47 Screenshot from 2024-08-31 22-29-29 Screenshot from 2024-08-31 22-29-36
Screenshot from 2024-08-31 22-40-19 Screenshot from 2024-08-31 22-38-55

Fixes #7

Testing Instructions

Confirmed the mobile menu opens and closes properly and is easy to use with a keyboard.

Checklist:

  • My code follows the style guidelines of this project
  • I have performed a self-review of my own code
  • I have commented my code, particularly in hard-to-understand areas
  • I have added tests that prove my fix is effective or that my feature works
  • New and existing unit tests pass locally with my changes

@vkoves vkoves added the enhancement New feature or request label Sep 1, 2024
Copy link

netlify bot commented Sep 1, 2024

Deploy Preview for radiant-cucurucho-d09bae ready!

Name Link
🔨 Latest commit 2df5b83
🔍 Latest deploy log https://app.netlify.com/sites/radiant-cucurucho-d09bae/deploys/66d3e0bd389523000922cca0
😎 Deploy Preview https://deploy-preview-122--radiant-cucurucho-d09bae.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

focusMain(): void {
const mainHeading = document.getElementById('main-content');

mainHeading!.focus();

Check warning

Code scanning / ESLint

Disallow non-null assertions using the `!` postfix operator Warning

Forbidden non-null assertion.
@vkoves
Copy link
Owner Author

vkoves commented Sep 1, 2024

A boring UI change that passes CI, so going to admin merge!

@vkoves vkoves merged commit c984628 into main Sep 1, 2024
7 checks passed
@vkoves vkoves deleted the mobile-menu branch September 1, 2024 03:49
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Add Mobile Menu to Cleanup Header
1 participant