皆様GWはいかがお過ごしでしょうか。
ぐーたら生活を満喫している筆者です。GW入ってから、「弱虫ペダル」をDアニメで見ており、１期を三日くらいで見終わったくらいにはぐーたらしているわけですが、今回は、はてなブログのスマホ向けの記事一覧のデザインを少しだけ変えてみました。
と、いっても、困ったときの先人の知恵でして、少しデザインを変えたいなーと思っていろいろなサイト様・Blog様を見ていて、これいいな、と思ったことを（ほぼコピペで）やってみました。
スマホ向けデザインの変更ははてなブログproで
前提ですが、スマホ向けのデザイン変更ははてなブログproに入ってないとできませんのであしからず。
今回参考にさせていただいたBlog様
今回参考にさせていただいたBlog様はこちらです。
今回本blogで適用したCSSデザインのほかにもたくさんのサンプルがあり、大変参考にさせていただいております。
変更前と変更後
早速ですが、変更前と変更後です。
今回適用したコードの詳細等は、上の参考にさせていただいたblogを見てもらうのが一番かと思います。と、言うより、サンプルで出していただいているコードの色指定部分を少し変えた程度なので、わざわざ自分が考えたコードのように書く必要はないかと思いますので･･･。
変更前
変更後
日付の部分の背景色と文字色、各記事の画像のふち線と丸みを取っただけで、だいぶ印象が変わったように思えます。
日付の部分に関してはもともと「Fresh Green」というテーマを使っているため、あまりかけ離れることのない色を選択しました。（元々のサンプルだと、文字色が白で、背景色が紺色みたいな色だったのを、文字色を濃い目の緑に、背景色を薄めの緑にしています。）
以上が今回の変更点でした。
最後に
筆者はデザインセンスは皆無なのですが、やっぱりデザインとかは調べてトライアンドエラーで試しながらやると結果が直接分かるので楽しいですね。
またいろいろ調べて適用させて生きたいと思います。
本日も最後までお読みいただきありがとうございました。
