Вовед во јазикот SASS

Во овој туторијал ќе го проучуваме препроцесорот SASS. SASS е алтернатива на препроцесорот LESS, кој исто така овозможува програмирање во CSS.

Всушност, SASS има две синтаксни варијанти, првата варијанта се нарекува SASS, а втората - SCSS. И двете поддржуваат ист сет на функции и само малку се разликуваат по синтаксата. Сепак, бидејќи SCSS е понова и широко користена, во овој туторијал ние ќе ја проучуваме токму неа.

Значи, синтаксата на SCSS е слична на синтаксата на CSS, односно ќе ги видиме истите големи загради и истите наводници со точка-запирка, како и во CSS. Да разгледаме пример за синтакса на SCSS, каде веднаш доделуваме фонт и боја на променливи, по што ги доделуваме овие променливи на својствата во селекторот body:

styles.scss$font: Helvetica, sans-serif;
$color: #333;

body {
  font: $font;
  color: $color;
}