Smaller Option button Dawn theme

Store Design
, , , ,

Topic summary

A user is customizing the Dawn theme on their Shopify store (carcleansweden.se) and successfully reduced the size of “Add to Cart” buttons. However, the option/variant selector button remains larger than the other buttons, creating visual inconsistency.

Solutions Provided:

Three community members offered CSS-based fixes targeting the .quick-add__submit class:

  • Option 1: Add CSS via Theme Customizer’s Custom CSS section with min-height: 34px
  • Option 2: Insert CSS code in the theme.liquid file before the </head> tag
  • Option 3: Append CSS to base.css file with min-height: 3rem !important

All solutions adjust the minimum height of the quick-add button to match the resized Add to Cart buttons. Screenshots demonstrate the visual problem and expected result. The discussion remains open with no confirmed resolution from the original poster.

Summarized with AI on November 2. AI used: claude-sonnet-4-5-20250929.
1

Hello!

I am using the dawn theme and my website URL is: carcleansweden.se.

I recently changed the name of my option button to add to cart on Swedish and made all of the add to cart buttons smaller.

But I can’t figure out how to make the option button the same size as the other add to cart buttons:

CarCleanCC_0-1736711656248.png
CarCleanCC_0-1736711656248.png2527×1339 295 KB

I would hugely appreciate the help!

1 Like
2

Hi @CarCleanCC

You can add this code to Custom CSS in Sales Channels > Online Store > Themes > Customize > Theme settings

.quick-add__submit { min-height: 34px; }

Screenshot 2025-01-13 at 10.53.04.png
Screenshot 2025-01-13 at 10.53.04.png2566×1288 300 KB

1 Like
3

Hi @CarCleanCC

  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.liquid file
  3. In theme.liquid, paste the below code before

If you find my advice helpful please remember to LIKE and accept as SOLUTION.
Thanks!

1 Like
4

Hello @CarCleanCC
Go to online store ----> themes ----> actions ----> edit code ---->base.css
add this code at the end of the file and save.

.quick-add__submit {
min-height: 3rem !important;
}

result

137.png
137.png1344×434 126 KB

If this was helpful, hit the like button and accept the solution.
Thanks

1 Like