ConnectThink / WP-SCSS

Wordpress Plugin that compiles sass using scssphp
http://wordpress.org/plugins/wp-scss/
249 stars 76 forks source link

How to make sure the css rule generated by wp-scss override other css files? #201

Closed newjie closed 3 years ago

newjie commented 3 years ago

To elaborate, my theme has a css rule h3{line-height: 0.8em}

I want to override it by simply putting h3{line-height:1.2} in the custom scss file used by wp-scss.

gcwebsites commented 3 years ago

You need to make it important: h3{line-height:1.2 !important;}

That should work.

This has nothing to do with WP-SCSS, it is just your CSS code.

newjie commented 3 years ago

!important is not a very good practice in my case. Sometimes it messes up with other rule. I was asking how to make sure the css file generated by wp-scss be loaded after all of the other css files.

gcwebsites commented 3 years ago

Well then you would need to disable the WP-SCSS enqueue and do it through your functions.php file with it being a higher priority.

shadoath commented 3 years ago

As @gcwebsites is getting at this is more about CSS priorities than the plugin... However, you can make a _settings.scss file. Notice the _ this will skip the main compiler then you can include it into your other scss files by doing @import 'settings';

shadoath commented 3 years ago

I also believe scss files are compiled in alphabetic order which might be directly related to your use case.