An Is This by Design, A Conflict, Or Did I Overwrite Something Else for the Mobi

  • Resolved sleeplessindc

    (@sleeplessindc)


    6 years, 8 months ago

    There is one odd problem with the page header when it goes to mobile. In desktop mode, the page header area is filled with #4777a6 as background and images if you want them.

    When my site is viewed on an iPhone 6, the colored background and images disappear and the white lettering for the website name and tagline are left displayed against the #fafafa white background and is very difficult to read even though I added a pale gray outline around the letters to make them stand out.

    I looked at your customizer.php file and I don’t see why this is happening for mobile. I also looked at the Jetpack page https://jetpack.com/support/mobile-theme/ and see that they say they support the background and images in the header:

    [blockquote]<p>
    Custom Header and Background

    The Mobile Theme respects the following custom header and background settings from your current desktop theme:

    – Custom header image
    – Custom background image or color
    – Custom background image repeat and position settings
    – Whether or not to display the header text (applies to site title and description)
    – Site title text color (if you have enabled the custom header text color in the mobile theme options)</p>
    [/blockquote]

    So it looks like I will need to install the extra functionality plugin Jetpack says is needed if I want to keep the site title text color. But that is just for the site title.

    Aaron is integrated with the Jetpack mobile thee.
    Is this a conflict of Aaron with the Jetpack mobile theme?
    Is there something I can add in my child theme that will keep the header background color, title text color, and an image if there is one?
    Or change the color of the header title text to a darker color when in mobile mode?

    • This topic was modified 6 years, 8 months ago by sleeplessindc.

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter sleeplessindc

    (@sleeplessindc)

    Problem solved. Don’t use Jetpack. This morning I got more complaints from a user about the colors. Her screenshots looked like the phone was set for a colorblind deficiency.
    My iPhone 6+ has a different color resolution than the iPhone 6 so some things will be different but what I am getting is:
    – no colored background for the header
    – Visited links that are supposed to be guardsman red show as aqua
    – Shamrock green is black
    – The Updated change flag is dark gray (supposed to be cobalt blue but on the laptop retina display it looks dark pink)
    – The red box around the competition information is not sowing at all.
    – The bright yellow background of the JoinUs box is white and has no border

    This is using the Firefox browser.

    I tried turning off the Jetpack mobile setting and voila! Everything was back to normal–best viewed in horizontal mode. The sites all look great in your mobile theme and colors are what they are supposed to be. I will try now to add a meta view for an automatic switch to horizontal when viewed on a mobile to save on scrolling.

    Theme Author Carolina Nymark

    (@poena)

    Hi
    Ah, thats great ??
    Yes, most Jetpack features should “just work” but the purpose of the Jetpack mobile theme setting is to overwrite the themes styles.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘An Is This by Design, A Conflict, Or Did I Overwrite Something Else for the Mobi’ is closed to new replies.