Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • March 10, 2016 at 11:42 am #596224
    A

    Hey, there-

    So close to putting a bow on this one! Just a few pesky mobile responsiveness details…

    mobile screenshot

    1) The page title is WAY too big. I know it’s also very long; client insists.
    UPDATE: fixed it with

    .title_container .main-title {
    margin: 0;
    font-size: 13px;
    position: relative;
    z-index: 2;
    min-height: 36px;
    line-height: 1.3em;
    padding-top: 10px;
    padding-bottom: 5px;
    letter-spacing: .04em;
    font-weight: 200;
    }
    2) The slider is smooshed. On iPhone6 viewport, the buttons on the slideshow are cut off by the section below (and are too large). I would like to leave the slider in, but this section needs to have a height which accommodates the title, caption, and buttons. Alternatively, I would be happy to have the buttons removed for mobile viewing. What media query Quick CSS could make this a reality?

    3) The color section underneath the slider should be customized for this size (padding, heading font-size).

    THANKS

    • This topic was modified 8 years, 9 months ago by A.
    March 15, 2016 at 6:20 am #598175
    Ismael

    Hey A!

    Thank you for using Enfold.

    1.) Glad you figured this out.

    2.) Add this css code to hide the buttons on mobile view:

    @media only screen and (max-width: 767px) {
#top .avia-slideshow-button {
    display: none;
}

.responsive #top .slideshow_caption h2 {
    font-size: 11px !important;
}
}

    3.) I’m not sure what you meant by this though. Could you please elaborate? A screenshot will help.

    Regards,
    Ismael

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