Move into assets folder

assets/scss/_defaults.scss

@@ -0,0 +1,41 @@
+/**
+ * Custom variables
+ */
+
+
+
+/**
+ * Base values
+ */
+
+$base-colour:            #444;
+$base-background-colour: #fff;
+$base-font-stack:        'Helvetica Neue', Helvetica, Arial, sans-serif;
+$base-font-size:         16;
+$base-line-height:       1.5;
+$base-spacing-unit:      ($base-font-size * $base-line-height) * 1px;
+
+
+/**
+ * Breakpoints
+ */
+
+$breakpoint-sm: 768px;
+$breakpoint-md: 992px;
+$breakpoint-lg: 1200px;
+
+$breakpoints: (
+  'lg' '(min-width: ' + $breakpoint-lg + ')',
+  'md' '(min-width: ' + $breakpoint-md + ') and (max-width: ' + ($breakpoint-lg - 1) + ')',
+  'sm' '(min-width: ' + $breakpoint-sm + ') and (max-width:'  + ($breakpoint-md - 1) + ')',
+  'xs' '(max-width: ' + ($breakpoint-sm - 1) + ')'
+);
+
+
+/**
+ * Grid
+ */
+
+$grid-max-width:    1200px;
+$grid-columns:      12;
+$grid-gutter:       $base-spacing-unit;

assets/scss/barebones.scss

@@ -0,0 +1,22 @@
+/**
+Theme Name: Bare Bones
+Theme URI: http://github.com/benchmarkstudios/barebones
+Author: Benchmark
+*/
+
+@import 'defaults';
+
+@import 'utilities/mixins';
+@import 'utilities/reset';
+@import 'utilities/a11y';
+@import 'utilities/responsive';
+@import 'utilities/wordpress';
+
+@import 'vendor/simple-grid/simple-grid';
+
+@import 'base/normalise';
+@import 'base/forms';
+@import 'base/lists';
+
+@import 'modules/nav';
+@import 'modules/buttons';

assets/scss/base/_forms.scss

@@ -0,0 +1,101 @@
+/**
+ * Blanket input styles for normalisation
+ */
+
+input, 
+select, 
+textarea {
+  background-color: $base-background-colour;
+  border: solid 1px $base-colour;
+  border-radius: 0;
+  color: $base-colour;
+  line-height: ($base-spacing-unit * 1.5);
+  height: ($base-spacing-unit * 1.5);
+  padding: 0 ($base-spacing-unit / 2);
+  width: 100%;
+}
+
+input[type="checkbox"], 
+input[type="radio"] {
+  background: transparent;
+  border: 0;
+  line-height: normal;
+  height: auto;
+  width: auto;
+}
+
+input[type="file"] {
+  line-height: normal;
+  height: auto;
+  padding: ($base-spacing-unit / 4) ($base-spacing-unit / 2);
+}
+
+input[disabled] {
+  background-color: whitesmoke;
+  cursor: not-allowed;
+}
+
+select {
+  line-height: normal;
+  padding: 0;
+  padding-left: ($base-spacing-unit / 2);
+}
+
+textarea {
+  min-height: ($base-spacing-unit * 4);
+  overflow: auto;
+}
+
+
+/**
+ * Form utility classes
+ */
+
+.checkbox,
+.radio {
+  display: block;
+  padding-left: $base-spacing-unit;
+  input {
+    float: left;
+    margin-left: -($base-spacing-unit);
+    margin-top: 4px;
+  }
+}
+
+.form__group {
+  margin-bottom: $base-spacing-unit;
+}
+
+.form__label {
+  display: block;
+  margin-bottom: ($base-spacing-unit / 2);
+}
+
+
+/**
+ * Input Group
+ *
+ * Allows for prepend/append of elements 
+ * (such as icons) on an input.
+ */
+
+.input-group {
+  position: relative;
+  > input {
+    padding: 0 ($base-spacing-unit * 2);
+  }
+  .input-group__addon {
+    line-height: ($base-spacing-unit * 1.5);
+    height: ($base-spacing-unit * 1.5);
+    position: absolute;
+    text-align: center;
+    top: 0;
+    width: ($base-spacing-unit * 1.5);
+    &:first-child {
+      left: 0;
+    }
+    &:last-child {
+      right: 0;
+    }
+  }
+}

assets/scss/base/_lists.scss

@@ -0,0 +1,16 @@
+ul, 
+ol {
+  margin-left: $base-spacing-unit;
+}
+
+li {
+  > ul, 
+  > ol {
+    margin-bottom: 0;
+  }
+}
+
+.list-unstyled {
+  list-style: none;
+  margin-left: 0;
+}

assets/scss/base/_normalise.scss

