Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • May 24, 2017 at 2:22 pm #798901
    niallbyrne

    Hi. I have an issue like the person below:

    Hi,
    I have another question re the closed discussion:
    https://kriesi.at/support/topic/link-color-in-topbar-transparent-header/#post-782424
    The text and link colour in topbar is OK now on desktops, laptops, but on mobile and tablets the whole topbar is now not visible (on my home and 404 pages where I use transparent header). The topbar text there is all white as it should be, but on mobile devices the transparency does not work, so the topbar text is not visible.
    Could you help me, please?
    Monika

    ——————————————–

    My Issue is my home page is using a transparent background header so the top bar (above main menu + logo) is transparent. On all other pages the top bar is set to green + its rext links etc are set to white in the THEME settings.

    When I view only the home page on a mobile device – the top bar background is not green – it is on a white background. Because the text + social icons for the top bar are white they cannot be seen. Can the GREEN background be applied to the homepage header which is transparent??

    May 25, 2017 at 6:04 am #799363
    Rikard

    Hey niallbyrne,

    Please try the following in Quick CSS under Enfold->General Styling:

    @media only screen and (max-width: 767px) {
#header_meta * {
  color:#507210 !important;
}
}

    Best regards,
    Rikard

    May 25, 2017 at 10:23 am #799435
    niallbyrne

    Thanks for your reply. Your fix makes the text and social icons that colour (green) in the top bar on the homepage (which usies the transparent header). What I need is the background to be that colour instead of the links etc as when you enter any other page of the site (whicj use none transparent header and view it on mobile, the links are green and top bar background is green – making them hard to read…

    Basically I need the top bar on the home page to be the same colour as the top bar on the pages not using the transparent header

    Please see link below on mobile

    May 25, 2017 at 12:37 pm #799494
    Rikard

    Hi,

    Thanks for the feedback. Please try this instead:

    @media only screen and (max-width: 767px) {
#header_meta {
    background-color: #719430 !important;
}
}

    Best regards,
    Rikard

    June 1, 2017 at 1:16 am #802277
    Daviesj

    Hello Rikard,

    I am having the same exact problem as listed in the closed discussion:
    https://kriesi.at/support/topic/link-color-in-topbar-transparent-header/#post-782424

    I did not understand the editing process of the Quick CSS. I tried pasting suggested threads to no avail.
    How may I have my social icons appear in tablet and mobile modes?

    Best regards,
    Joshua

    June 1, 2017 at 6:12 am #802342
    John Torvik

    Hi,

    I am not seeing any problem in your site. May you provide us some screenshots?

    Best regards,
    John Torvik

    June 2, 2017 at 6:41 pm #803157
    Daviesj

    Hello John,

    The problem is in the appearance of the social boxes in both mobile and tablet displays. I only see grey squares! Please find attached a private content link to a couple screenshots.

    Best regards,
    Joshua

    June 3, 2017 at 7:07 am #803281
    Rikard

    Hi,

    Thanks for the feedback and the screenshot. The problem is that the background colour is the same as the colour of the icons. Please try this in Quick CSS to set the background to black:

    @media only screen and (max-width: 767px) {
#header_meta {
  background-color:black !important;
}
}

    Best regards,
    Rikard

    June 4, 2017 at 2:42 am #803483
    Daviesj

    Hi Rikard,

    I have pasted your suggestion into Quick CSS, but the color has not changed! Will I need to edit the custom.css to correct this problem?

    Best regards,
    Joshua

    June 4, 2017 at 7:37 am #803507
    Rikard

    Hi,

    The code I sent is applying on my end when I check your site, please try clearing your browser cache and reload a few times to see if that helps.

    Best regards,
    Rikard

    June 4, 2017 at 8:29 am #803518
    Daviesj

    That did the trick! Thanks so much Rikard :)

    June 4, 2017 at 8:53 am #803527
    Rikard

    Hi,

    Great, glad you got it working :-)

    Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

    June 5, 2017 at 4:29 am #803744
    Daviesj

    You may close it. My issue has been resolved, thanks again!

    Best regards,
    Joshua

    June 5, 2017 at 11:16 am #803813
    Rikard

    Hi,

    Thanks for letting us know. Please open a new thread if you should have any further questions or problems.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)
  • The topic ‘Top Bar Color on Mobile Device’ is closed to new replies.