Please help me fix to pill instead of square selector , prestige theme

[tigrisjewelryco]

Please help me fix to pill or circle instead of square selector with ability to choose font style , prestige theme. Store password is ENZO.

Thanks!!

i want it like this 

 

[MaverickStudio]

Hey @tigrisjewelryco 

To add the rounded corner to your swatch selector add the following code
Step 1: Go to Online Store > Theme > Edit code > find  theme.css file and paste this at the bottom

.block-swatch {
	border-radius: 60px !important;
}

[Sweans · Accepted solution]

Hi @tigrisjewelryco ,

We have checked your website and follow below steps to achieve this.

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code

Step 2: Search file theme.css

Step 3: Insert the below style at the bottom of the file to make the elements shape pill/round.

.block-swatch {
border-radius: 999px !important;
line-height: 24px !important;
height: 41px !important;
}

The pill/round data in the "Size" and "Single or Pair" sections seems to require some vertical alignment adjustments. So, we have added line-height and height attributes to the selector to correct that. Please see the attached screenshot of the result on your website. <Place Screenshot here>

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.
If this solves the problem, please Mark it as Solution!

Reagrds,
Sweans