A munkafolyamataimat szeretem a lehető legkevesebb külső eszközzel kiegészíteni, a "kevesebb több" elv híve vagyok. Azonban olykor találok olyan segítőket, amik egyértelműen megérik a beállítás és betanulás okozta plusz vesződséget, mert hosszú távon megkönnyítik és hatékonyabbá teszik a munkát.
Többször előfordult már, hogy a kiválasztott brand szín nem tetszett a megrendelőnek. Ilyenkor mi a teendő? Elő a .css fájl, majd egy keresés-és-csere kombinációval a korábbi színkódot lecserélem az újra. Ha esetleg a különféle színvariánsokat is cserélnem kell (linkek, hátterek, stb.), akkor ugyanígy keresés-és-csere, ismételve minden színvariációra, majd mentés, és ezt követően máris kész a változtatás - elég macerás, ha egy szín több verziójával is dolgozunk.
Mi lenne, ha azt mondanám, van egy egyszerűbb módszer? Nos, igen, jól sejted, itt jön képbe a SASS, ami egy CSS preprocesszor (jaj!). A segítségével "felokosíthatjuk" a .css fájljainkat: megadhatunk bennük változókat, számításokat végezhetünk, mixineket (stílusblokkok újrahasznosítható összessége) használhatunk - ezek mind megkönnyítik a munkát. Hogy miért?
Tegyük fel, van egy oldalunk, a .css fájljának egy részlete látható alább: