I’m currently working local but I’ll try my best to explain with screenshots and if need be I’ll try pushing to the staging server.
I have 4 SCSS partial files;
1 – Global
2 – Layout
3 – Page Specific
4 – Forms.
In my global partial file, I have the following – https://d.pr/i/W3AU0d
The color variables work perfectly in all partial files with no extra work, however, the breakpoints do not.
In the layout partial file I’m trying to change the font size at the tablet breakpoint. You can see here – https://d.pr/i/dBqeWw.
With the max-width set to 992px it works fine. With the max-width set to $tablet, nothing happens.