Change width of policy pages on desktop only? (dawn theme)

Store Design
, ,
1

Hi,

I changed the policy page width (privacy policy and ToS) by adding the following code to base.css:

.shopify-policy__container,
.section-template–15547176648885__main-padding {
max-width: 100% !important;
width: 75% !important;
}

It worked well on desktop but it messed things up on mobile. The content is narrower and the announcement bar looks wrong. How can I make this change only affect desktop and not mobile? (I want to leave other pages as is - I only want policy pages to be wider.)

https://thecookiediaries.ca/

pw: niltet

Thanks!

1 Like
2

Hello There,

Admin go to online store → themes → actions → edit code
Find Asset >base.css and paste this at the bottom of the file:

@media only screen and (min-width: 768px) {
.shopify-policy__container, .section-template--15547176648885__main-padding {
max-width: 100%!important;
width: 75%!important;
}
}
1 Like
3

@ZestardTech thank you so much, this worked!

1 Like
4

Hi There,

Glad that the solution worked for you!

If you love the support, please add a review on our Google Business, would be really helpful?
Zestard Technologies

Thank You in advance!

Looking forward to your support.

5

Appreciate this solution, which I’m using now. Is there a way to edit the template of the policy page to solve the issue less ‘hacky’ in Dawn theme and also make more changes to the policy page? Can’t seem to find the right file in the theme.