Hooray for me, got a new design up. Dove into this one head first using SASS, along with an additional framework/mixin called Bourbon.

For those not in the know, SASS is a parallel to CSS. It’s actually a language that allows you to use variables, nesting and function like elements called mixins. Typically the SASS will need to be run through a pre-processor to compile it into plain old CSS. If that doesn’t put a twinkle in your eye, then you need to be shown what happens when the SASS is processed to get it, just like I did.

I wrote in SASS, with a hint of Burbon:

@include font-face(libelsuit, '../fonts/libelsuit');

SASS was then translated to CSS:

@font-face {
font-family: libelsuit;
font-weight: normal;
font-style: normal;
src: url("../fonts/libelsuit.eot");
src: url("../fonts/libelsuit.eot?#iefix") format("embedded-opentype"), url("../fonts/libelsuit.woff") format("woff"), url("../fonts/libelsuit.ttf") format("truetype"), url("../fonts/libelsuit.svg#libelsuit") format("svg");
}

Get it now? That’s just the tip of the iceberg. If you code CSS by hand, I strongly suggest checking out SASS, as it can not only speed up development, but can also make it much easier to use reusable code.

Leave a Reply

Your email address will not be published. Required fields are marked *

44 + = fifty three