Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • April 23, 2020 at 2:19 pm #1206526
    msc4812

    Hi,
    how can we the size of the “Fullwidth Easy Slider” icons be adjustet. Try to make them smaller when they are presented at a responsive frontend using follwoing quick css code.

    .responsive#top .avia-slideshow-arrows a {
    font-size: 10px !important;
    }
    #top .avia-slideshow-arrows a {
    font-size: 20px !important;
    }

    #top .av-control-minimal .avia-slideshow-arrows a:before {
    border: 2px solid transparent !important;
    }

    Any sugestions?
    THX

    April 23, 2020 at 8:29 pm #1206664
    Victoria

    Hey Matthias,

    Could you please give us a link to your website, we need more context to be able to help you.

    Could you please attach a mockup of what you’re trying to achieve?

    Best regards,
    Victoria

    April 23, 2020 at 9:19 pm #1206688
    msc4812

    Please find attached the screen shot. Those icons marked in red circels should shrink on small displays. eg. mobile phones!

    THX
    Matt

    April 24, 2020 at 6:14 pm #1206890
    Victoria

    Hi Matt,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
@media only screen and (max-width: 989px) {
    #top .avia-slideshow-arrows a {
        font-size: 26px !important;
    }
}

    If you need further assistance please let us know.

    Best regards,
    Victoria

    April 25, 2020 at 11:35 am #1207042
    msc4812

    Hi Victoria,

    it works. Thank you so mutch!
    Love you guys for your support.
    Cheers
    Matt

    April 26, 2020 at 1:01 am #1207149
    Nikko

    Hi Matt,

    I’m glad that Victoria could help you out :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Adjust Easy Slider Icons – responsive design’ is closed to new replies.