Overlay text incomplete in mobile view

  • In mobile view header image/slider overlay text <p> tags (paragraph) are not displayed, h2 tag no problem, docs say use those. True for portrait or mobile view on phones, true for tablet portrait view only.

    Breakpoint set at 480.

    I added call to action button and text in p tags and obviously this is an issue for SEO as well as importantly located content disappearing which is frustrating.

    Maybe I will try to override in custom css certain unexpected theme basedmedia queries based on screen width/device – would appreciate not having to do so.

    Thanks.

Viewing 1 replies (of 1 total)
  • Thread Starter jgoldbloom

    (@jgoldbloom)

    Followup, running 10.0.20/Premier with child theme:

    In styes.css this exists:

    @media screen and (max-width: 899px) {
...
	.header-image .overlay .opacity p,
	.slider-container.default .slider .slide .overlay .opacity p {
		display: none;
    }
}

    Requests:

    1) Show the P tags
    2) Add overlay action button support in theme header image options after text, button label, link, link title attribute, and background/border color/size. The theme should control resizing fonts etc. via media queries but please avoid !important in the styling attributes to allow override.
    3) Allow options to individually hide any overlay element in mobile view

    I accomplished all this by embedding anchor links for my own action button in the p tag and styled accordingly in my child theme complete with a media query override, looks great responsuvely.

    My point is this would be a great feature for the theme to simplify customization as not all admins are CSS gurus, and a cool feature to promote.

    Thanks!

    ???

Viewing 1 replies (of 1 total)
  • The topic ‘Overlay text incomplete in mobile view’ is closed to new replies.