@@ -0,0 +1,43 @@
+body {
+  color: $base-colour;
+  font-family: $base-font-stack;
+  @include font-size($base-font-size);
+  line-height: $base-line-height;
+}
+
+a {
+  color: inherit;
+  text-decoration: none;
+}
+
+h1, 
+h2, 
+h3, 
+h4, 
+h5, 
+h6 {
+  font-weight: normal;
+}
+
+img {
+  max-width: 100%;
+  &[width],
+  &[height] {
+    max-width: none;
+  }
+}
+
+h1, 
+h2, 
+h3, 
+h4, 
+h5, 
+h6, 
+p, 
+hr, 
+ul, 
+ol,
+dl,
+address {
+  margin-bottom: $base-spacing-unit;
+}

assets/scss/modules/_buttons.scss

@@ -0,0 +1,24 @@
+.btn {
+  background-color: $base-colour;
+  color: $base-background-colour;
+  display: inline-block;
+  height: ($base-spacing-unit * 1.5);
+  line-height: ($base-spacing-unit * 1.5);
+  padding: 0 $base-spacing-unit;
+  text-align: center;
+  width: auto;
+  &::-moz-focus-inner {
+    border: 0;
+    padding: 0;
+  }
+}
+
+.btn--block {
+  display: block;
+  width: 100%;
+}
+
+.btn--link {
+  background-color: transparent;
+  color: $base-colour;
+}

assets/scss/modules/_forms.scss

@@ -0,0 +1,3 @@
+.form__group {
+  margin-bottom: $base-spacing-unit;
+}

assets/scss/modules/_nav.scss

@@ -0,0 +1,14 @@
+.nav {
+  list-style: none;
+  margin: 0;
+  > li {
+      display: inline-block;
+      margin-right: $base-spacing-unit;
+      &:last-child {
+        margin-right: 0;
+      }
+    > a {
+      display: block;
+    }
+  }
+}

assets/scss/utilities/_a11y.scss

@@ -0,0 +1,4 @@
+.sr-only {
+  font-size: 0;
+  position: absolute;
+}

assets/scss/utilities/_mixins.scss

@@ -0,0 +1,60 @@
+/*
+ * Media query to respond to a minimum size (mobile first)
+ */
+
+@mixin resp-min($size) {
+  @media screen and (min-width: $size) { 
+    @content; 
+  }
+}
+
+
+/*
+ * Media query to respond to a maximum size
+ */
+
+@mixin resp-max($size) {
+  @media screen and (max-width: $size) { 
+    @content; 
+  }
+}
+
+
+/*
+ * Output font size in px/rem
+ */
+
+@mixin font-size($px) {
+  font-size: $px + px;
+  font-size: #{$px / $base-font-size}rem;
+}
+
+
+/*
+ * Placeholder mixin for <input>
+ */
+
+@mixin placeholder() {
+  $placeholders: ":-webkit-input" ":-moz" "-moz" "-ms-input";
+  @each $placeholder in $placeholders {
+    &:#{$placeholder}-placeholder {
+      @content;
+    }
+  }
+}
+
+
+/**
+ * Clearfix
+ */
+
+@mixin clearfix() {
+  &:before,
+  &:after{
+    content: " ";
+    display: table;
+  }
+  &:after{
+    clear: both;
+  }
+}

assets/scss/utilities/_reset.scss

@@ -0,0 +1,63 @@
+* {
+  background-color: transparent;
+  border: 0;
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  text-rendering: optimizeLegibility;
+}
+
+article,
+aside,
+details,
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+main,
+menu,
+nav,
+section,
+summary {
+  display: block;
+}
+
+html {
+  background-color: white;
+  font-size: 100%;
+  min-height: 100%;
+  text-size-adjust: 100%;
+}
+
+input, 
+select, 
+textarea,
+button {
+  color: inherit;
+  display: inline-block;
+  font: inherit;
+}
+
+button {
+  cursor: pointer;
+  &[disabled] {
+    cursor: default;
+  }
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+  width: 100%;
+  th,
+  td {
+    text-align: left;
+  }
+}
+
+b,
+strong,
+th {
+  font-weight: bold;
+}

assets/scss/utilities/_responsive.scss

@@ -0,0 +1,18 @@
+@each $breakpoint in $breakpoints {
+
+  $key   : nth($breakpoint, 1);
+  $value : nth($breakpoint, 2);
+
+  .visible-#{$key} {
+    @media only screen and #{$value} {
+      display: block !important;
+    }
+  }
+
+  .hidden-#{$key} {
+    @media only screen and #{$value} {
+      display: none !important;
+    }
+  }
+
+}

assets/scss/utilities/_wordpress.scss

@@ -0,0 +1,27 @@
+.alignleft {
+  float: left;
+}
+
+img.alignleft {
+  margin-right: $base-spacing-unit;
+}
+
+.alignright {
+  float: right;
+}
+
+img.alignright {
+  margin-left : $base-spacing-unit;
+}
+
+.aligncenter {
+  display: block;
+  margin: {
+    left: auto;
+    right: auto;
+  }
+}
+
+img.aligncenter {
+  margin-bottom: $base-spacing-unit;
+}