How can I change the filter option pill shape without coding?

Store Design
, , , ,
1

Hi, I was wondering if there’s a way to change the pill shape for filter and sort results WITHOUT coding, so that there’s no rounded corners? I’m sure there’s an option in the theme editor but can’t seem to find it.
If it needs to be coded, what code would I need to make it go from this (current):

4E64F5B3-1F69-4F8C-B39A-622BA4495BA7.jpeg
4E64F5B3-1F69-4F8C-B39A-622BA4495BA7.jpeg828×1131 68.5 KB

to something like this:

3B340FC9-F7D7-450C-8C72-8DCD9F165803.jpeg
3B340FC9-F7D7-450C-8C72-8DCD9F165803.jpeg828×566 23.1 KB

any help would be amazing. Thanks :))

1 Like
2

Hello @doorstepdrip
Would you mind to share your URL website? with password if its protected.
Thanks!

3

Hey, sorry completely forgot to add my website to the original post.
its doorstepdrip.com no password needed

1 Like
4

Hello @doorstepdrip

Please added this css in your base.css file.

#FacetFiltersForm .active-facets .active-facets__button-inner{
    background-color: #e8e8e8;
    color: #000;
    font-weight: 600;
    text-transform: uppercase;
}

See this screenshot: https://prnt.sc/f7ONrINlCQZ2

Thanks.

5

I added it to base.css but nothing changed?? It looks good in the screenshot though but the code didn’t work unfortunately

6 
#FacetFiltersForm .active-facets .active-facets__button-inner{
    background-color: #e8e8e8 !important;
    color: #000 !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    border-radius: unset !important;
}

Try this one.