0
Welcome Guest! Login
0 items Join Now

Mobile menu + standard menu in mobile view

  • Mobile menu + standard menu in mobile view

    Posted 7 years 2 weeks ago
    • I use G5 and I would like to display both mobile menu and standard menu in mobile view
      like this :

      This image is hidden for guests.
      Please log in or register to see it.


      Thanks.
  • Re: Mobile menu + standard menu in mobile view

    Posted 7 years 2 weeks ago
    • I found a solution with Bootstrap nav component.
      1- I use a menu module with this example :
      create a dropdownmenu

      This image is hidden for guests.
      Please log in or register to see it.


      ... that I published in a MAIN section and a new position and added this class "nav-list" and "visible-phone"

      This image is hidden for guests.
      Please log in or register to see it.


      2- In a custom SCSS files (/custom/scss/) I added those code lines :
      Mobile menu :
      // larges mobiles
      @include breakpoint(large-mobile-range) {
          .g-offcanvas-toggle {
              top: 11rem;
          }

      Main section :
      #g-main {
              padding-top: 0;
              #block-menumobile {
                  padding: 16px 0;
                  background: $vert;
                  a.dropdown-toggle {
                      color: $blanc;
                  }
                  .nav-child {
                      margin-top: 16px;
                      border-radius: 0;
                      a {
                          color: $vert;
                      }
                  }
                  ul.nav-child {
                      margin-left: -15px;
                      min-width: 170px;    
                      }
                  .g-content {
                      float: right;
                      padding-bottom: 0;
                      padding-top: 0;
                      margin-bottom: 0;
                      margin-top: 0;
                  }
                  ul.nav.menu.nav-list {
                      margin-top: 0;
                  }
              }
              
          }
    • Last Edit: 7 years 2 weeks ago by Laurent BRIERE.

Time to create page: 0.097 seconds