Jump to content

List Slideshow - How to customize arrows?

Recommended Posts

  • Replies 4
  • Views 404
  • Created
  • Last Reply

Add to Design > Custom CSS

/* left arrow */
.desktop-arrows.arrow-container.arrow-container--left button:after {
    content: "\e009";
    font-family: 'squarespace-ui-font';
    font-size: 30px;
    color: black;
    transform: rotate(
90deg
) !important;
    display: block;
}
.desktop-arrows.arrow-container.arrow-container--left svg {
    display: none;
}
/* right arrow */
.desktop-arrows.arrow-container.arrow-container--right button:after {
    content: "\e009";
    font-family: 'squarespace-ui-font';
    font-size: 30px;
    color: black;
    transform: rotate(
270deg
) !important;
    display: block;
}
.desktop-arrows.arrow-container.arrow-container--right button svg {
    display: none;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
19 hours ago, Sunrise666 said:

@tuanphan Thanks so much! 

See below the screenshots, is it possible to make the arrows thinner ( as thin as the second screenshot)? I appreciate your help!

spacer.png

spacer.png

You mean e003 icon in below link?

https://tuanphan.squarespace.com/ss-ui-fonts?noredirect

Password: abc

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Archived

This topic is now archived and is closed to further replies.


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.