Okay
  Public Ticket #526711
Look on Mobile Devices
Closed

Comments

  • Stefanie started the conversation
    September 11, 2015 at 11:45pm

    Hi there,

    I am not that happy with the look of the theme on mobile devices.

    How can I...

    1. ... make the logo bigger?

    2. ... change the backroud color of the mobile menue?

    3. ... hide the nectar slider on mobile devices?

    4. ... change the position of the sidebar of certain pages on mobile devices?

    I attach some screenshots...


    Thanks!

  •  8,990
    Tahir replied
    September 12, 2015 at 4:17pm

    Hey ,

    Add this into the Custom CSS box located in your Salient Options panel (Make Sure there are no red cross in the Box) :
    @media only screen and (max-width: 1000px) and (min-width: 1px) {
    body header#top #logo img, #header-outer[data-permanent-transparent=\"false\"] #logo .dark-version {
        height: 54px!important;
        margin-top: -14px!important;
    }
}




div#mobile-menu {
    background-color: #696868 !important;
}


@media only screen and (max-width: 690px) and (min-width: 1px) {
    .parallax_slider_outer {
        display:none !important;
    }
}


    The sidebar is position change is not possible at the moment without custom work. Please consider hiring a freelancer over at Envato Studio for further Theme customizations as they are not provided as Support.


    Thanks

    ThemeNectar Support Team 

  • Stefanie replied
    September 12, 2015 at 9:57pm

    Hej,

    thanks so far, the slider is gone now and the menu color changed. :)

    But the logo still is not recognizable, it didn\'t changed the size... And there are no red crosses or exclamation marks in the css window - so I entered it correctly.

    And can you tell me at least please, how I can hide the sidebar on mobile devices on certain pages?

    Thanks a lot. :)


  •  8,990
    Tahir replied
    September 14, 2015 at 3:02pm

    Hey ,

    You have removed the !important from the css. The exclamation marks can be ignored.

    As to remove the sidebar: 

    @media only screen and (max-width: 690px) and (min-width: 1px) {
    .page-id-3322 #sidebar {
        display: none !important;
    }
}

    Thanks

    ThemeNectar Support Team 

  • Stefanie replied
    September 15, 2015 at 12:01am

    Thanks a LOT!!!

    Works great!

    One more: How can I change the color of the mobile search field from black to something else?

  •  8,990
    Tahir replied
    September 15, 2015 at 2:51pm

    Hey Again,

    Add this into the Custom CSS box located in your Salient Options panel (Make Sure there are no red cross in the Box) :
    #mobile-menu input[type=text]{
    background-color: #fff !important;
    border-color: #fff !important;
    box-shadow: none !important;
}

    Thanks


    ThemeNectar Support Team 

  • Stefanie replied
    September 15, 2015 at 8:55pm

    Hello again :D

    Nice - and how do I change the Font Color of the Mobile Menu and the Mobile Search?

    Thx!

  •  8,990