Merge pull request #17258 from overleaf/mf-fix-active-state-persisted-navbar-toggle

[web] Fix navbar toggle persisted active state on mobile

GitOrigin-RevId: 46e6962bc5ff003fd131419b94d7a04df3b619c6
This commit is contained in:
M Fahru 2024-03-25 08:05:36 -07:00 committed by Copybot
parent 6fef715316
commit b874d932c2
3 changed files with 20 additions and 12 deletions

View file

@ -5,7 +5,7 @@ nav.navbar.navbar-default.navbar-main
button.navbar-toggle.collapsed(
type="button",
data-toggle="collapse",
data-target="[data-ol-navbar-main-collapse]"
data-target="#navbar-main-collapse"
aria-label="Toggle " + translate('navigation')
)
i.fa.fa-bars(aria-hidden="true")
@ -32,7 +32,7 @@ nav.navbar.navbar-default.navbar-main
- var canDisplaySurveyMenu = hasFeature('saas') && canDisplayAdminMenu
if (typeof(suppressNavbarRight) == "undefined")
.navbar-collapse.collapse(data-ol-navbar-main-collapse)
.navbar-collapse.collapse#navbar-main-collapse
ul.nav.navbar-nav.navbar-right
if (canDisplayAdminMenu || canDisplayAdminRedirect || canDisplaySplitTestMenu)
li.dropdown.subdued

View file

@ -5,7 +5,7 @@ nav.navbar.navbar-default.navbar-main.website-redesign-navbar
button.navbar-toggle.collapsed(
type="button",
data-toggle="collapse",
data-target="[data-ol-navbar-main-collapse]"
data-target="#navbar-main-collapse"
aria-label="Toggle " + translate('navigation')
)
i.fa.fa-bars(aria-hidden="true")
@ -32,7 +32,7 @@ nav.navbar.navbar-default.navbar-main.website-redesign-navbar
- var canDisplaySurveyMenu = hasFeature('saas') && canDisplayAdminMenu
if (typeof(suppressNavbarRight) == "undefined")
.navbar-collapse.collapse(data-ol-navbar-main-collapse)
.navbar-collapse.collapse#navbar-main-collapse
ul.nav.navbar-nav.navbar-right
if (canDisplayAdminMenu || canDisplayAdminRedirect || canDisplaySplitTestMenu)
li.dropdown.subdued

View file

@ -508,13 +508,17 @@
}
.navbar-toggle {
border-color: @navbar-default-toggle-border-color;
color: @navbar-default-link-color;
&:hover,
&.active {
&.collapsed {
border-color: @navbar-default-toggle-border-color;
color: @navbar-default-link-color;
transition: 0.2s ease-out;
}
&:not(.collapsed) {
background-color: @navbar-default-toggle-hover-bg;
border-color: @navbar-default-toggle-hover-bg;
color: #fff;
transition: 0.2s ease-in;
}
}
@ -690,13 +694,17 @@
}
.navbar-toggle {
border-color: @navbar-default-toggle-border-color-website-redesign;
color: @navbar-default-link-color-website-redesign;
&:hover,
&.active {
&.collapsed {
border-color: @navbar-default-toggle-border-color-website-redesign;
color: @navbar-default-link-color-website-redesign;
transition: 0.2s ease-out;
}
&:not(.collapsed) {
background-color: @navbar-default-toggle-hover-bg-website-redesign;
border-color: @navbar-default-toggle-hover-bg-website-redesign;
color: #fff;
transition: 0.2s ease-in;
}
}