🎉 Initial commit

_sass/main.scss

@@ -0,0 +1,55 @@
+// Define defaults for each variable.
+$base-font-family: "Roboto", sans-serif !default;
+$base-syntax-font: "Roboto Mono", Hack, monospace;
+$base-font-size:   16px !default;
+$medium-font-size:  $base-font-size * 0.938 !default;
+$small-font-size: $base-font-size * 0.875 !default;
+$base-font-weight: 400 !default;
+$base-line-height: 1.5 !default;
+$spacing-unit:     30px !default;
+
+// Element Color
+$light:          #ececec !default; 
+$grey:           #3B454e !default; 
+$neutral:        #f9f9f9 !default;
+$black:          #000  !default;
+$white:          #fff !default;
+$blue:           #0036c7 !default;
+$blue-light:     #d8deff !default;
+
+
+// Width of the content area
+$content-width:    780px !default;
+
+// State of device
+$on-palm:          600px !default;
+$on-mobile:        500px !default;
+$on-laptop:        780px !default;
+
+// Use media queries like this:
+
+// @include media-query($on-palm) {
+//   .wrapper {
+//     padding-right: $spacing-unit / 2;
+//     padding-left: $spacing-unit / 2;
+//   }
+// }
+
+@mixin media-query($device) {
+  @media screen and (max-width: $device) {
+    @content;
+  }
+}
+
+@mixin relative-font-size($ratio) {
+  font-size: $base-font-size * $ratio;
+}
+
+// Import Sass partials
+@import
+  "bangsring/fonts",
+  "bangsring/base",
+  "bangsring/post",
+  "bangsring/layout",
+  "bangsring/syntax"
+;