Asciugare il mio CSS, ma vogliono mantenere la sintassi di base CSS

Question

Iniziare un nuovo progetto rotaie e abbiamo una tavolozza di colori ben ponderata, e vogliono catturare quella in un unico luogo. Di solito ho mantenuto i colori nel CSS, ma trovo io alla fine con tutti dello stesso colore in un sacco di diversi selettori, come si presenta come un colore di sfondo, colore, colore del bordo, ecc anch'io occasionalmente bisogno di accedere ai colori in Javascript. Sarebbe bello per definire solo ogni colore UNA VOLTA.

Quindi, vorrei solo per definire la mia tavolozza di colori in un modo che è riutilizzabile nel CSS e Javascript, ma io non voglio andare fino in fondo al SASS, abbandonando completamente la sintassi CSS.

C'è un plugin binari già fatto che permette questo? Potrei mettere insieme una soluzione di tipo ERB, ma non voglio farlo se qualcun altro ha qualcosa prontamente disponibili.

Answer 1

C'è un nuovo progetto chiamato fuori {} meno che suona come quello che stai cercando: http://lesscss.org /

Answer 2

MENO sembra avere un rotaie plug , e una più css come sintassi.

Answer 3

Ci sono diversi parser lato server come MENO e SASS, ma se si desidera utilizzare la mentalità palett in rettilineo CSS si deve revers il vostro pensiero. Definire stili di base come colori, font, ecc e applicare più classi a livello di tag.

[stile]

.color1 {color: red}

.color2 {color: blue}

.color3 {color: green}

.bcolor1 {color: red}

.bcolor2 {color: blue}

.bcolor3 {color: green}

[/ style]

[class tag = "bcolor2 color1"]

Questo ha funzionato molto bene per noi.

Answer 4

Altro (puro CSS) modo può essere quello di definire ogni colore una volta, e hanno i diversi selettori associati a tale definizione del colore oe, per esempio:

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