Dawn Theme: Adjust sizing for mobile of Rich Text block font and Page title padding on mobile.

Store Feedback
1

Hi. Is there not an easy way to adjust text sizing on mobile in Dawn theme? Is it purely only possible through CSS coding? I have the issue on both Rich Text blocks, and also Page names. Font is way too big on the Rich text block on mobile, and there is too much padding underneath Page Titles on mobile. I am happy with the sizing/spacing of the body text, the issue is just the rich Text title + page names, or actually any section that has a title in it. Website is www.theclearingnc.co.nz Many thanks in advance.

Rich text sizing mobile issue bad.png
Rich text sizing mobile issue bad.png687×1188 290 KB

Rich text sizing good.png
Rich text sizing good.png1752×1072 465 KB

2

Hi @nz3

To complete your requests, please follow these steps:

  1. Go to Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS https://prnt.sc/i8ljAMlHJUKl
  2. Paste the code provided into the Custom CSS section.
@media screen and (max-width: 768px){
.rich-text__blocks h2.rich-text__heading {
    margin-bottom: -20px !important;
}
.rich-text__blocks > div {
    margin-top: 0 !important;
}
}
@media screen and (max-width: 768px){
h2.banner__heading {
    font-size: 30px !important;
}
}

Here is the result: https://prnt.sc/Q-6Rwd-YFvPI
https://prnt.sc/zlah9bM7iS_H

I hope this helps

Best,

Daisy