Hi, i want a underline as described on this picture. Is it possible with a code?
Url: https://ba571d-cc.myshopify.com/
dawn theme 15.0.0
Thank you.
Topic summary
A user wants to add an underline effect to category bubbles on their Dawn 15.0.0 theme, specifically when hovering over collection items.
Initial Solution:
- First response suggested adding CSS to base.css, but this created a permanent underline rather than hover-only effect.
Working Solution:
BSS-TekLabs provided CSS code targeting .collection-list__item a.full-unstyled-link:hover with text-decoration: underline !important; to achieve the hover underline effect.
Implementation Steps:
- Navigate to theme customization
- Locate base.css or theme.css file
- Add the provided CSS code at the end
- Save changes
Status: Resolved - the hover effect now works on desktop. Discussion ended with a follow-up question about implementing the same effect on mobile version, with BSS-TekLabs beginning to provide additional code.
1 Like
Please add the CSS code below at the end of your base.css file.
.collection-list-wrapper .card__heading{
text-decoration: underline;
}
1 Like
Thank you very much for your help and time, but I only want the underline there when I move my mouse over one of the images or text as described in the image.
Best regards
- Here is the solution for you @store095
- Please follow these steps:
- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press ‘Save’ to save it.
.collection-list__item a.full-unstyled-link:hover {
text-decoration: underline !important;
}
- Here is the result you will achieve when hover:
- Please press ‘Like’ and mark it as 'Solution’ if you find it helpful. Thank you.
1 Like
Its working. Thank you. 
1 Like
You are welcome!
1 Like
Is it possible to do the same for mobile Version too?
Best Regards
1 Like
a.full-unstyled-link:hover {
text-decoration: underline !important;
}
Can you add more this code @store095
