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

Search styling tweaks #541

Merged
merged 5 commits into from
Jan 28, 2021
Merged

Search styling tweaks #541

merged 5 commits into from
Jan 28, 2021

Conversation

sloshy
Copy link
Contributor

@sloshy sloshy commented Jan 27, 2021

I noticed some CSS problems when viewing microsites w/ a search bar on my phone. I've decided to slightly change the styling so that the search bar no longer appears in these scenarios, so it can be added back later with better styling and responsiveness.

Two tweaks:

  • Smaller layouts such as phone screens should not display the search bar at this time.
  • The pattern theme uses completely different CSS and search looks unnatural there. It is disabled for now.

To do this I had to adjust the media queries to activate at slightly larger page sizes, as the search bar being so wide meant that it would break the layout. Quick video example of the first change below, to show the new media query size for the home page:

Screen.Recording.2021-01-27.at.5.49.05.PM.mov

@github-actions github-actions bot added the bug Something isn't working label Jan 27, 2021
Copy link
Contributor

@calvellido calvellido left a comment

Choose a reason for hiding this comment

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

👏👏

@sloshy sloshy merged commit a526739 into master Jan 28, 2021
@sloshy sloshy deleted the fix/search-styling-tweaks branch January 28, 2021 23:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants