zombievirus

Joel finally wore me down and got me to start using Sass.

At first I found it irritating. You have to run a watcher in terminal so every time you update the scss file, it updates the corresponding css file. I would not put in proper tabbing or a space and it would error. A week of dealing with that and now I am conditioned to perfect tabbing.

I am using SCSS syntax which has brackets. I love it because it comes out looking like this:

/*SCSS HERE - FAR MORE AWESOME. HAS NESTING*/
table.hl {
margin: 2em 0;
td.ln {
text-align: right;
}
}

li {
font: {
family: serif;
weight: bold;
size: 1.2em;
}
}


Which equates to this in CSS:

/*CSS HERE*/
table.hl {
margin: 2em 0;
}
table.hl td.ln {
text-align: right;
}

li {
font-family: serif;
font-weight: bold;
font-size: 1.2em;
}


This has made it much easier to organize and find code.

You can also declare variables in SCSS, things like color, padding, margins, rounded corners, boxshadows, AKA shit you retype over and over and over, and will have to edit on a billion elements should the design change.


$blue: #3bbfce;
$margin: 16px;

.border {
padding: $margin / 2;
margin: $margin / 2;
border-color: $blue;
}


That is awesome. Right now I am using it on a prototype web application and it’s just me on the team so I am now sure how great this is when it comes to working in a group. I forsee a lot of having to convert css files to scss files every time I update. I am worried that if I can’t get my team to use sass there might be some issues with format and organization. I guess I’ll find out all that during Build Phase. Dah well.

So far my dealings with SCSS is A+++++++ would recommend to all.