適当な思いつきで書くブログ

テキオモの記憶の片隅に追いやられそうな出来事を書き連ねます

GitHub PagesでCSSフレームワークBulmaをカスタマイズして使ってみる

2017年10月07日

GitHub PagesのリポジトリでCSSフレームワークBulmaをSASSを利用してカスタマイズしたときのメモ

1. submoduleにjgthms/bulmaを追加

もし_config.ymlsass.sass_dir(デフォルトは _sass)を独自に指定していたらそのディレクトリを指定する

$ git submodule add https://github.com/jgthms/bulma _sass/bulma

2. style.scssを作成

Customizing with Sassの「Customizing with Sass」を参考。importのパスだけ注意(sass.sass_dirから見たパスにする)。

---
---

@import "bulma/sass/utilities/initial-variables";

$blue: #3498db;
$red: #e74c3c;
$green: #18bc9c;
$yellow: #f39c12;
$primary: #2c3e50;
$dark-primary: #1a242f;
$link: $blue;

@import "bulma/bulma";