Bedrock

Aim

To create a Time Out styleguide that is:

• Self-documenting (use examples over documentation)
• Easy to maintain
• Easy to update
• Up-to-date

Where's the SASS?

/_lib

How do I update the styles?

gulp // build once
gulp watch // now visit http://localhost:3000

How do I update the styleguide?

The nav and section titles are added automatically by styleguide.js

The minimum you need to add is:

<div id="Hello-world" class="component">
  Hello world!
</div>

How do I publish updates on NPM?

npm version patch # e.g. 1.0.12 → 1.0.13
npm publish

https://docs.npmjs.com/cli/version for full instructions

How do I update timeoutdigital.github.io/bedrock?

timeoutdigital.github.io/bedrock is hosted on Github Pages (gh-pages branch). Updates to that branch will be reflected on the site.

git fetch
git checkout gh-pages
git pull origin master
gulp # generate compiled CSS
git push origin gh-pages

OPTIONAL: Using Docker

• Install Docker and Docker Compose
• Create docker compose configuration:

  cp ./docker-compose.yml.dist ./docker-compose.yml

• Run docker compose (after start Bedrock available on: http://localhost:3000):

  docker-compose up -d

• Login to container:

  docker exec -ti bedrock_node_1 bash