id:cateiru さんの記事を見て良いなと思ったので自分もカスタマイズした。

デザインCSS

今まで

素朴なデザインで今も気に入っている。今回はこのテーマをベースにデザインCSSを変更した。

Chrome DevToolsを使ってCSSの微調整を行った

今までWebのフロントエンドを触る時はフレームワークのホットリロード機能を使っていた。今回はそれが出来ないため、Chrome DevToolsを使って微調整をした。今までChrome DevToolsはConsoleでJavaScriptのコードを実行したり、Networkを見たりするぐらいにしか使ったことがなかった。たまたま「Chrome DevTools上でCSSの値変えられるかな？」と思ってやってみたら書き換わって表示も変わったので、これを使おう！となった。

手元のエディタで変更して、デザインCSSの変更ページにコピペして、微調整はChrome DevTools上でCSSを変更して、エディタに反映して...とインクリメンタルな動作確認をした。