PIKU LIFE

趣味とか制作記録とか作業メモとかのBLOG

デザイン修正3(アイコンフォント導入・ヘッダー再調整)

スクリーンショット 2016-08-20 23.24.55
苦戦しながらも、やっとアイコンフォントの導入に成功….!
本当はligature_symbolsを使うはずが、なかなか上手くいかず、結局無難に fontawesome をつかうことに。

ヘッダーと記事タイトルには各phpファイルに直接<i>タグを埋め込んで、サイドバーの部分はhtmlがechoされてなくて同じ手段が使えなかったから、該当のクラスに CSSで :before を使って記述する方法で書き込みました。

やっとアイコンが入って、目指す形に近づいてきたので、同時にデザインも再度微調整。
ずっと微妙だったヘッダー部分に背景カラーを入れて、可愛い感じにまとめられました。

残るは記事コンテンツ内用のタイトルスタイルかな〜
ヘッダー可愛くなったから、画像作成案は一旦保留で。

デザイン修正2(記事タイトル)

スクリーンショット 2016-08-19 9.05.56

通勤途中の電車の中での作業(笑)
記事のタイトル下に border dotted を追加。

始めは border solid × yellow の予定だったけど、dottedのほうがしっくりきてこれにしました。
solid だと主張しすぎてタイトルテキストが負けちゃうのかな。
色も黄色だとばらつきがでちゃったから、タイトルと同じ色のグリーンに。

タイトルとしていい感じにまとまりました💕
ヘッダーのborder-bottom との相性が微妙だけどまだどうすればしっくりくるか悩み中。。

ブログ作り直し

改めて、記録用としてブログの立て直し。
ドメインを買い直して、Wordpressも入れ直して、Psで配色デザインを考えて….

ずっとやりたいやりたいと構想だけを練りながら、ずっと行動に移せなかった。
まだまだ、構想していた内容のうちの2%くらいしか実現できてないけど、
これから少しづつ完成系に近づけていけるようにがんばります。