Dawn Theme 5.0 - change border radius quantity selectors

Store Design

Topic summary

Goal: make the quantity selector in Dawn 5.0 match the Add to Cart button’s rounded corners (40px border radius).

What changed/solution provided:

  • A working CSS tweak was shared: “.quantity:after { border-radius: 40 px; }”.
  • Implementation: paste this at the bottom of the theme’s base.css (main stylesheet).
  • Context: the quantity selector is the input for changing item count; border-radius controls corner roundness. The solution targets the selector’s pseudo-element (:after), which fits the updated theme structure.

Follow-ups/variants:

  • To remove the rounded corners (i.e., no radius), changing 40px to 0px was suggested and confirmed as viable.
  • A user asked where to place the code: add it to the end of base.css.

Access/link notes:

  • The store was password-protected; the helper requested a shareable preview link (not an admin URL) to verify changes.

Status:

  • Original request resolved with the CSS snippet.
  • Secondary request (removing the border and confirming placement) is pending proper preview access for final verification.

Attachments: a screenshot was shared but the CSS snippet is the key detail.

Summarized with AI on January 30. AI used: gpt-5.
1

Hi there,

I wish you can help me with something. I’m not that good at coding and I’m trying to make the quantity selector same as the add to cart buttons with a corner radius (the add to cart bottom have a 40 px border radius native in the theme).

Can someone help me out? I’ve tried several solutions but nothing seems to work since the theme was recently updated.

Thanks a lot!

Mcooop

Schermata 2022-05-12 alle 15.50.29.png
Schermata 2022-05-12 alle 15.50.29.png1012×644 27.2 KB

2

@mcoooop - can you please share this page link?

3

Hi my website is not live yet and it’s password protected. What can I share to help you help me? :slightly_smiling_face:

4

@mcoooop @We will need link to that page, so you can email me link and password or send in DM here if you do not want disclose

1 Like
5

Thank you, just sent via message! I’ll be happy to share the thread and hopefully the solution with the community tho, just the link I can’t share it yet for my client’s privacy :slightly_smiling_face: Really appreciate the help!

6

Solution by @suyash1 :

.quantity:after{border-radius: 40px;}

Paste this code at the bottom of the base. css file

2 Likes
7

Hi Mcoooop

To delete the Border altogether do you just change 40px to 0px. ? Sorry Im not a coder

Thanks

8

@Reespray - yes that can work, which border do you want to remove? can you share that page link?

9

https://reespray-2.myshopify.com/admin/themes/143773761814/editor?previewPath=%2Fcart&section=template–17898426401046__cart-items&context=theme&category=gid%3A%2F%2Fshopify%2FOnlineStoreThemeSettingsCategory%2FCheckout%3Ftheme_id%3D143773761814%26first_setting_id%3Dcheckout_header_image

10

I just want to delete the border around the quantity

11

Could you kindly let me know where to add the code??

12

@Reespray - link going to admin page, can you please share the preview link?