[GeoNode-users] Collapse GeoNode NavBar

1520 gis juliermeopensourcedeveloper at gmail.com
Thu Jul 1 08:33:42 PDT 2021


Dear all,

I am in need to hide the geonode navbar on mouse out and show on mouse over
just like in 1
<https://stackoverflow.com/questions/50146726/make-a-navbar-hidden-until-mouse-hover>.
The django app is using Bootstrap4. According to W3School BootStrap4 has
.collapse class 2
<https://www.w3schools.com/bootstrap4/bootstrap_ref_all_classes.asp>. From
a BootStrap4 perspective, I am still figuring out I could use the collapse
class with hover. On the other hand, by just using css, I went through the
first attempt following something like in 3
<https://stackoverflow.com/questions/50146726/make-a-navbar-hidden-until-mouse-hover>
.

HTML

  <div id="nav_general">
            <nav id="navbar" class="navbar navbar-inverse
navbar-fixed-top" role="navigation">
            </nav>
  </div>

CSS

.home #navbar {
      display: flex;
      transform: translateY(-100%);
    }

    .home #nav_general:hover #navbar {
      transform: translateY(0);
    }

Within the *CSS* configuration the navbar was hidden forever and it is not
expanding on mouse over. Could anyone point me to the reason the navbar has
been hidden forever and how I could make it expand on mouse over? How could
I achieve the same goal by just using *BootStrap4 class=collapse*?


I appreciated your time in advance

Julierme
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.osgeo.org/pipermail/geonode-users/attachments/20210701/9487619a/attachment.html>


More information about the geonode-users mailing list