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

Fix navbar behavior on mobile devices after opening search #2438

Closed
2 tasks done
george-gca opened this issue May 24, 2024 · 0 comments
Closed
2 tasks done

Fix navbar behavior on mobile devices after opening search #2438

george-gca opened this issue May 24, 2024 · 0 comments
Labels
bug help wanted

Comments

@george-gca
Copy link
Collaborator

Have you checked that your issue isn't already filed?

  • I read through FAQ and searched through the past issues, none of which addressed my issue.
  • Yes, I have checked that this issue isn't already filed.

Bug description

After opening search on mobile device, the icon on navbar keeps being the one to close it, even though it is already closed

How to reproduce the bug

  1. Open our demo site on mobile device (or mobile view with Chrome or Firefox Dev Tools)
  2. Click to expand navbar and click on search

Error messages and logs

No response

What operating system are you using?

Not applicable (e.g. you're using GitHub Pages or other hosting)

Where are you seeing the problem on?

Running locally with Docker, Running locally without Docker, Deployed site

More info

As noted on #2415, simply removing the show class from the navbar have 2 side effects:

  1. it hides abruptly and without animation
  2. it keeps the icon on the navbar as it were opened (with an X)
@ajyey ajyey mentioned this issue May 30, 2024
Merged
george-gca pushed a commit that referenced this issue May 31, 2024
@ajyey
Bugfix: Collapse the navbar on mobile when the user selects search (#…
1ef1621 
…2462)

This PR addresses #2438 by programmatically collapsing the navbar if the
user clicks on search on mobile.

## Behavior before

![ToggleBehaviorBefore](https://github.com/alshedivat/al-folio/assets/16251412/562765b2-57eb-4a3d-bf41-eee4fcfddd5f)


## Behavior after

![ToggleBehaviorAfter](https://github.com/alshedivat/al-folio/assets/16251412/78bb917b-d7b3-4e58-bd76-f422b8ab7fd5)
siril-teja pushed a commit to siril-teja/siril-teja.github.io-old that referenced this issue Jun 19, 2024
@ajyey @siril-teja
Bugfix: Collapse the navbar on mobile when the user selects search (a…
fae8c61 
…lshedivat#2462)

This PR addresses alshedivat#2438 by programmatically collapsing the navbar if the
user clicks on search on mobile.

## Behavior before

![ToggleBehaviorBefore](https://github.com/alshedivat/al-folio/assets/16251412/562765b2-57eb-4a3d-bf41-eee4fcfddd5f)


## Behavior after

![ToggleBehaviorAfter](https://github.com/alshedivat/al-folio/assets/16251412/78bb917b-d7b3-4e58-bd76-f422b8ab7fd5)
karapostK pushed a commit to karapostK/karapostK.github.io that referenced this issue Jul 4, 2024
@ajyey @Karapost
Bugfix: Collapse the navbar on mobile when the user selects search (a…
c5eb432 
…lshedivat#2462)

This PR addresses alshedivat#2438 by programmatically collapsing the navbar if the
user clicks on search on mobile.

## Behavior before

![ToggleBehaviorBefore](https://github.com/alshedivat/al-folio/assets/16251412/562765b2-57eb-4a3d-bf41-eee4fcfddd5f)


## Behavior after

![ToggleBehaviorAfter](https://github.com/alshedivat/al-folio/assets/16251412/78bb917b-d7b3-4e58-bd76-f422b8ab7fd5)
Suraj-Bhor pushed a commit to Suraj-Bhor/suraj-bhor.github.io that referenced this issue Aug 13, 2024
@ajyey @Suraj-Bhor
Bugfix: Collapse the navbar on mobile when the user selects search (a…
ccda874 
…lshedivat#2462)

This PR addresses alshedivat#2438 by programmatically collapsing the navbar if the
user clicks on search on mobile.

## Behavior before

![ToggleBehaviorBefore](https://github.com/alshedivat/al-folio/assets/16251412/562765b2-57eb-4a3d-bf41-eee4fcfddd5f)


## Behavior after

![ToggleBehaviorAfter](https://github.com/alshedivat/al-folio/assets/16251412/78bb917b-d7b3-4e58-bd76-f422b8ab7fd5)
meiqing-wang pushed a commit to meiqing-wang/meiqing-wang.github.io that referenced this issue Oct 13, 2024
@ajyey
Bugfix: Collapse the navbar on mobile when the user selects search (a…
8c6b3d7 
…lshedivat#2462)

This PR addresses alshedivat#2438 by programmatically collapsing the navbar if the
user clicks on search on mobile.

## Behavior before

![ToggleBehaviorBefore](https://github.com/alshedivat/al-folio/assets/16251412/562765b2-57eb-4a3d-bf41-eee4fcfddd5f)


## Behavior after

![ToggleBehaviorAfter](https://github.com/alshedivat/al-folio/assets/16251412/78bb917b-d7b3-4e58-bd76-f422b8ab7fd5)
avishekanand pushed a commit to avishekanand/al-folio-homepage that referenced this issue Oct 22, 2024
@ajyey
Bugfix: Collapse the navbar on mobile when the user selects search (a…
07cd038 
…lshedivat#2462)

This PR addresses alshedivat#2438 by programmatically collapsing the navbar if the
user clicks on search on mobile.

## Behavior before

![ToggleBehaviorBefore](https://github.com/alshedivat/al-folio/assets/16251412/562765b2-57eb-4a3d-bf41-eee4fcfddd5f)


## Behavior after

![ToggleBehaviorAfter](https://github.com/alshedivat/al-folio/assets/16251412/78bb917b-d7b3-4e58-bd76-f422b8ab7fd5)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug help wanted
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@george-gca