Change sale badge from circle one to square one

[PeppePro02]

Hi i would like to change sale shape from circle one to square on like the picture , with blue color . Dawn theme , i send the website

R&D GADGETS MALTA : Online Shopping For Electronic Products Malta (rdmalta.com)

[niraj_patel]

Hello @PeppePro02

You can add code by following these steps

1. Go to Online Store → Theme → Edit code.

2. Open your theme.liquid file

3. Paste the below code before on theme.liquid

.badge{ border-radius: unset !important; }

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Do you want the font color to be blue or the background color to be blue?

[PageFly-Henry]

Hi @PeppePro02

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps:

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

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file → Save

.card__content .badge {

border-radius: unset !important;

background: #00a1ff !important;

color: white !important;

}

Hope that my solution works for you.

Best regards,

Henry | PageFly

[PeppePro02]

Hi thank you for your reply , works but still i want to increase the thickness of the border and fill the inside with blue color .

[niraj_patel]

You can add code by following these steps

1. Go to Online Store → Theme → Edit code.

2. Open your theme.liquid file

3. Paste the below code before on theme.liquid

.badge { border:3px solid #2a50db !important; background-color:#0000ff !important; }

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[PeppePro02]

Hi works thank you ! Do you have any code for change also the font and color of the word inside of the badge?

[niraj_patel]

You can add code by following these steps

1. Go to Online Store → Theme → Edit code.

2. Open your theme.liquid file

3. Paste the below code before on theme.liquid

.badge { color: #fff !important; }

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[PeppePro02]

Thank you it works! Last thing can be incresed the size of the font also , i mean SAVE $? As only change the color of it this code. Last help please

[niraj_patel]

You can add code by following these steps

1. Go to Online Store → Theme → Edit code.

2. Open your theme.liquid file

3. Paste the below code before on theme.liquid

.badge { font-size: 16px !important; }

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[PeppePro02]

Thank you works!

[niraj_patel]

Welcome @PeppePro02
Was my reply helpful? Click Like to let me know!

Thanks