You can change the color of the Button by setting the "Text Color" in the Row settings to "Light.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
Hi, how can I change the colour of the buttons for the owl-carousel? also the active button.
I would also like the buttons bigger in size (double) also i need the buttons to have an outline.
Thank you.
Hey Again,
You can change the color of the Button by setting the "Text Color" in the Row settings to "Light.
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
.owl-theme[data-desktop-cols] .owl-dots .owl-dot span { transform: scale(2) !important; } .span_12.light .owl-theme[data-desktop-cols] .owl-dots .owl-dot.active span, .span_12.light .owl-theme[data-desktop-cols] .owl-dots .owl-dot:hover span { transform: scale(3) !important; }Thanks.
ThemeNectar Support Team
thank you so much for the support,
this looks better, but still not exactly how i want it.
i want the active button to be colour: #FAB412
i changed the row settings to light, but i need #FAB412. custom colour didn't work.
i have attached an image to show what i would ideally like.
thank you again.
Attached files: owl-button.jpg
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
.span_12.light .owl-theme[data-desktop-cols] .owl-dots .owl-dot span { background: #0de2b8 !important; border: 1px solid #fff !important; } .span_12.light .owl-theme[data-desktop-cols] .owl-dots .owl-dot.active span, .span_12.light .owl-theme[data-desktop-cols] .owl-dots .owl-dot:hover span { background: #FAB412 !important; }Thanks
ThemeNectar Support Team
that is perfect, amazing. thank you so much for the fast reply.
One last thing!
How can i increase the space between the dots ?
Hey Again,
Add this into the Custom CSS box in your Salient Theme Options panel (We write all Custom CSS in the Live Browser to ensure accuracy. If you cannot see any changes, make sure there is no red cross in the Custom CSS Box as any syntax error would cause all CSS under that line of code to not show up on the Frontend):
.owl-theme[data-desktop-cols] .owl-dots .owl-dot span { margin: 5px 17px !important; }Thanks
ThemeNectar Support Team
woohoo, looks amazing. great support.