I've recently used SASS to create a WordPress theme. I used a technique like this (http://css-tricks.com/compass-compiling-and-wordpress-themes/) to get SASS to compile the required CSS doc block with no issue.
Now I'm trying to use SASS to make the stylesheet for a child theme - this requires a CSS @import of the parent theme's style.css. This works fine, but it's compiling the @import before the CSS doc block! Any ideas how to render them in the intended order? I tried to put the CSS @import inside the SASS @import of a partial, but it still happens!
For example if this is my SASS:
/*!
Theme Name: Themey Name
Description: Theme Description
Version: 1.0
Template: parent-theme
*/
@import url(../parent-theme/style.css);
It is rendering out like:
@import url(../parent-theme/style.css);
/*
Theme Name: Themey Name
Description: Theme Description.
Version: 1.0
Template: parent-theme
*/
I really want that doc block first!
The problem with the @-import at the top of the file shoudl be solved according to the following comment:
Jonathan Warren Permalink to comment# OCTOBER 10, 2012 In the latest WordPress (3.4.2) you don’t need the comment block at the start of your style.css for it to be recognised, just a folder in your themes directory with an empty index.php and style.css will do.
Found in the post on: http://css-tricks.com/compass-compiling-and-wordpress-themes/
Tested this on wp 3.5.x - works fine there.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With