Added support for Sass, changed variables for DRY coding and created mixins for simplifying code.

sass/partials/_mixins.scss

@@ -0,0 +1,34 @@
+// Mixin for handle rotation of degrees
+@mixin wind-rotate($degrees) {
+  -webkit-transform: rotate($degrees);
+  -moz-transform: rotate($degrees);
+  -ms-transform: rotate($degrees);
+  -o-transform: rotate($degrees);
+  transform: rotate($degrees);
+}
+
+// Function for printing out classes for weather icons
+@mixin icons($collection) {
+
+    $length: length($collection);
+    @for $i from 0 to $length {
+        $tmp: nth($collection, $i+1);
+        $name: nth($tmp, 1);
+        $val: nth($tmp, 2);
+        .#{$weather-icons-prefix}-#{$name}:before {
+            content:$val;
+        }
+    }
+
+}
+
+// Create all rotations based on steps
+@mixin wind-rotations($step,$max) {
+    $length: $max/$step;
+    @for $i from 0 to $length+1 {
+        $currStep: $i*$step;
+        .#{$weather-icons-prefix}-wind-default._#{$currStep}-deg {
+            @include wind-rotate(#{$currStep}deg);
+        }
+    }
+}

sass/partials/_variables.scss

@@ -0,0 +1,209 @@
+// Base Variables
+$weather-icons-path:          "../font";
+$WeatherIconVersion:          "1.3.0";
+$weather-icons-prefix:         wi;
+$weather-icons-font-family:    weathericons;
+
+// Glyph Names
+$collection:
+("day-cloudy-gusts", "\f000")
+("day-cloudy-windy", "\f001")
+("day-cloudy", "\f002")
+("day-fog", "\f003")
+("day-hail", "\f004")
+("day-lightning", "\f005")
+("day-rain-mix", "\f006")
+("day-rain-wind", "\f007")
+("day-rain", "\f008")
+("day-showers", "\f009")
+("day-snow", "\f00a")
+("day-sprinkle", "\f00b")
+("day-sunny-overcast", "\f00c")
+("day-sunny", "\f00d")
+("day-storm-showers", "\f00e")
+("day-thunderstorm", "\f010")
+("cloudy-gusts", "\f011")
+("cloudy-windy", "\f012")
+("cloudy", "\f013")
+("fog", "\f014")
+("hail", "\f015")
+("lightning", "\f016")
+("rain-mix", "\f017")
+("rain-wind", "\f018")
+("rain", "\f019")
+("showers", "\f01a")
+("snow", "\f01b")
+("sprinkle", "\f01c")
+("storm-showers", "\f01d")
+("thunderstorm", "\f01e")
+("windy", "\f021")
+("night-alt-cloudy-gusts", "\f022")
+("night-alt-cloudy-windy", "\f023")
+("night-alt-hail", "\f024")
+("night-alt-lightning", "\f025")
+("night-alt-rain-mix", "\f026")
+("night-alt-rain-wind", "\f027")
+("night-alt-rain", "\f028")
+("night-alt-showers", "\f029")
+("night-alt-snow", "\f02a")
+("night-alt-sprinkle", "\f02b")
+("night-alt-storm-showers", "\f02c")
+("night-alt-thunderstorm", "\f02d")
+("night-clear", "\f02e")
+("night-cloudy-gusts", "\f02f")
+("night-cloudy-windy", "\f030")
+("night-cloudy", "\f031")
+("night-hail", "\f032")
+("night-lightning", "\f033")
+("night-rain-mix", "\f034")
+("night-rain-wind", "\f035")
+("night-rain", "\f036")
+("night-showers", "\f037")
+("night-snow", "\f038")
+("night-sprinkle", "\f039")
+("night-storm-showers", "\f03a")
+("night-thunderstorm", "\f03b")
+("celsius", "\f03c")
+("cloud-down", "\f03d")
+("cloud-refresh", "\f03e")
+("cloud-up", "\f040")
+("cloud", "\f041")
+("degrees", "\f042")
+("down-left", "\f043")
+("down", "\f044")
+("fahrenheit", "\f045")
+("horizon-alt", "\f046")
+("horizon", "\f047")
+("left", "\f048")
+("_reserved_", "\f049")
+("night-fog", "\f04a")
+("refresh-alt", "\f04b")
+("refresh", "\f04c")
+("right", "\f04d")
+("sprinkles", "\f04e")
+("strong-wind", "\f050")
+("sunrise", "\f051")
+("sunset", "\f052")
+("thermometer-exterior", "\f053")
+("thermometer-internal", "\f054")
+("thermometer", "\f055")
+("tornado", "\f056")
+("up-right", "\f057")
+("up", "\f058")
+("wind-west", "\f059")
+("wind-south-west", "\f05a")
+("wind-south-east", "\f05b")
+("wind-south", "\f05c")
+("wind-north-west", "\f05d")
+("wind-north-east", "\f05e")
+("wind-north", "\f060")
+("wind-east", "\f061")
+
+// New v1.2
+("smoke", "\f062")
+("dust", "\f063")
+("snow-wind", "\f064")
+("day-snow-wind", "\f065")
+("night-snow-wind", "\f066")
+("night-alt-snow-wind", "\f067")
+("day-sleet-storm", "\f068")
+("night-sleet-storm", "\f069")
+("night-alt-sleet-storm", "\f06a")
+("day-snow-thunderstorm", "\f06b")
+("night-snow-thunderstorm", "\f06c")
+("night-alt-snow-thunderstorm", "\f06d")
+("solar-eclipse", "\f06e")
+("lunar-eclipse", "\f070")
+("meteor", "\f071")
+("hot", "\f072")
+("hurricane", "\f073")
+("smog", "\f074")
+("alien", "\f075")
+("snowflake-cold", "\f076")
+("stars", "\f077")
+
+// Moon Phases
+("old-moon-full", "\f078")
+("old-moon-waxing-gibbous", "\f079")
+("old-moon-waxing-quarter", "\f07a")
+("old-moon-waxing-crescent", "\f07b")
+("old-moon-young", "\f07c")
+("old-moon-new", "\f07d")
+("old-moon-old", "\f07e")
+("old-moon-waning-crescent", "\f080")
+("old-moon-waning-quarter", "\f081")
+("old-moon-waning-gibbous", "\f082")
+
+// More new v1.2
+("night-partly-cloudy", "\f083")
+
+// New 1.3 11-30-14
+("umbrella", "\f084")
+("day-windy", "\f085")
+("night-alt-cloudy", "\f086")
+("up-left", "\f087")
+("down-right", "\f088")
+("time-12", "\f089")
+("time-1", "\f08a")
+("time-2", "\f08b")
+("time-3", "\f08c")
+("time-4", "\f08d")
+("time-5", "\f08e")
+("time-6", "\f08f")
+("time-7", "\f090")
+("time-8", "\f091")
+("time-9", "\f092")
+("time-10", "\f093")
+("time-11", "\f094")
+
+// Moon Phases
+("moon-new", "\f095")
+("moon-waxing-cresent-1", "\f096")
+("moon-waxing-cresent-2", "\f097")
+("moon-waxing-cresent-3", "\f098")
+("moon-waxing-cresent-4", "\f099")
+("moon-waxing-cresent-5", "\f09a")
+("moon-waxing-cresent-6", "\f09b")
+("moon-first-quarter", "\f09c")
+("moon-waxing-gibbous-1", "\f09d")
+("moon-waxing-gibbous-2", "\f09e")
+("moon-waxing-gibbous-3", "\f09f")
+("moon-waxing-gibbous-4", "\f0a0")
+("moon-waxing-gibbous-5", "\f0a1")
+("moon-waxing-gibbous-6", "\f0a2")
+("moon-full", "\f0a3")
+("moon-waning-gibbous-1", "\f0a4")
+("moon-waning-gibbous-2", "\f0a5")
+("moon-waning-gibbous-3", "\f0a6")
+("moon-waning-gibbous-4", "\f0a7")
+("moon-waning-gibbous-5", "\f0a8")
+("moon-waning-gibbous-6", "\f0a9")
+("moon-3rd-quarter", "\f0aa")
+("moon-waning-crescent-1", "\f0ab")
+("moon-waning-crescent-2", "\f0ac")
+("moon-waning-crescent-3", "\f0ad")
+("moon-waning-crescent-4", "\f0ae")
+("moon-waning-crescent-5", "\f0af")
+("moon-waning-crescent-6", "\f0b0")
+
+//
+("wind-default", "\f0b1")
+("day-sleet", "\f0b2")
+("night-sleet", "\f0b3")
+("night-alt-sleet", "\f0b4")
+("sleet", "\f0b5")
+("day-haze", "\f0b6")
+("beafort-0", "\f0b7")
+("beafort-1", "\f0b8")
+("beafort-2", "\f0b9")
+("beafort-3", "\f0ba")
+("beafort-4", "\f0bb")
+("beafort-5", "\f0bc")
+("beafort-6", "\f0bd")
+("beafort-7", "\f0be")
+("beafort-8", "\f0bf")
+("beafort-9", "\f0c0")
+("beafort-10", "\f0c1")
+("beafort-11", "\f0c2")
+("beafort-12", "\f0c3")
+;

sass/weather-icons.scss

@@ -0,0 +1,9 @@
+// Import varables and mixins
+@import "partials/variables";
+@import "partials/mixins";
+
+// Create all icon classes
+@include icons($collection);
+
+// Create all wind rotation classes
+@include wind-rotations(15,345);