Beginner's guide to using SASS
sass main.sccc main.css
.parent {
color: blue;
.child {
font-size: 12px;
}
}
// Compiles to the following CSS:
.parent {
color: blue;
}
.parent .child {
font-size: 12px;
}
.parent {
font : {
family: Roboto;
size: 12px;
decoration: none;
}
}
// Which converts to the following CSS:
.parent {
font-family: ;
font-size: ;
font-decoration: ;
}
$trans-white = rgba(255,255,255,0.3);
1.5em Helvetica bold;
(key1: value1, key2: value2);
.notecard {
&:hover {
@include transform (rotatey(-180deg));
}
}
// Compiles into this CSS
.notecard:hover {
transform: (rotatey(-180deg));
}