From 10ac00b60128fbcc4cd1d50583c66cb503ba79fe Mon Sep 17 00:00:00 2001 From: Oliver Davies Date: Tue, 25 Jul 2017 20:37:18 +0100 Subject: [PATCH 1/8] Add bulma --- package.json | 1 + yarn.lock | 4 ++++ 2 files changed, 5 insertions(+) diff --git a/package.json b/package.json index d310aa8c..8ccad090 100644 --- a/package.json +++ b/package.json @@ -44,6 +44,7 @@ }, "dependencies": { "bootstrap-sass": "^3.3.7", + "bulma": "^0.4.4", "font-awesome": "^4.7.0", "jquery.2": "^1.0.0", "prismjs": "^1.6.0" diff --git a/yarn.lock b/yarn.lock index 55eb8588..590ec0b0 100644 --- a/yarn.lock +++ b/yarn.lock @@ -221,6 +221,10 @@ builtin-modules@^1.0.0: version "1.1.1" resolved "https://registry.yarnpkg.com/builtin-modules/-/builtin-modules-1.1.1.tgz#270f076c5a72c02f5b65a47df94c5fe3a278892f" +bulma: + version "0.4.4" + resolved "https://registry.yarnpkg.com/bulma/-/bulma-0.4.4.tgz#182a3d9fb15026b4602aa8da3cf42140bfb9bb2c" + camelcase-keys@^2.0.0: version "2.1.0" resolved "https://registry.yarnpkg.com/camelcase-keys/-/camelcase-keys-2.1.0.tgz#308beeaffdf28119051efa1d932213c91b8f92e7" From b6504ae92bf5a96a7addbc3ea2e80bc7f5f5afa9 Mon Sep 17 00:00:00 2001 From: Oliver Davies Date: Tue, 25 Jul 2017 20:37:31 +0100 Subject: [PATCH 2/8] Remove references to bootstrap --- assets/sass/_base.sass | 3 -- assets/sass/_mixins.sass | 54 ++++++++++++++-------------- assets/sass/main.sass | 2 +- assets/sass/pages/_blog.sass | 2 -- assets/sass/pages/_experience.sass | 4 +-- assets/sass/pages/_post.sass | 2 -- assets/sass/pages/_project.sass | 1 - assets/sass/pages/_talk.sass | 1 - assets/sass/pages/_testimonials.sass | 6 ---- 9 files changed, 29 insertions(+), 46 deletions(-) diff --git a/assets/sass/_base.sass b/assets/sass/_base.sass index 95a99723..61200ebf 100644 --- a/assets/sass/_base.sass +++ b/assets/sass/_base.sass @@ -10,9 +10,6 @@ main border-bottom: 1px solid text-decoration: none - img - @extend .img-responsive - p img margin: 1.5em 0 diff --git a/assets/sass/_mixins.sass b/assets/sass/_mixins.sass index bad400ed..53f97ee0 100644 --- a/assets/sass/_mixins.sass +++ b/assets/sass/_mixins.sass @@ -1,35 +1,35 @@ -=from($device) - @media screen and (min-width: $device) - @content +// =from($device) +// @media screen and (min-width: $device) +// @content -=until($device) - @media screen and (max-width: $device - 1px) - @content +// =until($device) +// @media screen and (max-width: $device - 1px) +// @content -=mobile - @media screen and (max-width: $screen-tablet - 1px) - @content +// =mobile +// @media screen and (max-width: $screen-tablet - 1px) +// @content -=tablet - @media screen and (min-width: $screen-tablet) - @content +// =tablet +// @media screen and (min-width: $screen-tablet) +// @content -=tablet-only - @media screen and (min-width: $screen-tablet) and (max-width: $screen-desktop - 1px) - @content +// =tablet-only +// @media screen and (min-width: $screen-tablet) and (max-width: $screen-desktop - 1px) +// @content -=touch - @media screen and (max-width: $screen-desktop - 1px) - @content +// =touch +// @media screen and (max-width: $screen-desktop - 1px) +// @content -=desktop - @media screen and (min-width: $screen-desktop) - @content +// =desktop +// @media screen and (min-width: $screen-desktop) +// @content -=desktop-only - @media screen and (min-width: $screen-desktop) and (max-width: $screen-lg - 1px) - @content +// =desktop-only +// @media screen and (min-width: $screen-desktop) and (max-width: $screen-lg - 1px) +// @content -=widescreen - @media screen and (min-width: $screen-lg) - @content +// =widescreen +// @media screen and (min-width: $screen-lg) +// @content diff --git a/assets/sass/main.sass b/assets/sass/main.sass index 3da967ee..2981ad7d 100644 --- a/assets/sass/main.sass +++ b/assets/sass/main.sass @@ -1,4 +1,4 @@ -@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap' +@import 'node_modules/bulma/bulma' @import 'base' @import 'mixins' diff --git a/assets/sass/pages/_blog.sass b/assets/sass/pages/_blog.sass index 74666913..765521a1 100644 --- a/assets/sass/pages/_blog.sass +++ b/assets/sass/pages/_blog.sass @@ -1,5 +1,3 @@ -@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/mixins/clearfix' - .page--blog__list ul.posts list-style: none diff --git a/assets/sass/pages/_experience.sass b/assets/sass/pages/_experience.sass index b0db7e99..9ee361fb 100644 --- a/assets/sass/pages/_experience.sass +++ b/assets/sass/pages/_experience.sass @@ -1,9 +1,7 @@ -@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/mixins/clearfix' -@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/variables' @import '../mixins' .experience-item - margin-bottom: $padding-large-vertical * 3 + // margin-bottom: $padding-large-vertical * 3 +clearfix .experience-item-website diff --git a/assets/sass/pages/_post.sass b/assets/sass/pages/_post.sass index f8d082d1..cca6fdab 100644 --- a/assets/sass/pages/_post.sass +++ b/assets/sass/pages/_post.sass @@ -1,5 +1,3 @@ -@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/mixins/clearfix' - .post-pager clear: both margin-top: 2em diff --git a/assets/sass/pages/_project.sass b/assets/sass/pages/_project.sass index 6f9ec3be..4a92b125 100644 --- a/assets/sass/pages/_project.sass +++ b/assets/sass/pages/_project.sass @@ -1,4 +1,3 @@ -@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/variables' @import '../mixins' .project-company diff --git a/assets/sass/pages/_talk.sass b/assets/sass/pages/_talk.sass index 6e0cff5e..9764d734 100644 --- a/assets/sass/pages/_talk.sass +++ b/assets/sass/pages/_talk.sass @@ -1,4 +1,3 @@ -@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/variables' @import '../mixins' .talk-full h1 diff --git a/assets/sass/pages/_testimonials.sass b/assets/sass/pages/_testimonials.sass index af0be536..1b3eaf47 100644 --- a/assets/sass/pages/_testimonials.sass +++ b/assets/sass/pages/_testimonials.sass @@ -1,5 +1,3 @@ -@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/mixins/clearfix' -@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap/variables' @import '../mixins' .testimonial @@ -10,7 +8,3 @@ height: 75px margin: 0 0 10px 10px width: 75px - - +until($screen-sm) - height: 90px - width: 90px From 4f0b804d18c440d697823484ae7f94671346dea6 Mon Sep 17 00:00:00 2001 From: Oliver Davies Date: Tue, 25 Jul 2017 20:37:41 +0100 Subject: [PATCH 3/8] Add content class --- source/_layouts/default.html.twig | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source/_layouts/default.html.twig b/source/_layouts/default.html.twig index 99773359..1796eb35 100644 --- a/source/_layouts/default.html.twig +++ b/source/_layouts/default.html.twig @@ -29,7 +29,7 @@
-
+
{% block content_top %}{% endblock %} {% block content_wrapper %}{% block content %}{% endblock %}{% endblock %} {% block content_bottom %}{% endblock %} From 64f36408e97a5082991007c67f1af3b97ad3687d Mon Sep 17 00:00:00 2001 From: Oliver Davies Date: Tue, 25 Jul 2017 21:58:30 +0100 Subject: [PATCH 4/8] test --- assets/sass/main.sass | 3 +++ 1 file changed, 3 insertions(+) diff --git a/assets/sass/main.sass b/assets/sass/main.sass index 3da967ee..ff824c60 100644 --- a/assets/sass/main.sass +++ b/assets/sass/main.sass @@ -18,3 +18,6 @@ @import "pages/project" @import "pages/talk" @import "pages/testimonials" + +body + background: red From 96038c32867721ed87794c33d503c2b40a631484 Mon Sep 17 00:00:00 2001 From: Oliver Davies Date: Wed, 26 Jul 2017 00:13:04 +0100 Subject: [PATCH 5/8] Use bulma --- assets/sass/_base.sass | 6 -- assets/sass/main.sass | 21 ++++++- assets/sass/pages/_post.sass | 6 +- package.json | 4 +- source/_includes/nav.html.twig | 56 ++++++++----------- source/_includes/post/about-author.html.twig | 4 +- source/_includes/talks-table.html.twig | 10 ++-- source/_layouts/default.html.twig | 8 +-- source/_layouts/talk.html.twig | 6 +- ...lishing-sculpin-sites-with-github-pages.md | 13 +++-- source/experience.html.twig | 4 +- source/index.md | 2 +- source/testimonials.html.twig | 10 ++-- 13 files changed, 75 insertions(+), 75 deletions(-) diff --git a/assets/sass/_base.sass b/assets/sass/_base.sass index 61200ebf..9e86e4a7 100644 --- a/assets/sass/_base.sass +++ b/assets/sass/_base.sass @@ -1,9 +1,3 @@ -.bg-red - background: red - -body - padding-top: 60px - main a:link, a:hover diff --git a/assets/sass/main.sass b/assets/sass/main.sass index 064238b3..2bb020da 100644 --- a/assets/sass/main.sass +++ b/assets/sass/main.sass @@ -1,3 +1,21 @@ +@import 'node_modules/bulma/sass/utilities/initial-variables' + +$family-sans-serif: "Helvetica Neue", Arial, sans-serif +$body-size: 14px + +$blue: #0678BE + +$primary: $blue + +.is-circle + border-radius: 50% + +$properties: ( mb: 'margin-bottom', ml: 'margin-left', mr: 'margin-right', mt: 'margin-top', pb: 'padding-bottom', pl: 'padding-left', pr: 'padding-right', pt: 'padding-top' ) +@each $key, $property in $properties + @for $value from 1 through 5 + .#{$key}-#{$value} + #{$property}: #{$value}em !important + @import 'node_modules/bulma/bulma' @import 'base' @@ -18,6 +36,3 @@ @import "pages/project" @import "pages/talk" @import "pages/testimonials" - -body - background: red diff --git a/assets/sass/pages/_post.sass b/assets/sass/pages/_post.sass index cca6fdab..94ed1a3f 100644 --- a/assets/sass/pages/_post.sass +++ b/assets/sass/pages/_post.sass @@ -29,9 +29,7 @@ code[data-gist-id] padding: 0 .about-author - +clearfix - img - float: left - margin: 0 1em 1em 0 + // float: left + // margin: 0 1em 1em 0 width: 50px diff --git a/package.json b/package.json index 8ccad090..4552bfd3 100644 --- a/package.json +++ b/package.json @@ -21,7 +21,7 @@ "js:watch": "onchange $npm_package_config_jsInputDir -v -- npm run js", "prod": "npm run production", "production": "cross-env ENV=prod npm run build", - "sass": "npm run sass:$ENV:compile && npm run sass:concat && npm run sass:$ENV:move", + "sass": "npm run sass:concat && npm run sass:$ENV:compile && npm run sass:$ENV:move", "sass:clean": "rm -rf $npm_package_config_cssOutputDir output_*/assets/css/", "sass:concat": "mkdir -p $npm_package_config_cssOutputDir && concat node_modules/font-awesome/css/font-awesome.css node_modules/prismjs/themes/prism-twilight.css $npm_package_config_cssOutputFile -o $npm_package_config_cssOutputFile", "sass:dev:compile": "node-sass assets/sass/main.sass $npm_package_config_cssOutputFile --source-map true", @@ -29,7 +29,7 @@ "sass:prod:compile": "node-sass assets/sass/main.sass $npm_package_config_cssOutputFile", "sass:prod:move": "mv $npm_package_config_cssOutputFile $npm_package_config_cssOutputDir && npm run sass:uglify", "sass:uglify": "uglifycss --ugly-comments $npm_package_config_cssOutputDir/$npm_package_config_cssOutputFile --output $npm_package_config_cssOutputDir/$npm_package_config_cssOutputFile", - "sass:watch": "onchange $npm_package_config_sassDir -v -- npm run sass" + "sass:watch": "ENV=dev onchange $npm_package_config_sassDir -v -- npm run sass" }, "devDependencies": { "autoprefixer": "^7.1.2", diff --git a/source/_includes/nav.html.twig b/source/_includes/nav.html.twig index 1af15af2..4e5d5dd6 100644 --- a/source/_includes/nav.html.twig +++ b/source/_includes/nav.html.twig @@ -1,41 +1,31 @@ -