v2 first draft

assets/sass/barebones.scss

@@ -0,0 +1,46 @@
+/**
+Theme Name: Barebones
+Theme URI: http://github.com/benchmarkstudios/barebones
+Author: Benchmark
+*/
+
+@charset 'UTF-8';
+
+// 1. Configuration
+@import 
+    'config/variables',
+    'config/mixins';
+
+// 2. Vendors
+@import
+    'vendor/simple-grid/simple-grid';
+
+// 3. Utilities
+@import
+    'utils/reset',
+    'utils/a11y',
+    'utils/responsive',
+    'utils/helpers';
+
+// 4. Base stuff
+@import
+    'base/base',
+    'base/fonts',
+    'base/images',
+    'base/forms',
+    'base/typography';
+
+// 5. Layout-related sections
+@import
+    'layout/main',
+    'layout/header',
+    'layout/footer';
+
+// 6. Components
+@import
+    'components/buttons',
+    'components/nav';
+
+// 7. Page-specific styles
+@import
+    'pages/home';

assets/sass/base/_base.scss

@@ -0,0 +1,35 @@
+body {
+    color: $base-colour;
+    font-family: $base-font-stack;
+    @include font-size($base-font-size);
+    line-height: $base-line-height;
+}
+
+h1, 
+h2, 
+h3, 
+h4, 
+h5, 
+h6, 
+p, 
+hr, 
+ul, 
+ol,
+dl,
+address {
+    margin-bottom: $base-spacing-unit;
+}
+
+
+/**
+ * Basic styles for links
+ */
+
+a {
+    color: $brand-color;
+    text-decoration: none;
+    &:hover {
+        color: $text-color;
+        text-decoration: underline;
+    }
+}

assets/sass/base/_fonts.scss

@@ -0,0 +1,3 @@
+// -----------------------------------------------------------------------------
+// This file contains all @font-face declarations, if any.
+// -----------------------------------------------------------------------------

assets/sass/base/_forms.scss

@@ -0,0 +1,112 @@
+/**
+ * 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;
+  vertical-align: top;
+}
+
+
+/**
+ * Form utility classes
+ */
+
+.form--inline {
+  .form__group {
+    display: inline-block;
+  }
+}
+
+.checkbox,
+.radio {
+  display: block;
+  padding-left: $base-spacing-unit;
+  &.inline {
+    display: inline-block;
+  }
+  > input {
+    float: left;
+    margin-left: -($base-spacing-unit);
+    margin-top: 4px;
+  }
+}
+
+.form__group {
+  display: block;
+  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/sass/base/_images.scss

@@ -0,0 +1,8 @@
+img {
+    max-width: 100%;
+    vertical-align: top;
+    &[width],
+    &[height] {
+        max-width: none;
+    }
+}

assets/sass/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/sass/base/_typography.scss

@@ -0,0 +1,8 @@
+h1, 
+h2, 
+h3, 
+h4, 
+h5, 
+h6 {
+  font-weight: bold;
+}

assets/sass/config/_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 / 16}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/sass/config/_variables.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: 767px;
+$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 + 1) + ') and (max-width:'  + ($breakpoint-md - 1) + ')',
+  'xs' '(max-width: ' + $breakpoint-sm + ')'
+);
+
+
+/**
+ * Grid
+ */
+
+$grid-max-width:    1200px;
+$grid-columns:      12;
+$grid-gutter:       $base-spacing-unit;

assets/sass/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/sass/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/sass/utilities/_a11y.scss

@@ -0,0 +1,7 @@
+.sr-only {
+  font-size: 0;
+  height: 0;
+  overflow: hidden;
+  position: absolute;
+  width: 0;
+}

assets/sass/utilities/_helpers.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;
+}

assets/sass/utilities/_reset.scss

@@ -0,0 +1,42 @@
+* {
+  background-color: transparent;
+  border: 0;
+  box-sizing: border-box;
+  font: inherit;
+  margin: 0;
+  padding: 0;
+}
+
+html {
+  background-color: white;
+  font-size: 100%;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  -ms-text-size-adjust: 100%;
+  -webkit-text-size-adjust: 100%;
+  text-rendering: optimizeLegibility;
+}
+
+input, 
+select, 
+textarea,
+button {
+  color: inherit;
+  display: inline-block;
+  &[disabled] {
+    cursor: not-allowed;
+  }
+}
+
+button {
+  cursor: pointer;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+  th,
+  td {
+    text-align: left;
+  }
+}

assets/sass/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/sass/vendor/simple-grid

@@ -0,0 +1 @@
+Subproject commit 4cef1bf7cb635806cb07fc30cbb34ae211881570