Shopify themes, liquid, logos, and UX
We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more
Would like to change the shape and size of the collections displayed under the "Collection list slider".
I now have 4 options, Natural, square, portrait & landscape.
I would also like to have a round shape.
I am using Stiletto theme.
Homepage url https://137c07-2.myshopify.com/
See following picture to get a better understanding of what I want.
Thanks in advance 🙂
Solved! Go to the solution
This is an accepted solution.
Add this code in your theme.css file:
.image.collection-item__image.animation--lazy-load.loaded img {
border-radius: 100%;
}
.collection-item__label {
--label-gradient-mid: none !important;
}
.collection-item__label {
text-shadow: -1px 1px 1px black !important;
color: #EEB10E !important;
}
Result:
You can change the color of the text and the shadow if you want. I've set those values because by default they're not visible, since the text and the arrow are white.
This is an accepted solution.
Add this code in your theme.css file:
.image.collection-item__image.animation--lazy-load.loaded img {
border-radius: 100%;
}
.collection-item__label {
--label-gradient-mid: none !important;
}
.collection-item__label {
text-shadow: -1px 1px 1px black !important;
color: #EEB10E !important;
}
Result:
You can change the color of the text and the shadow if you want. I've set those values because by default they're not visible, since the text and the arrow are white.
Wow thanks. Worked more than perfect.
Really appreciate you taking the time 😄
Add circular design of collection slider: