Sass / Scss Version of the Genesis Sample starter child theme

[blustemy]

Hi,

I’ve tested a Sass / Scss version of the Genesis stylesheet, just splitting the long style.css file into modules. Here is my sample:

https://www.dropbox.com/sh/8sxup36o1y7xlat/L1Pye2nihe

With this modular structure I find it easier to import only what I need, and modify or override only the parts I want.

I think it would be great if such a structure would be distributed with the Genesis Sample starter theme. What do yo think?

Of course using the Scss files wouldn’t be an obligation, developers could still modify the CSS file directly if they want.

Thank you,

Frédéric

https://www.dropbox.com/sh/8sxup36o1y7xlat/L1Pye2nihe

[David Chu]

Frederic,
Very impressive, bien fait! I do see requests now and then for SASS or other flavors of CSS processors, and yours is the first Genesis example that's complete that I've seen.

As long as somebody has the choice to use the SASS or just the regular CSS code, I think that's great. Personally, I find that the regular Sample CSS is so excellent that I don't feel the need for SASS, but I know that some developers want it. My guess would be that "official Genesis" may not distribute it, but might welcome it as a Github choice for those who are interested.

Let's see what other people say. I'd be especially interested in Gary Jones' opinion. 🙂

Best, Dave

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[blustemy]

Thanks for your thorough answer David!

In fact I think it would be great if the Genesis Child theme sample would be on GitHub 😉
It wouldn’t disclose too much the internals of the Genesis Framework.

Anyway a scss folder could be distributed in parallel of the standalone style.css CSS file to have the choice to work either on the Scss files, or the CSS file.

These last weeks I’ve read a lot of articles about modular design patterns (http://bradfrostweb.com/blog/post/atomic-web-design/), perhaps that’s what influences my choices!

Fred

[David Chu]

Fred,

Anyway a scss folder could be distributed in parallel of the standalone style.css CSS file to have the choice to work either on the Scss files, or the CSS file.

I agree, and that's why I think your scheme is very good. Thanks for the link to that article, tres interresant. As I read more about WP 3.7, I suppose that you could say that WP core is moving in that direction - some items, such as Post Types, Admin style changers, etc., are moving into plugins instead of being included in the core. So you could say that those are interchangeable "molecules". 🙂

Dave

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[lucaslem]

+1 for Sass on genesis starter theme!
Great work Frédéric 🙂

In fact you could put *this* up on github, no?

[David Chu]

Allo,
Interesting that Lucas would mention this today. At the risk of muddying the waters slightly, I had a Twitter convo yesterday with a guy who has made a Sample theme using LESS, another popular CSS processor variant.

https://github.com/chrisrouse/genesis-sample-less

So there is clearly some interest in getting some new flavors.

Cheers, Dave

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[lucaslem]

More of a SASS guy than LESS, but... potato, potatto.

Also, while I may have only *mentioned* this today, I have searched the forums for many months for hints that this may be in the works... should be more vocal I guess 😉

[David Chu]

I predict that it won't be part of core. Unless an enormous percentage of people want it, there's not enough impetus. Many people here are deathly afraid of even regular CSS!

The other part of this is that there are now a bunch of pre-processors - I can already hear the whining and complaining: "why did you choose SASS, when LESS is SO much better in every way!" And so on. 🙂 So how does one choose when everyone is positive that theirs is better?

Finally, WP is moving towards components in general, and putting less (oops, bad pun) into core. Everything is moving towards plugins, so there's a business opportunity for some coder to build a pre-processor plugin and charge for it. Or if they're very solicitous, they may not charge.

But I could be wrong, of course. We'll see.

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[blustemy]

Hi,

I must add Sass has been officially chosen for the WordPress Core:
http://www.wptavern.com/wordpress-core-adopts-sass-css-preprocessor

At least it’s for now on the new admin interface (MP6):
http://core.trac.wordpress.org/changeset/26137

Have a nice day,

Fred

[David Chu]

Fred,
Very interesting news! I think it makes good sense doing it this way, doing it in a particular area such as admin or plugins. If you have it "everywhere", I think that CSS people, an extremely opinionated bunch, will find it too restrictive or not to their liking.

Let's see how this shakes out. Lucas may get his wish after all.

Dave

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[malcomiles]

I predict that it won’t be part of core. Unless an enormous percentage of people want it

I want it 😀

Already using blustemi stuff, very neat dude!

[David Chu]

I was not clear above when I mentioned "core".... I meant the core of Genesis itself, as opposed to WP. 🙂 I had also seen that SASS is gradually being added to WP core.

Looking today...

I see SASS for Genesis getting a toehold in github:
https://github.com/search?q=sass+genesis&ref=cmdform

(and a few bits of SCSS there, too)

And to a (ahem) lesser extent, LESS:
https://github.com/search?q=genesis+less&ref=cmdform

And to hack the Genesis Sample yourself, here you go:
https://github.com/copyblogger/genesis-sample

There's a lot of fancy new stuff for Genesis being done on github, so anyone looking for bleeding edge geek stuff will get results sooner there.

Dave

---

Dave Chu · Custom WordPress Developer – likes collaborating with Designers

[Author]

Posts