gantry 5 - editing custom.scss in wordpress?
-
-
- JigsawDesign
- Rocketeer
- Posts: 86
- Thanks: 1
-
Been creating a site using gantry 5 and tweaking the css to suit just using the custom css box in the settings tab in base outline.
Seemed to be working fine - however when i tried using the media queries it didnt seem to do anything.
I figured it was the path as i had just created a css file in the default location rather than following the documentation and creating a new folder called scss and putting a custom.scss file in there.
So copied all the code into the new file and put it into the newly created location - success it all worked.
My question is - is there a way to load that file now into the custom css box in the settings tab - so that i can edit it online via wordpress. Or is my only option to make all my changes and then reupload the file ?
-
-
-
- Matt
- Preeminent Rocketeer
- Posts: 22281
- Thanks: 3225
- messin' with stuff
- There's no way to merge/manage that file within your Custom CSS box... so best to just edit the file directly and reupload... seems to me the media queries ought to work in the custom css box though... make sure you're writing them in the CSS format and not the SCSS format in that box
- Last Edit: 9 years 7 months ago by Matt.
- SEARCH the forum first! These boards are rich in knowledge and vast in topics. This includes searching just the 'Solved' forums, using Google, and using ChatGPT
-
-
-
- JigsawDesign
- Rocketeer
- Posts: 86
- Thanks: 1
-
Ahh, probably where i'm going wrong then.
This was what i was using - is this wrong ?
// import breakpoints @import "dependencies"; // typically range 60rem to 74.938rem @include breakpoint(desktop-range) { .g-menu-item-content {font-size:10px !important;} } // typically 48rem to 59.938rem @include breakpoint(tablet-range) { } // typically 30rem to 47.938rem @include breakpoint(large-mobile-range) { #g-header a {font-size:8px !important;} } // typically max 30rem @include breakpoint(small-mobile-range) { #g-header a {font-size:8px !important;} } @import "nucleus/mixins/breakpoints"
-
-
-
- Matt
- Preeminent Rocketeer
- Posts: 22281
- Thanks: 3225
- messin' with stuff
- yeah, that's all SCSS... if you want to use the G5 SCSS variables (breakpoint(xxx)) you have to write it that way, in which case you have to use the custom SCSS file... SCSS gets compiled into CSS... it cannot be directly read by a browser in its uncompiled state... the Custom CSS box only supports CSS and code placed in that box is not run through the compiler
- SEARCH the forum first! These boards are rich in knowledge and vast in topics. This includes searching just the 'Solved' forums, using Google, and using ChatGPT
-
-
-
- JigsawDesign
- Rocketeer
- Posts: 86
- Thanks: 1
-
ahh right ok - so I should either use the old media queries from gantry 4
or make changes and reupload the custom.scss file ?
-
-
-
- Matt
- Preeminent Rocketeer
- Posts: 22281
- Thanks: 3225
- messin' with stuff
- Correct... Off the top of my head I'm not sure how closely the G4 breakpoints line up with the G5 ones but I think they're pretty close
- SEARCH the forum first! These boards are rich in knowledge and vast in topics. This includes searching just the 'Solved' forums, using Google, and using ChatGPT
-
Time to create page: 0.067 seconds