diff --git a/assets/js/script.js b/assets/js/script.js new file mode 100644 index 0000000..0f187b4 --- /dev/null +++ b/assets/js/script.js @@ -0,0 +1,7 @@ +// var $ = require('jquery'); + +(function() { + + + +})($); \ No newline at end of file diff --git a/scss/_vars.scss b/assets/scss/_defaults.scss similarity index 95% rename from scss/_vars.scss rename to assets/scss/_defaults.scss index 1039cfc..1334f8c 100755 --- a/scss/_vars.scss +++ b/assets/scss/_defaults.scss @@ -1,3 +1,9 @@ +/** + * Custom variables + */ + + + /** * Base values */ @@ -32,9 +38,4 @@ $breakpoints: ( $grid-max-width: 1200px; $grid-columns: 12; -$grid-gutter: $base-spacing-unit; - - -/** - * Custom variables - */ +$grid-gutter: $base-spacing-unit; \ No newline at end of file diff --git a/assets/scss/barebones.scss b/assets/scss/barebones.scss new file mode 100755 index 0000000..3575171 --- /dev/null +++ b/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'; \ No newline at end of file diff --git a/assets/scss/base/_forms.scss b/assets/scss/base/_forms.scss new file mode 100644 index 0000000..1383c08 --- /dev/null +++ b/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; + } + } +} diff --git a/assets/scss/base/_lists.scss b/assets/scss/base/_lists.scss new file mode 100644 index 0000000..f861912 --- /dev/null +++ b/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; +} \ No newline at end of file diff --git a/assets/scss/base/_normalise.scss b/assets/scss/base/_normalise.scss new file mode 100755 index 0000000..3c20a10 --- /dev/null +++ b/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; +} \ No newline at end of file diff --git a/scss/modules/_buttons.scss b/assets/scss/modules/_buttons.scss similarity index 72% rename from scss/modules/_buttons.scss rename to assets/scss/modules/_buttons.scss index ebe3195..7088c63 100644 --- a/scss/modules/_buttons.scss +++ b/assets/scss/modules/_buttons.scss @@ -1,11 +1,7 @@ .btn { background-color: $base-colour; - border: 0; color: $base-background-colour; - cursor: pointer; display: inline-block; - font: inherit; - font-weight: bold; height: ($base-spacing-unit * 1.5); line-height: ($base-spacing-unit * 1.5); padding: 0 $base-spacing-unit; @@ -16,3 +12,13 @@ padding: 0; } } + +.btn--block { + display: block; + width: 100%; +} + +.btn--link { + background-color: transparent; + color: $base-colour; +} \ No newline at end of file diff --git a/assets/scss/modules/_forms.scss b/assets/scss/modules/_forms.scss new file mode 100755 index 0000000..07267dc --- /dev/null +++ b/assets/scss/modules/_forms.scss @@ -0,0 +1,3 @@ +.form__group { + margin-bottom: $base-spacing-unit; +} diff --git a/scss/modules/_nav.scss b/assets/scss/modules/_nav.scss similarity index 56% rename from scss/modules/_nav.scss rename to assets/scss/modules/_nav.scss index 80268ec..8aa7ac6 100755 --- a/scss/modules/_nav.scss +++ b/assets/scss/modules/_nav.scss @@ -3,6 +3,10 @@ margin: 0; > li { display: inline-block; + margin-right: $base-spacing-unit; + &:last-child { + margin-right: 0; + } > a { display: block; } diff --git a/assets/scss/utilities/_a11y.scss b/assets/scss/utilities/_a11y.scss new file mode 100644 index 0000000..5a6ee02 --- /dev/null +++ b/assets/scss/utilities/_a11y.scss @@ -0,0 +1,4 @@ +.sr-only { + font-size: 0; + position: absolute; +} \ No newline at end of file diff --git a/scss/generic/_mixins.scss b/assets/scss/utilities/_mixins.scss similarity index 79% rename from scss/generic/_mixins.scss rename to assets/scss/utilities/_mixins.scss index 3b081fd..d612903 100755 --- a/scss/generic/_mixins.scss +++ b/assets/scss/utilities/_mixins.scss @@ -34,7 +34,7 @@ * Placeholder mixin for */ -@mixin placeholder { +@mixin placeholder() { $placeholders: ":-webkit-input" ":-moz" "-moz" "-ms-input"; @each $placeholder in $placeholders { &:#{$placeholder}-placeholder { @@ -42,3 +42,19 @@ } } } + + +/** + * Clearfix + */ + +@mixin clearfix() { + &:before, + &:after{ + content: " "; + display: table; + } + &:after{ + clear: both; + } +} \ No newline at end of file diff --git a/assets/scss/utilities/_reset.scss b/assets/scss/utilities/_reset.scss new file mode 100644 index 0000000..b45505a --- /dev/null +++ b/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; +} \ No newline at end of file diff --git a/assets/scss/utilities/_responsive.scss b/assets/scss/utilities/_responsive.scss new file mode 100644 index 0000000..55fdbd9 --- /dev/null +++ b/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; + } + } + +} \ No newline at end of file diff --git a/assets/scss/utilities/_wordpress.scss b/assets/scss/utilities/_wordpress.scss new file mode 100644 index 0000000..7e2365e --- /dev/null +++ b/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; +} \ No newline at end of file diff --git a/scss/base/_forms.scss b/scss/base/_forms.scss deleted file mode 100755 index d365205..0000000 --- a/scss/base/_forms.scss +++ /dev/null @@ -1,56 +0,0 @@ -button { - cursor: pointer; -} - -input, -select, -textarea { - background-color: $base-background-colour; - border: solid 1px $base-colour; - color: $base-colour; - display: inline-block; - font: inherit; - line-height: $base-spacing-unit; - padding: ($base-spacing-unit / 4); - width: 100%; -} - -input { - -webkit-appearance: none; - border-radius: 0; -} - -input[type="checkbox"], -input[type="radio"] { - background: transparent; - border: 0; - width: auto; -} - -label { - display: block; - font-weight: bold; -} - -select { - height: ($base-spacing-unit * 1.5); -} - -textarea { - min-height: ($base-spacing-unit * 4); -} - -.form__group { - margin-bottom: $base-spacing-unit; - .form__group__controls { - @extend .clearfix; - label { - font-weight: normal; - } - &.form__group__controls--inline { - label { - display: inline-block; - } - } - } -} diff --git a/scss/base/_normalise.scss b/scss/base/_normalise.scss deleted file mode 100755 index 1804080..0000000 --- a/scss/base/_normalise.scss +++ /dev/null @@ -1,87 +0,0 @@ -html { - background-color: $base-background-colour; - color: $base-colour; - font: #{($base-font-size * 6.25) * 1%}/#{$base-line-height} $base-font-stack; - min-height: 100%; -} - -a { - color: inherit; - text-decoration: none; -} - -h1, -h2, -h3, -h4, -h5, -h6, -p, -hr, -ul, -ol, -dl, -address { - margin-bottom: $base-spacing-unit; -} - -h1, -h2, -h3, -h4, -h5, -h6 { - line-height: $base-spacing-unit; -} - -h1, -h2, -h3, -h4, -h5, -h6, -strong, -th { - font-weight: bold; -} - -ul, -ol { - margin-left: $base-spacing-unit; -} - -ul ul, -ol ol { - margin-bottom: 0; -} - -img { - display: block; - height: auto; - max-width: 100%; -} - -blockquote { - font-family: serif; - padding-left: $base-spacing-unit; -} - -em { - font-style: italic; -} - -hr { - background-color: $base-colour; - border: 0; - color: $base-colour; - height: 1px; -} - -table { - width: 100%; - th, - td { - padding: ($base-spacing-unit / 4); - text-align: left; - } -} diff --git a/scss/generic/_reset.scss b/scss/generic/_reset.scss deleted file mode 100755 index 88376a3..0000000 --- a/scss/generic/_reset.scss +++ /dev/null @@ -1,12 +0,0 @@ -* { - background-color: transparent; - border: 0; - box-sizing: border-box; - font-size: 100%; - font-smoothing: antialiased; - font-style: normal; - font-weight: normal; - margin: 0; - padding: 0; - text-rendering: optimizeLegibility; -} diff --git a/scss/generic/_utilities.scss b/scss/generic/_utilities.scss deleted file mode 100755 index f17efd6..0000000 --- a/scss/generic/_utilities.scss +++ /dev/null @@ -1,81 +0,0 @@ -/** - * WordPress specific classes - */ - -.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; -} - - -/** - * Clear fix for floats - */ - -.clearfix { - &:before, - &:after{ - content: ''; - display: table; - line-height: 0; - } - &:after{ - clear: both; - } -} - - -/** - * Accessibility - */ - -.sr-only { - display: none; -} - - -/** - * Responsive - */ - -@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; - } - } - -} diff --git a/scss/style.scss b/scss/style.scss deleted file mode 100755 index 927563d..0000000 --- a/scss/style.scss +++ /dev/null @@ -1,19 +0,0 @@ -/** -Theme Name: Bare Bones -Theme URI: http://github.com/benchmarkstudios/barebones -Author: Benchmark -*/ - -@import 'vars'; - -@import 'simple-grid/simple-grid'; - -@import 'generic/mixins'; -@import 'generic/reset'; -@import 'generic/utilities'; - -@import 'base/normalise'; -@import 'base/forms'; - -@import 'modules/nav'; -@import 'modules/buttons';