Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1100718

    I have selected to use the burger menu on smartphones and tablets, yet it doesn’t seem to be working. If it is because the screen is 990 pixels then I need to force it to appear on tablets.

    Please provide code and placement of code.

    #1100883

    Hey Cheryl,

    So you want the burger menu on tablets as well? If so then please try this in Quick CSS:

    @media only screen and (max-width: 1024px) {
      nav.main_menu {
        display: block !important;
      }
      #avia-menu .menu-item {
        display: none;
      }
      .av-burger-menu-main.menu-item-avia-special {
        display: block;
      }
    }
    

    Best regards,
    Rikard

    #1101574

    Hi Rickard,
    i already tried that. it shows on the left side of the screen under logo. the header layout for mobile only shows on mobile not tablets.
    if you want to show mobile menu under the logo on the left then this script will work.

    Is there a way to show the burger menu on the right side of the screen on tablets?

    #1102289

    Hi Cherp,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
    /* Header in sidebar to turn to burger on iPad 768px */
    @media only screen and (min-width: 768px) and (max-width: 990px) {
      
            .responsive #top .av_header_transparency.av_alternate_logo_active .logo a > img{opacity:1}
            .responsive #top .av_header_transparency .logo img.alternate{display:none;}
            
            .responsive #top #wrap_all #header {position: relative; width:100%; float:none; height:auto; margin:0 !important; opacity: 1; min-height:0;}
            .responsive #top #main {padding-top:0 !important; margin:0;} 
            .responsive #top #main .container_wrap:first-child{ border-top:none; }
            .responsive.html_header_top.html_logo_center .logo { left: 0%; -webkit-transform: translate(0%, 0); -ms-transform: translate(0%, 0); transform: translate(0%, 0); margin:0; }
            .responsive .phone-info{float:none; width:100%; clear:both; text-align: center;}
            .responsive .phone-info span{margin:0;padding:0; border:none;}
            .responsive.html_header_top #header_main .social_bookmarks ,
            .responsive.html_top_nav_header #top .social_bookmarks { width:auto; margin-top:-16px; } 
            
            .responsive #top .logo{position: static; display:table; height:80px !important; float:none; padding:0; border:none; width:80%; }
            .responsive .logo a{display:table-cell; vertical-align: middle;} 
            .responsive .logo img{height:auto !important; width:auto; max-width: 100%; display: block;  max-height: 80px;}
            .responsive #header_main .container{height:auto !important; }
            .responsive #top .header_bg { opacity: 1; filter: alpha(opacity=1); }
            .responsive.social_header .phone-info {text-align: center; float:none; clear:both; margin:0; padding:0;}
            .responsive.social_header .phone-info span{border:none; width:100%; text-align: center; float:none; clear:both; margin:0; padding:0;}
            .responsive #header_meta .social_bookmarks li{ border-style:solid; border-width:1px; margin-bottom:-1px; margin-left:-1px;}
            .responsive #top #header_meta .social_bookmarks li:last-child{border-right-style: solid; border-right-width:  1px;}
            .responsive #header .sub_menu, .responsive #header_meta .sub_menu>ul{float:none; width:100%; text-align: center; margin:0 auto; position: static;}
            .responsive #header .social_bookmarks{padding-bottom:2px; width:100%; text-align: center; height:auto; line-height: 0.8em; margin:0;}
            .responsive #header_meta .sub_menu>ul>li{float:none; display: inline-block; padding: 0 10px;}
            .responsive #header .social_bookmarks li{float:none; display: inline-block;}  
            .responsive.bottom_nav_header #header_main .social_bookmarks{ position: relative; top: 0; right: 0; margin: 10px auto; clear:both;}
            .responsive.bottom_nav_header.social_header .main_menu>div{height:auto;}
            .responsive .logo img{margin:0;}
            .responsive.html_header_sidebar #top #header .social_bookmarks{display:none;}
            .responsive body.boxed#top, .responsive.html_boxed.html_header_sticky #top #header{max-width: 100%;}  
            
            .responsive.html_header_transparency #top .avia-builder-el-0 .container, .responsive.html_header_transparency #top .avia-builder-el-0 .slideshow_inner_caption{padding-top:0;}
            .responsive #top .av_phone_active_right .phone-info.with_nav span{border:none;}
            
            .responsive #top #wrap_all .av_header_transparency .main_menu ul:first-child > li > a, 
            .responsive #top #wrap_all .av_header_transparency .sub_menu > ul > li > a, 
            .responsive #top .av_header_transparency #header_main_alternate, 
            .responsive .av_header_transparency #header_main .social_bookmarks li a,
            .responsive #top #wrap_all .av_header_transparency .phone-info.with_nav span,
            .responsive #top .av_header_transparency #header_meta, 
            .responsive #top .av_header_transparency #header_meta li,
            .responsive #top #header_meta .social_bookmarks li a{ color:inherit; border-color: inherit; background: inherit;}
            .responsive.html_top_nav_header .av-logo-container{height:auto;} 
            .responsive.html_top_nav_header .av-section-bottom-logo{border-bottom-style: solid; border-bottom-width: 1px;}
            
            
          /*new mobile*/
            .responsive .av-burger-menu-main{display: block;}
            .responsive #top #wrap_all .main_menu{top:0; height:80px; left:auto; right:0; display: block; position: absolute;}
            .responsive .main_menu ul:first-child > li a { height: 80px; line-height: 80px;}
            .responsive #top .av-main-nav .menu-item{display:none;}
            .responsive #top .av-main-nav .menu-item-avia-special{display:block;}
            .responsive #top #wrap_all .menu-item-search-dropdown > a { font-size: 24px; }
            .responsive #header_main_alternate{display:none;}
            .responsive #top #header .social_bookmarks{display:none;}
            .responsive #top #header .main_menu .social_bookmarks{display:block; position: relative; margin-top: -15px;}
            .responsive #top .av-logo-container .avia-menu{height:100%;}
            .responsive #top .av-logo-container .avia-menu > li > a{line-height: 80px;}
            .responsive #top #main .av-logo-container .main_menu{display:block;}
            .responsive #top #main .av-logo-container .social_bookmarks{display:none;}
            .responsive #top #main .av-logo-container .main_menu .social_bookmarks{display:block; position: relative;}
            .responsive #top #main .av-logo-container .main_menu{display:block;}
            .responsive #top #header_main > .container .main_menu  .av-main-nav > li > a,
            .responsive #top #wrap_all .av-logo-container {height:80px; line-height:80px; }
            .responsive #top #wrap_all .av-logo-container {padding:0;}
            .responsive #top #header_main > .container .main_menu  .av-main-nav > li > a{
                min-width: 0; padding:0 0 0 20px; margin:0; border-style: none; border-width: 0;
            }
            .responsive #top .av_seperator_big_border .avia-menu.av_menu_icon_beside{border-right-style: solid; border-right-width: 1px; padding-right: 25px;}
            .responsive #top #header .av-main-nav > li > a, .responsive #top #header .av-main-nav > li > a:hover{
            background:transparent;
            color: inherit;
            }
            
            .responsive.html_top_nav_header .av-logo-container .inner-container{overflow: visible;}
            .html_header_sidebar #header .container {
              width: 90%;
            }
            .temperature {
                margin-left: 30vw !important;
                margin-top: -65px;
            }
    
    }
    

    If you need further assistance please let us know.

    Best regards,
    Victoria

    #1102611

    Hi Victoria,

    I misunderstood what my developer told me. She said that the shorter version of code worked but , but it created the burger menu on the left and I want it on the right of the header area.

    • This reply was modified 5 years, 6 months ago by Victoria.
    #1103191

    Hi Cherp,

    https://imgur.com/a/R0sLEAV I am seeing this. DO you need this to be adjusted further?

    Credentials did not work for me, please update them if you need more help.

    Best regards,
    Victoria

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.