From 7e87836adaf3d0b686d6fcf8c0962706dc98beec Mon Sep 17 00:00:00 2001 From: Lukas Juhas Date: Tue, 6 Jun 2017 15:23:36 +0100 Subject: [PATCH] solid v3 setup, wip --- .babelrc | 4 + .editorconfig | 12 + .gitignore | 8 +- .gitmodules | 4 +- CHANGELOG.md | 16 +- README.md | 60 +- assets/.DS_Store | Bin 6148 -> 0 bytes assets/images/.gitkeep | 0 assets/images/logo.png | Bin 0 -> 4494 bytes assets/images/logo.svg | 36 + assets/js/bootstrap.js | 1 - assets/js/script.js | 3 - assets/sass/.DS_Store | Bin 6148 -> 0 bytes assets/sass/barebones.scss | 48 - assets/sass/utils/.DS_Store | Bin 6148 -> 0 bytes assets/sass/utils/_a11y.scss | 7 - assets/sass/vendor/simple-grid | 1 - assets/scripts/scripts.js | 3 + assets/{sass => styles}/base/_base.scss | 0 assets/{sass => styles}/base/_fonts.scss | 0 assets/{sass => styles}/base/_forms.scss | 0 assets/{sass => styles}/base/_images.scss | 0 assets/{sass => styles}/base/_lists.scss | 0 assets/{sass => styles}/base/_typography.scss | 0 .../{sass => styles}/components/_alerts.scss | 0 .../{sass => styles}/components/_buttons.scss | 0 assets/styles/components/_logo.scss | 4 + assets/{sass => styles}/components/_nav.scss | 0 assets/{sass => styles}/config/_mixins.scss | 0 .../{sass => styles}/config/_variables.scss | 0 assets/styles/core.scss | 20 + assets/{sass => styles}/layout/_footer.scss | 0 assets/{sass => styles}/layout/_header.scss | 0 assets/{sass => styles}/layout/_main.scss | 0 assets/{sass => styles}/pages/_home.scss | 0 assets/styles/styles.scss | 15 + assets/{sass => styles}/utils/_helpers.scss | 0 assets/{sass => styles}/utils/_reset.scss | 0 .../{sass => styles}/utils/_responsive.scss | 0 .../styles/vendor/simple-grid/.gitattributes | 1 + assets/styles/vendor/simple-grid/README.md | 122 + .../styles/vendor/simple-grid/_defaults.scss | 35 + assets/styles/vendor/simple-grid/_mixins.scss | 32 + .../vendor/simple-grid/simple-grid.scss | 52 + css/core.min.css | 1 + css/styles.min.css | 1 + functions.php | 36 +- gulpfile.babel.js | 149 + header.php | 14 +- img/logo.png | Bin 0 -> 3590 bytes img/logo.svg | 1 + includes/functions.php | 2 +- js/script.min.js | 26 - js/scripts.min.js | 1 + manifest.json | 4 - package.json | 49 +- style.css | 14 +- templates/.gitkeep | 0 templates/README.MD | 38 + webpack.config.js | 340 -- webpack.mix.js | 29 - yarn.lock | 4343 ----------------- 62 files changed, 665 insertions(+), 4867 deletions(-) create mode 100644 .babelrc create mode 100644 .editorconfig delete mode 100644 assets/.DS_Store delete mode 100644 assets/images/.gitkeep create mode 100644 assets/images/logo.png create mode 100644 assets/images/logo.svg delete mode 100644 assets/js/bootstrap.js delete mode 100644 assets/js/script.js delete mode 100644 assets/sass/.DS_Store delete mode 100755 assets/sass/barebones.scss delete mode 100644 assets/sass/utils/.DS_Store delete mode 100644 assets/sass/utils/_a11y.scss delete mode 160000 assets/sass/vendor/simple-grid create mode 100644 assets/scripts/scripts.js rename assets/{sass => styles}/base/_base.scss (100%) rename assets/{sass => styles}/base/_fonts.scss (100%) rename assets/{sass => styles}/base/_forms.scss (100%) rename assets/{sass => styles}/base/_images.scss (100%) rename assets/{sass => styles}/base/_lists.scss (100%) rename assets/{sass => styles}/base/_typography.scss (100%) rename assets/{sass => styles}/components/_alerts.scss (100%) rename assets/{sass => styles}/components/_buttons.scss (100%) create mode 100644 assets/styles/components/_logo.scss rename assets/{sass => styles}/components/_nav.scss (100%) rename assets/{sass => styles}/config/_mixins.scss (100%) rename assets/{sass => styles}/config/_variables.scss (100%) create mode 100755 assets/styles/core.scss rename assets/{sass => styles}/layout/_footer.scss (100%) rename assets/{sass => styles}/layout/_header.scss (100%) rename assets/{sass => styles}/layout/_main.scss (100%) rename assets/{sass => styles}/pages/_home.scss (100%) create mode 100755 assets/styles/styles.scss rename assets/{sass => styles}/utils/_helpers.scss (100%) rename assets/{sass => styles}/utils/_reset.scss (100%) rename assets/{sass => styles}/utils/_responsive.scss (100%) create mode 100644 assets/styles/vendor/simple-grid/.gitattributes create mode 100644 assets/styles/vendor/simple-grid/README.md create mode 100644 assets/styles/vendor/simple-grid/_defaults.scss create mode 100644 assets/styles/vendor/simple-grid/_mixins.scss create mode 100644 assets/styles/vendor/simple-grid/simple-grid.scss create mode 100755 css/core.min.css create mode 100755 css/styles.min.css create mode 100644 gulpfile.babel.js create mode 100644 img/logo.png create mode 100644 img/logo.svg delete mode 100644 js/script.min.js create mode 100644 js/scripts.min.js delete mode 100644 manifest.json mode change 100755 => 100644 style.css delete mode 100644 templates/.gitkeep create mode 100644 templates/README.MD delete mode 100644 webpack.config.js delete mode 100644 webpack.mix.js delete mode 100644 yarn.lock diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..ea61312 --- /dev/null +++ b/.babelrc @@ -0,0 +1,4 @@ +{ + "presets": ["es2015", "stage-2"], + "comments": false, +} diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..4bd3bd8 --- /dev/null +++ b/.editorconfig @@ -0,0 +1,12 @@ +root = true + +[*] +charset = utf-8 +indent_style = space +indent_size = 2 +end_of_line = lf +insert_final_newline = true +trim_trailing_whitespace = true + +[*.md] +trim_trailing_whitespace = false diff --git a/.gitignore b/.gitignore index 51d5bd0..4dfe913 100644 --- a/.gitignore +++ b/.gitignore @@ -1,9 +1,9 @@ +.DS_Store npm-debug.log .sass-cache node_modules -bower_components assets/sass/vendor -tests - +package-lock.json *.map -**/*.map \ No newline at end of file +**/*.map +yarn.lock diff --git a/.gitmodules b/.gitmodules index 180aa8f..2b2cb88 100644 --- a/.gitmodules +++ b/.gitmodules @@ -1,3 +1,3 @@ -[submodule "assets/sass/vendor/simple-grid"] - path = assets/sass/vendor/simple-grid +[submodule "assets/styles/vendor/simple-grid"] + path = assets/styles/vendor/simple-grid url = https://github.com/benchmarkstudios/simple-grid.git diff --git a/CHANGELOG.md b/CHANGELOG.md index 3c2e384..42b09d7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,15 +1,3 @@ # barebones changelog - -## 2.0.2 -* Add dependencies that were missing while using yarn - -## 2.0.1 - -* Comment out example "add_image_size" as it can be easily forgotten which leaves you with extra unused image size. -* Add CHANGELOG.MD to track changes -* Tidy up formatting using PHP-CS-Fixer (mostly spacing) -* Update README.MD dependencies - -## 2.0.0 - -* Refreshed tooling using Elixir with lots of improvements +## 3.0 +* Refreshed simplified tooling, new feaatures and improvements diff --git a/README.md b/README.md index 95c9e9b..9b71eb6 100644 --- a/README.md +++ b/README.md @@ -5,17 +5,17 @@ A lightweight and skeletal WordPress boilerplate theme for HTML5 and beyond. The ## Features * Reset, normalisation and base font/form styles -* Sass Boilerplate - semantically named files, organised by folders, all compiled into a single file +* Scss Boilerplate - semantically named files, organised by folders, all compiled into a single file * Semantic use of HTML5 elements, includes Google HTML5 shiv * WAI-ARIA role ready -* Comes pre-bundled with cached CDN version of jQuery * jQuery plugin agnostic -* Laravel Elixir to define/customize and run basic Gulp tasks * Basic template files * Customised functions.php adding theme support for high customisation * Minimised HTTP requests for high Web Performance * Localised strings for multiple language support -* Sass compiling and watching, css minification and live reload support +* Scss compiling and watching, css minification support +* Rollup.js for js for smallest possible bundles +* Image optimisation using imagemin. ## Installation @@ -31,23 +31,26 @@ To include all its optional submodules ([Simple Grid](https://github.com/benchma #### Dependencies -* [Node.js](http://nodejs.org) -* [Gulp](http://gulpjs.com) -* [Gulp Imagemin](https://github.com/sindresorhus/gulp-imagemin) -* [Laravel Elixir](https://github.com/laravel/elixir) +Install Dependencies: +``` + npm install +``` -### Using Gulp and Laravel Elixir +.. or with yarn: +``` + yarn +``` + +### Using Gulp Install Gulp as a global NPM package, if you don't have it already on your machine: npm install --global gulp -Install Laravel Elixir: +Install Dependencies, you have haven't done yet: npm install -Edit your gulpfile.js adding the required tasks (check the [Laravel Elixir](http://laravel.com/docs/master/elixir) documentation for further information). - Then run: gulp @@ -58,11 +61,20 @@ Then run: *to watch* - gulp --production + gulp images -*to minify* +*to optimise images* -This will execute all the Gulp tasks on the gulpfile.js. + gulp build + +*to create a build (minification, removes map files and comments)* + +This will execute all the Gulp tasks on the gulpfile.babel.js. + +### Images + +Drop all your images into assets/imagess. When running gulp tasks, they will be automatically +optimised and output files will available in img folder in the root of the theme. ## WordPress Support @@ -75,3 +87,21 @@ Compatible with WordPress 3.2 and above, but always use the latest version. * Safari 4.0+ * Chrome 14.0+ * Opera 10.0+ + +## Tips & Tricks + +### SVG Fallbacks + +*CSS* +``` +... +background-size: 120px 15px; +background-image: url(/img/fallback.png); +background-image: linear-gradient(transparent, transparent), url(/img/image.svg); +... +``` + +*HTML* +``` +image +``` diff --git a/assets/.DS_Store b/assets/.DS_Store deleted file mode 100644 index 5008ddfcf53c02e82d7eee2e57c38e5672ef89f6..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 6148 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 ZIq?Zsu?k!J?B8z`ypfgRgR_K${{yf|CB^^% literal 0 HcmV?d00001 diff --git a/assets/images/logo.svg b/assets/images/logo.svg new file mode 100644 index 0000000..6575236 --- /dev/null +++ b/assets/images/logo.svg @@ -0,0 +1,36 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/assets/js/bootstrap.js b/assets/js/bootstrap.js deleted file mode 100644 index b58532e..0000000 --- a/assets/js/bootstrap.js +++ /dev/null @@ -1 +0,0 @@ -window.$ = window.jQuery = require('jquery'); diff --git a/assets/js/script.js b/assets/js/script.js deleted file mode 100644 index f7e4403..0000000 --- a/assets/js/script.js +++ /dev/null @@ -1,3 +0,0 @@ -require('./bootstrap'); - -console.log( 'Barebones rocks! You are running jQuery version: ' + $.fn.jquery ); diff --git a/assets/sass/.DS_Store b/assets/sass/.DS_Store deleted file mode 100644 index fcc4cd6750a4b68b28399d2a316477ce230c1403..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 6148 zcmeHKOHKnZ47H&`mAdJYWv73KC_ypz1dFW7iY$UTlyCA~r~EIS zU?3RyV1VaCLLp|yVpxw3R5b+v@)=zPI&%reB**Mn3}Jz&g#s;9J;hK9M}Km^>{tvf zT-1{f^_kz37p=2n{8ZgVvtiW1Krk?6;L@5)-v77wWtvI;G$dNVKrryn7|>a_>DJhk z->qM^$GbM6+@VnDSExXsPaXki@Ep0WMzbgC@XLH1@V-^m;4Wg<&0T*E43hX&L&p$$qDprKhvt+--jT7}7np#A3 zem<@ulZcFPQ@L2!n>{z**++&mCkOWA81W14cNZlEfg7;MkzE(HCqgga^y>{tEnwC%0;vJ&^%eQ zLs35+`xjp>T0` - inside a `.row`. + +```html +
+
+

