Tagged: 

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • July 26, 2017 at 11:52 am #830116
    KingFilly

    Hi there,

    I’m using a Top Bar on my website for phone number, email and social icon.

    On mobile it doesn’t align well. social icon, phone number and email are stacked.
    I would like to have the social icon aligned to the right, and only have phone number + email stacked and aligned to the left.
    Can you help me out?

    Link en credentials ar in the private content.

    Regards,

    Filip

    July 26, 2017 at 8:07 pm #830321
    KingFilly

    Another question:

    The dropdown on the menu at the menubutton ‘Werkwijze’ shows different font color’ when your are on the particular page.

    So i would like to know how i can change the text color of the current page from white into black.
    So the text of the dropdown menu may always be black.

    I used the following CSS:

    .header_color .main_menu .menu ul li a {
    color: black;
    }

    .header_color .main_menu .menu ul li a:hover {
    background-color: red;
    }

    July 28, 2017 at 9:44 pm #831308
    Yigit

    Hi,

    1- Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

    @media only screen and (max-width: 768px) {
.responsive #header .social_bookmarks {
    width: 30px;
}
.responsive .phone-info {
    width: 315px;
    float: left;
    clear: none;
}
}

    2- Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

    .current_page_item a, .current-menu-ancestor a {
    color: black!important;
}

    Best regards,
    Yigit

    July 28, 2017 at 11:30 pm #831337
    KingFilly

    Hi Yigit,

    Thank you for your reply.

    1. I added the code, but it seems on Iphone (5s) it still doesn’t look well. The Linked In logo is now on the right, but it isn’t on the same height as phone number / email. Does it has todo something with the width?

    2. The problem with the font color is fixed now, but now the menu text color is also black when selected. Can this stay white? So text color dropdown black and menu text white.

    Thanks

    July 31, 2017 at 1:39 pm #832110
    Yigit

    Hi,

    1- Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

    @media only screen and (max-width: 767px) {
.responsive #top #header_meta .social_bookmarks li a {
    font-size: 25px;
    top: 5px;
}}

    2- Please replace the code to following one

    .current_page_item a {
    color: black!important;
}

    Best regards,
    Yigit

    July 31, 2017 at 7:28 pm #832362
    KingFilly

    Hi Yigit,

    1: it worked thanks.
    2: we are almost there.for the ‘werkwijze’ page it works, but at the other pages the font are keep turning black. do you have a css solution for this?

    July 31, 2017 at 11:27 pm #832496
    Yigit

    Hi,

    Would you like to apply it to only active sub menu items? If so, please switch the code to following :)

    .sub-menu .current_page_item a {
    color: black!important;
}

    Best regards,
    Yigit

    August 2, 2017 at 11:35 am #833350
    KingFilly

    Super Yigit! thanks.

    I have one other question if you don’t mind.
    I’m struggling with stuff that isn’t displayed in the right order on mobile.

    For instance the ‘Over Ons’ (about us) page: (link in private section)
    If you scroll down to the ‘Don’ts’ section: it first shows logically the first the icon list, than the ‘thumb down’ icon and then the 2nd icon list.
    But it would be more logical to show the ‘thumb down’ first. Is that fixable with some code?

    Another example were it goes wrong: if you scroll up a bit on the same page you see the purple icons: Personal, transparant, etc.
    When you go to mobile screen it shows large icons underneath each other. Is it possible to influence how this is displayed? Like smaller icons and put them in 2 rows/ 2 columns?

    Hope you can help me out!

    August 2, 2017 at 11:41 am #833353
    Yigit

    Hey!

    You are welcome :)

    I am not sure if i understood the changes you would like to make clearly however this post might help – http://kriesi.at/documentation/enfold/hide-menu-itemselements-on-mobile/
    If it does not, can you please post screenshots and show how you would like to display your layout on mobile?
    You can upload your screenshots on http://imgur.com or Dropbox public folder and post the links here

    Best regards,
    Yigit

    August 2, 2017 at 4:54 pm #833555
    KingFilly

    Hi Yigit,

    See the links the images in the private content section.
    I used paint to create it. but i think you understand what i mean ;)
    This is on mobile screen ( iphone 5s)

    August 8, 2017 at 11:07 am #835780
    Ismael

    Hi,

    Please upgrade the theme to the latest version, 4.1.2 then add another “thumbs down” icon above the boxes. Edit the element then look for the Screen Options. Toggle the settings so that it will only display on mobile view, do the opposite for the original icon.

    Best regards,
    Ismael

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