Where can I add custom CSS in the Dawn theme for Shopify 2.0?

Mathias8hrS
Excursionist
46 0 16

Hi, 

I'm trying to transfer my store from the narrative theme to the dawn theme for shopify 2.0.

Now, I was wondering where to add custom css code to be applied to my store template? 

F.e. I added this code at the end of my theme.scss.liquid asset file in Narrative theme to have a full width page:

.page-width {
max-width: 100%;
}
.template-page .medium-up--four-fifths {
width: 100%;
left: 0 !important;
}

 

But can't really figure out in which file to paste this (& other custom CSS) in the Dawn theme code? Base.css? Another file?

 

Thank you!

Mathias

 

Replies 3 (3)

made4Uo
Shopify Partner
3804 713 1124

@Mathias8hrS  Hi. If it is a global code then base.css make sure you are not having duplication with your naming conventions

Volunteering to assist you!  Likes and Accept as Solution  is highly appreciated.✌
Coffee fuels my dedication. If helpful, a small Coffee Tip would be greatly appreciated.
Need EXPERIENCED Shopify developer without breaking the bank?
Hire us at Made4Uo.com for quick replies.
Stay in control and maintain your security by avoiding unnecessary store access!

PaulNewton
Shopify Partner
6274 573 1319

Depending on context you could also add this as a custom liquid section|block as a html style tag to specific templates or alternate templates

<style type="text/css">
/* css here */
.page-width {
    max-width: 100%;
}
.template-page .medium-up--four-fifths {
    width: 100%;
    left: 0 !important;
}
</style>

 

 

Save time & money ,Ask Questions The Smart Way


Confused? Busy? Get the solution you need paull.newton+shopifyforum@gmail.com


Problem Solved? ✔Accept and Like solutions to help future merchants

Answers powered by coffee Buy Paul a Coffee for more answers or donate to eff.org


maddmaxx
Visitor
1 0 0

TO CREATE CUSTOM CSS IN DAWN THEME

1. Create a New Asset file custom.css

2. Go to theme.liquid

3. Search For base.css and then paste this code of your new custom CSS file there   {{ 'custom.css' | asset_url | stylesheet_tag }} 

4. Now Search for custom.css and then you can put all your custom css there.