Col 1

+
+
+
+
+

Col 2

+
+
+

Col 3

+
+
+
+
+

Col 4

+
+
+

Col 5

+
+
+

Col 6

+
+
+
+
+

Col 7

+
+
+

Col 8

+
+
+``` + +### Offsetting columns +Increase the left margin of a column by the number of columns you want, along with the responsive class prefixes, if you need. + +```html +
+
+

Col 9 with offset 0

+
+
+

Col 10 with offset 4

+
+
+
+
+

Col 11 with offset 3

+
+
+

Col 12 with offset 6

+
+
+
+
+

Col 13 with offset 3

+
+
+``` + +### Nesting columns +To nest your content, add a new `.row` inside a `.col`, and set of `.col-ld-*` columns within an existing `.col-ld-*` column. Nested rows should include a set of columns that add up to 12 or less. + +```html +
+
+

Col 14

+
+
+

Nested col 14.1

+
+
+

Nested col 14.2

+
+
+
+
+``` + +### Gutterless columns +To remove all the gutters from your columns just add the class `.row--gutterless` to your `.row` element. + +```html +
+
+

Col 15

+
+
+

Col 16

+
+
+``` + +## Demo +Check out the demo and play around on [Code Pen](http://codepen.io/pedroreis/pen/ituho) and/or check the compiled CSS on [SassMeister](http://sassmeister.com/gist/c6368fc9a239e1798fcd). diff --git a/assets/styles/vendor/simple-grid/_defaults.scss b/assets/styles/vendor/simple-grid/_defaults.scss new file mode 100644 index 0000000..05a566b --- /dev/null +++ b/assets/styles/vendor/simple-grid/_defaults.scss @@ -0,0 +1,35 @@ +/** + * Space between columns + */ + +$grid-gutter: 20px !default; + + +/** + * Max width of container + */ + +$grid-max-width: 1200px + ($grid-gutter * 2) !default; + + +/** + * Number of total columns + */ + +$grid-columns: 12 !default; + + +/** + * Breakpoints + */ + +$breakpoint-lg: 1200px !default; +$breakpoint-md: 768px !default; +$breakpoint-sm: 480px !default; + +$breakpoints: ( + 'lg' '(min-width: ' + $breakpoint-lg + ')', + 'md' '(min-width: ' + $breakpoint-md + ') and (max-width: ' + ($breakpoint-lg - 1) + ')', + 'sm' '(max-width:' + ($breakpoint-md - 1) + ')', + 'xs' '(max-width: ' + $breakpoint-sm + ')' +) !default; diff --git a/assets/styles/vendor/simple-grid/_mixins.scss b/assets/styles/vendor/simple-grid/_mixins.scss new file mode 100644 index 0000000..b0a99fc --- /dev/null +++ b/assets/styles/vendor/simple-grid/_mixins.scss @@ -0,0 +1,32 @@ +/** + * Grid loop mixin + */ + +@mixin grid-loop($name){ + @for $i from 0 through $grid-columns { + @if $i != 0 { + .col--#{$name}-#{$i} { + width: percentage($i/$grid-columns); + } + } + .col--#{$name}-offset-#{$i} { + margin-left: percentage($i/$grid-columns); + } + } +} + + +/** + * Clearfix + */ + +@mixin clearfix { + &:before, + &:after { + content: " "; + display: table; + } + &:after { + clear: both; + } +} diff --git a/assets/styles/vendor/simple-grid/simple-grid.scss b/assets/styles/vendor/simple-grid/simple-grid.scss new file mode 100644 index 0000000..6aee055 --- /dev/null +++ b/assets/styles/vendor/simple-grid/simple-grid.scss @@ -0,0 +1,52 @@ +/** + * Default variables and helper mixins + */ + +@import + 'defaults', + 'mixins'; + + +/** + * Grid scaffolding + */ + +.container { + @include clearfix; + max-width: $grid-max-width; + margin: 0 auto; + padding: 0 $grid-gutter; +} + +.row { + @include clearfix; + list-style: none; + margin-left: -$grid-gutter; + &.row--gutterless { + margin-left: 0; + } +} + +.col { + float: left; + padding-left: $grid-gutter; + box-sizing: border-box; + .row--gutterless & { + padding-left: 0; + } +} + + + +/** + * Columns generator + */ + +@each $breakpoint in $breakpoints { + $name: nth($breakpoint, 1); + $declaration: nth($breakpoint, 2); + + @media only screen and #{$declaration} { + @include grid-loop($name); + } +} diff --git a/css/core.min.css b/css/core.min.css new file mode 100755 index 0000000..d35523f --- /dev/null +++ b/css/core.min.css @@ -0,0 +1 @@ +.container{max-width:1200px;margin:0 auto;padding:0 24px}.container:before,.container:after{content:" ";display:table}.container:after{clear:both}.row{list-style:none;margin-left:-24px}.row:before,.row:after{content:" ";display:table}.row:after{clear:both}.row.row--gutterless{margin-left:0}.col{float:left;padding-left:24px;-webkit-box-sizing:border-box;box-sizing:border-box}.row--gutterless .col{padding-left:0}@media only screen and (min-width: 1200px){.col--lg-offset-0{margin-left:0%}.col--lg-1{width:8.33333%}.col--lg-offset-1{margin-left:8.33333%}.col--lg-2{width:16.66667%}.col--lg-offset-2{margin-left:16.66667%}.col--lg-3{width:25%}.col--lg-offset-3{margin-left:25%}.col--lg-4{width:33.33333%}.col--lg-offset-4{margin-left:33.33333%}.col--lg-5{width:41.66667%}.col--lg-offset-5{margin-left:41.66667%}.col--lg-6{width:50%}.col--lg-offset-6{margin-left:50%}.col--lg-7{width:58.33333%}.col--lg-offset-7{margin-left:58.33333%}.col--lg-8{width:66.66667%}.col--lg-offset-8{margin-left:66.66667%}.col--lg-9{width:75%}.col--lg-offset-9{margin-left:75%}.col--lg-10{width:83.33333%}.col--lg-offset-10{margin-left:83.33333%}.col--lg-11{width:91.66667%}.col--lg-offset-11{margin-left:91.66667%}.col--lg-12{width:100%}.col--lg-offset-12{margin-left:100%}}@media only screen and (min-width: 768px) and (max-width: 1199px){.col--md-offset-0{margin-left:0%}.col--md-1{width:8.33333%}.col--md-offset-1{margin-left:8.33333%}.col--md-2{width:16.66667%}.col--md-offset-2{margin-left:16.66667%}.col--md-3{width:25%}.col--md-offset-3{margin-left:25%}.col--md-4{width:33.33333%}.col--md-offset-4{margin-left:33.33333%}.col--md-5{width:41.66667%}.col--md-offset-5{margin-left:41.66667%}.col--md-6{width:50%}.col--md-offset-6{margin-left:50%}.col--md-7{width:58.33333%}.col--md-offset-7{margin-left:58.33333%}.col--md-8{width:66.66667%}.col--md-offset-8{margin-left:66.66667%}.col--md-9{width:75%}.col--md-offset-9{margin-left:75%}.col--md-10{width:83.33333%}.col--md-offset-10{margin-left:83.33333%}.col--md-11{width:91.66667%}.col--md-offset-11{margin-left:91.66667%}.col--md-12{width:100%}.col--md-offset-12{margin-left:100%}}@media only screen and (max-width: 767px){.col--sm-offset-0{margin-left:0%}.col--sm-1{width:8.33333%}.col--sm-offset-1{margin-left:8.33333%}.col--sm-2{width:16.66667%}.col--sm-offset-2{margin-left:16.66667%}.col--sm-3{width:25%}.col--sm-offset-3{margin-left:25%}.col--sm-4{width:33.33333%}.col--sm-offset-4{margin-left:33.33333%}.col--sm-5{width:41.66667%}.col--sm-offset-5{margin-left:41.66667%}.col--sm-6{width:50%}.col--sm-offset-6{margin-left:50%}.col--sm-7{width:58.33333%}.col--sm-offset-7{margin-left:58.33333%}.col--sm-8{width:66.66667%}.col--sm-offset-8{margin-left:66.66667%}.col--sm-9{width:75%}.col--sm-offset-9{margin-left:75%}.col--sm-10{width:83.33333%}.col--sm-offset-10{margin-left:83.33333%}.col--sm-11{width:91.66667%}.col--sm-offset-11{margin-left:91.66667%}.col--sm-12{width:100%}.col--sm-offset-12{margin-left:100%}}@media only screen and (max-width: 480px){.col--xs-offset-0{margin-left:0%}.col--xs-1{width:8.33333%}.col--xs-offset-1{margin-left:8.33333%}.col--xs-2{width:16.66667%}.col--xs-offset-2{margin-left:16.66667%}.col--xs-3{width:25%}.col--xs-offset-3{margin-left:25%}.col--xs-4{width:33.33333%}.col--xs-offset-4{margin-left:33.33333%}.col--xs-5{width:41.66667%}.col--xs-offset-5{margin-left:41.66667%}.col--xs-6{width:50%}.col--xs-offset-6{margin-left:50%}.col--xs-7{width:58.33333%}.col--xs-offset-7{margin-left:58.33333%}.col--xs-8{width:66.66667%}.col--xs-offset-8{margin-left:66.66667%}.col--xs-9{width:75%}.col--xs-offset-9{margin-left:75%}.col--xs-10{width:83.33333%}.col--xs-offset-10{margin-left:83.33333%}.col--xs-11{width:91.66667%}.col--xs-offset-11{margin-left:91.66667%}.col--xs-12{width:100%}.col--xs-offset-12{margin-left:100%}}*{background-color:transparent;border:0;-webkit-box-sizing:border-box;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}input[disabled],select[disabled],textarea[disabled],button[disabled]{cursor:not-allowed}button{cursor:pointer}table{border-collapse:collapse;border-spacing:0}table th,table td{text-align:left}@media only screen and (min-width: 1200px){.visible-lg{display:block !important}}@media only screen and (min-width: 1200px){.hidden-lg{display:none !important}}@media only screen and (min-width: 768px) and (max-width: 1199px){.visible-md{display:block !important}}@media only screen and (min-width: 768px) and (max-width: 1199px){.hidden-md{display:none !important}}@media only screen and (max-width: 767px){.visible-sm{display:block !important}}@media only screen and (max-width: 767px){.hidden-sm{display:none !important}}@media only screen and (max-width: 480px){.visible-xs{display:block !important}}@media only screen and (max-width: 480px){.hidden-xs{display:none !important}}.alignleft,.float-left{float:left}img .alignleft,img .float-left{margin-right:24px}.alignright,.float-right{float:right}img .alignright,img .float-right{margin-left:24px}.aligncenter,.float-center{display:block;margin-left:auto;margin-right:auto}img .aligncenter,img .float-center{margin-bottom:24px}.clearfix:before,.clearfix:after{content:" ";display:table}.clearfix:after{clear:both}.align-text-left{text-align:left}.align-text-right{text-align:right}.align-text-center{text-align:center}.visible-on-mobile{display:none !important}@media screen and (max-width: 480px){.visible-on-mobile{display:block !important}}.visible-on-tablet{display:none !important}@media screen and (max-width: 768px){.visible-on-tablet{display:block !important}}@media screen and (max-width: 480px){.visible-on-tablet{display:none !important}}@media screen and (max-width: 768px){.visible-on-desktop{display:none !important}}body{color:#444;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:16px;font-size:1rem;line-height:1.5;-webkit-text-size-adjust:none}h1,h2,h3,h4,h5,h6,p,hr,ul,ol,dl,address{margin-bottom:24px}a{color:#444;text-decoration:none}a:hover{color:#444;text-decoration:underline}a[href^="tel"]{color:inherit;text-decoration:none;font-family:inherit;font-size:inherit;font-style:inherit}hr{background-color:#444;height:1px}img{max-width:100%;height:auto;vertical-align:top}.is-fluid{display:block;width:100%;height:auto}*:focus{outline:0}input,select,textarea{background-color:#fff;border:solid 1px #444;-webkit-border-radius:0;border-radius:0;color:#444;line-height:36px;height:36px;padding:0 12px;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:6px 12px}input[type="submit"]{-webkit-border-radius:0;border-radius:0}input[disabled]{background-color:whitesmoke;cursor:not-allowed}select{line-height:normal;padding:0;padding-left:12px}textarea{min-height:96px;overflow:auto;vertical-align:top;resize:vertical}.form--inline .form__group{display:inline-block}.checkbox,.radio{display:block;padding-left:24px}.checkbox.inline,.radio.inline{display:inline-block}.checkbox>input,.radio>input{float:left;margin-left:-24px;margin-top:4px}.form__group{display:block;margin-bottom:24px}.form__label{display:block;margin-bottom:12px}.input-group{position:relative}.input-group>input{padding:0 48px}.input-group .input-group__addon{line-height:36px;height:36px;position:absolute;text-align:center;top:0;width:36px}.input-group .input-group__addon:first-child{left:0}.input-group .input-group__addon:last-child{right:0}ul,ol{margin-left:24px}li>ul,li>ol{margin-bottom:0}.list--unstyled{list-style:none;margin-left:0}h1,h2,h3,h4,h5,h6{font-weight:bold}small{font-size:.75em}.logo{width:250px;height:41px} diff --git a/css/styles.min.css b/css/styles.min.css new file mode 100755 index 0000000..e1792b5 --- /dev/null +++ b/css/styles.min.css @@ -0,0 +1 @@ +.btn{background-color:#444;color:#fff;border:1px solid transparent;display:inline-block;padding:6px 24px;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:auto;-webkit-transition:all .5s;-o-transition:all .5s;transition:all .5s}.btn::-moz-focus-inner{border:0;padding:0}.btn:hover{text-decoration:none;background-color:#fff;color:#444;border:1px solid #444}.btn .is-disabled,.btn:disabled{pointer-events:none;opacity:.65}.btn--inverse{background-color:#fff;color:#444;border:1px solid #444}.btn--inverse:hover{background-color:#444;color:#fff;border:1px solid transparent}.btn--block{display:block;width:100%}.btn--block+.btn--block{margin-top:6px}.btn--link{background-color:transparent;color:#444}.nav{list-style:none;margin:0}.nav>li{display:inline-block;margin-right:24px}.nav>li:last-child{margin-right:0}.nav>li>a{display:block}.alert{padding:24px;margin-bottom:24px;border:1px solid transparent}.alert>p,.alert>ul{margin-bottom:0}.alert>p+p{margin-top:24px}.alert.alert--success{color:#5CB85C;border-color:#5CB85C}.alert.alert--info{color:#444;border-color:#444}.alert.alert--warning{color:#F0AD4E;border-color:#F0AD4E}.alert.alert--danger{color:#D9534F;border-color:#D9534F} diff --git a/functions.php b/functions.php index efdc765..5615ba9 100644 --- a/functions.php +++ b/functions.php @@ -3,21 +3,18 @@ /** * Custom functions / External files */ -require_once 'includes/functions.php'; - - +require_once 'includes/funcitons.php'; /** * Add support for useful stuff */ + if (function_exists('add_theme_support')) { // Add support for document title tag add_theme_support('title-tag'); // Add Thumbnail Theme Support add_theme_support('post-thumbnails'); - - // Add image sizes // add_image_size( 'custom-size', 700, 200, true ); // Add Support for post formats @@ -53,6 +50,7 @@ function barebones_remove_comments_rss($for_comments) { return; } + add_filter('post_comments_feed_link', 'barebones_remove_comments_rss'); @@ -64,9 +62,10 @@ add_filter('post_comments_feed_link', 'barebones_remove_comments_rss'); function barebones_scripts() { // wp_enqueue_style( 'fonts', '//fonts.googleapis.com/css?family=Font+Family' ); - // wp_enqueue_style( 'icons', '//maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css' ); - wp_enqueue_script('script', get_stylesheet_directory_uri() . '/js/script.min.js?' . time(), [], null, true); + // wp_enqueue_style( 'icons', '//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' ); + wp_enqueue_script('script', get_stylesheet_directory_uri() . '/js/script.min.js?' . filemtime(get_stylesheet_directory() . '/js/script.min.js'), [], null, true); } + add_action('wp_enqueue_scripts', 'barebones_scripts'); @@ -91,6 +90,7 @@ function barebones_nav_menu_args($args = '') return $args; } + add_filter('wp_nav_menu_args', 'barebones_nav_menu_args'); @@ -103,6 +103,7 @@ function barebones_mail_from($email) { return get_option('admin_email'); } + add_filter('wp_mail_from', 'barebones_mail_from'); @@ -110,6 +111,7 @@ function barebones_mail_from_name($name) { return get_bloginfo('name'); } + add_filter('wp_mail_from_name', 'barebones_mail_from_name'); @@ -124,6 +126,7 @@ function button_shortcode($atts, $content = null) return '' . $content . ''; } + add_shortcode('button', 'button_shortcode'); @@ -139,8 +142,10 @@ function barebones_mce_buttons_2($buttons) return $buttons; } + add_filter('mce_buttons_2', 'barebones_mce_buttons_2'); + function barebones_tiny_mce_before_init($settings) { $style_formats = [ @@ -156,16 +161,21 @@ function barebones_tiny_mce_before_init($settings) return $settings; } + add_filter('tiny_mce_before_init', 'barebones_tiny_mce_before_init'); /** * Get post thumbnail url - * - * @param int $post_id - * @return string + * @param string $size Size of the returned image + * @param int $post_id post id + * @param boolean $icon if no image found, display icon */ - -function get_post_thumbnail_url($post_id) +function get_post_thumbnail_url($size = 'full', $post_id = false, $icon = false) { - return wp_get_attachment_url(get_post_thumbnail_id($post_id)); + if (!$post_id) { + $post_id = get_the_ID(); + } + + $thumb_url_array = wp_get_attachment_image_src(get_post_thumbnail_id($post_id), $size, $icon); + return $thumb_url_array[0]; } diff --git a/gulpfile.babel.js b/gulpfile.babel.js new file mode 100644 index 0000000..432128e --- /dev/null +++ b/gulpfile.babel.js @@ -0,0 +1,149 @@ +/* eslint-disable no-console */ +import gulp from 'gulp'; +import clean from 'gulp-clean'; +import sass from 'gulp-sass'; +import gulpif from 'gulp-if'; +import rename from 'gulp-rename'; +import autoprefixer from 'gulp-autoprefixer'; +import sourcemaps from 'gulp-sourcemaps'; +import { rollup } from 'rollup'; +import buble from 'rollup-plugin-buble'; +import nodeResolve from 'rollup-plugin-node-resolve'; +import commonjs from 'rollup-plugin-commonjs'; +import json from 'rollup-plugin-json'; +import replace from 'rollup-plugin-replace'; +import multiEntry from 'rollup-plugin-multi-entry'; +import uglify from 'rollup-plugin-uglify'; +import { minify } from 'uglify-js'; +import imagemin from 'gulp-imagemin'; +import runSequence from 'run-sequence'; + +const log = console.log; +let production = false; + +/** + * Config + */ +const config = { + src: './assets', + public: './', +}; + +/** + * Tasks - in order + */ +const tasks = ['styles', 'scripts', 'images']; + +/** + * Styles + */ +gulp.task('clean-styles', () => ( + gulp.src(`${config.public}/css`, { + read: false, + }) + .pipe(clean()) +)); + +gulp.task('styles', ['clean-styles'], () => ( + gulp.src([`${config.src}/styles/*.scss`]) + .pipe(gulpif(!production, sourcemaps.init())) + .pipe(sass({ + outputStyle: production ? 'compressed' : 'nested', + }).on('error', sass.logError)) + .pipe(autoprefixer({ + browsers: ['last 10 versions'], + })) + .pipe(rename({ + suffix: '.min', + })) + .pipe(gulpif(!production, sourcemaps.write('.'))) + .pipe(gulp.dest(`${config.public}/css`)) +)); + +/** + * Scripts + */ +gulp.task('clean-scripts', () => ( + gulp.src(`${config.public}/js`, { + read: false, + }) + .pipe(clean()) +)); + +gulp.task('scripts', ['clean-scripts'], () => { + let env = 'development'; + if (production) { + env = 'production'; + } + + rollup({ + entry: `${config.src}/scripts/scripts.js`, + plugins: [ + multiEntry(), + buble(), + nodeResolve({ + browser: true, + main: true, + jsnext: true, + }), + commonjs({ + include: [ + 'node_modules/**', + `${config.src}/**`, + ], + }), + json(), + replace({ + 'process.env.NODE_ENV': JSON.stringify(env), + }), + production ? uglify({}, minify) : '', + ], + }).then((bundle) => { + bundle.write({ + format: 'iife', + moduleName: 'BarebonesBundle', + sourceMap: !production, + dest: `${config.public}/js/scripts.min.js`, + }); + }).catch(err => log(err.stack)); +}); + +/** + * Watch + */ +gulp.task('watch-files', tasks, () => { + gulp.watch(`${config.src}/styles/**/*.scss`, ['styles']); + gulp.watch(`${config.src}/scripts/**/*.js`, ['scripts']); + gulp.watch(`${config.src}/images/**/*.*`, ['images']); +}); + +/** + * Images + */ +gulp.task('images', () => { + // hadle all images that are not svg + gulp.src(`${config.src}/images/**/*.*`) + .pipe(imagemin({ + progressive: true, + svgoPlugins: [{ + removeViewBox: false, + }], + })) + .pipe(gulp.dest(`${config.public}/img`)); +}); + +/** + * Main Tasks + */ +gulp.task('watch', () => ( + runSequence(tasks, 'watch-files') +)); + +gulp.task('build', () => { + production = true; + runSequence(tasks); +}); + +gulp.task('default', () => ( + runSequence(tasks) +)); diff --git a/header.php b/header.php index fdc1abf..6373691 100755 --- a/header.php +++ b/header.php @@ -7,7 +7,13 @@ - + + + +