A merchant seeks help with two styling issues on their Shopify Dawn theme store:
Pricing Layout:
Wants product page price displayed directly below the title in bolder font
Compare-at price and discount should appear on a separate line below in smaller text
Later requests the same layout applied to collection pages, with discount amount hidden
Header Icons:
Some icons appear bold while others are regular weight
Requests all icons to have consistent, non-bold styling
Solutions Provided:
Multiple contributors offered CSS code snippets to address both issues. Implementation methods discussed include:
Adding code to theme.liquid file (before closing tag or after )
Using the Custom CSS feature in theme editor (suggested as better practice to preserve changes during theme updates)
The merchant confirmed the icon inconsistency remains unresolved and is still seeking a working solution for uniform icon appearance. Screenshots were shared for reference (store password: 4).
Summarized with AI on November 6.
AI used: claude-sonnet-4-5-20250929.
On the product page, the price layout is confusing to customers. I’d like the price to appear directly below the title in a slightly bolder font. The compare-at price and discount should be placed right below the main price in smaller text.
The icons in the header are inconsistent—two are bold, and two are regular. I’d like all the icons to have a uniform appearance.
Sharing screenshots for reference
store link: flawlesspk.com
storefront password: 4
@Dan-From-Ryviu@sahilsharma9515 wouldn’t it be better to use the Custom CSS feature within the theme editor to add CSS?
This would also allow the merchant to update their Theme?
Can you also help me change the price layout on collection page as well.. so its the “price” in line 1, “compare at price” in line 2, hide the discount amount.
