CODEWITHSUNDEEP
ruby-on-railscsssass
ndp
ndp

Reputation: 22016

DRY out my CSS, but want to keep the basic CSS syntax

Starting a new rails project and we have a well-thought-out color palette, and want to capture that in one place. I have usually kept colors in the CSS, but I find I end up with all the same color in lots of different selectors, as it shows up as a background color, color, border color, etc. I also will occassionally need access to colors in the Javascript. It would be great to just define each color ONCE.

So I'd just like to define my color palette in a way that's re-usable in the CSS and Javascript, but I don't want to go all the way to SASS, abandoning CSS syntax completely.

Is there a rails plugin already made that allows this? I could patch together an ERB type solution, but I don't want to do it if someone else has something readily available.

Upvotes: 2

Views: 309

Answers (4)

ChrisW
ChrisW

Reputation: 56123

Another (pure CSS) way may be to define each color once, and have the several selectors associated with that oe color definition, for example:

body,
p,
#foo,
.bar {color: #802369 }

Upvotes: 0

Bernesto
Bernesto

Reputation: 1436

There are several server side parsers like LESS and SASS, but if you want to use the palett mentality in straight CSS you have to revers your thinking. Define basic styles like colors, fonts etc. and apply multiple classes at the tag level.

[style]

.color1{color:red}

.color2{color:blue}

.color3{color:green}

.bcolor1{color:red}

.bcolor2{color:blue}

.bcolor3{color:green}

[/style]

[tag class="color1 bcolor2"]

This has worked very well for us.

Upvotes: 2

alif
alif

Reputation: 619

LESS seems to have a rails plugin, and a more css like syntax.

Upvotes: 2

Raleigh Buckner
Raleigh Buckner

Reputation: 8393

There is a new project out called {less} that sounds like what you are looking for: http://lesscss.org/

Upvotes: 2

Related Questions