diff --git a/scss/_regions/_container.scss b/scss/_regions/_container.scss index cb0626f5..05a1d986 100644 --- a/scss/_regions/_container.scss +++ b/scss/_regions/_container.scss @@ -41,6 +41,7 @@ > .wrapper { position: relative; + float: left; @include media($tablet) { @include span(12 no-gutters); @@ -54,6 +55,15 @@ margin: $base-spacing 0; line-height: $comfortable-line-height; + // HACK: Since we use `.container__row` for vertical spacing, but collapse + // all "blocks" to stack on mobile, we need to add appropriate margins between + // blocks when they're stacked. + & + .container__block { + @include media($mobile) { + margin-top: $base-spacing; + } + } + &.-narrow { @include media($tablet) { @include span(9 of 12); diff --git a/wercker.yml b/wercker.yml index d712137d..f044d9c6 100644 --- a/wercker.yml +++ b/wercker.yml @@ -14,7 +14,7 @@ build: export NODE_ENV=production export STYLEGUIDE_PORT=8000 npm run styleguide & - sleep 5 # let Node start up! + sleep 10 # let Node start up! wget -mpc --user-agent="" -e robots=off -P build -nH http://localhost:${STYLEGUIDE_PORT}/ # Automatically deploy `dev` branch to Github pages