はてなブログテンプレート「Minimalism」をワンカラムにカスタマイズ

気が向いたのでブログを色々模様替えしました。
テンプレートも変えてみました。
今回選んだのはこちら！
hitsuzi.hatenablog.com

人気ナンバーワンのにしただけじゃんって？
そうなんだけど、せっかくだからもっとシンプルな感じにしたかったので、ワンカラムテンプレートにカスタマイズしてみました。
サイドバーの内容は下部分に表示されます。

書いたコードも出しておくので、使いたい方はコピペしてダッシュボードからデザイン→スパナアイコン（カスタマイズ）→デザインCSS で貼り付けてくださいね。

#content{
 padding:0 15px;
}
#main,#box2{
 float:none;
 width:100%;
 margin-top:60px;
}
#box2-inner{
 display:flex;
 flex-wrap:wrap;
}
#box2-inner > div{
 flex-basis:calc(50% - 10px);
 margin:20px 5px 0;
}
@media screen and (max-width: 640px){
 #box2-inner{
  display:block;
 }
}

やってることを説明すると
サイドバー部分の回り込みを解除して、メインエリアとサイドバーを100%に伸ばして
画面下に表示されてるサイドバー内部はflexboxで横2列に並べてます。画面幅を縮めると縦並びに切り替えるのでレスポンシブ対応もばっちり！
あまり長いテキストが入った場合の想定はしてないけどたぶん大丈夫。