buried
公開デザイン「buried」 - はてなダイアリー
昨日の予告通り、公開デザインに登録しました。
コンセプト
主題としては分りやすいので、説明の必要はないかな。
制作のきっかけとしては、MY CHEMICAL ROMANCE の「Helena」PV を見たのが要因の一つです。
http://www.youtube.com/watch?v=yTTZKqyhIUQ
http://www.nicovideo.jp/watch/sm77471(こちらはニコニコ動画)
で、当初は葬列、または棺を運ぶ場面をスケッチしていたのですが → 墓を掘る場面 → 今の形と、いつの間にか時系列がどんどん後になっていきました。PVでは、雨の葬列というモチーフが良かったのでそれを活かしたかったのですが、まぁそれは別の機会にでも。
Three Cheers for Sweet Revenge
- アーティスト: My Chemical Romance
- 出版社/メーカー: Reprise / Wea
- 発売日: 2004/06/07
- メディア: CD
- クリック: 8回
- この商品を含むブログ (69件) を見る
デザイン
別段目新しいことはしてないので、特筆することはないですね。
細いヘッダのカスタマイズと、上部の div.calendar の扱いに付いてはこちらのエントリーを参考にしました。
また、細いヘッダアレンジの作例で使われてた「POWERED BY」の画像はそのまま使ったのですが、
やはりあった方がいいのかな。
あと黒背景は初めて挑戦なので、これまた初めてベーステーマとして hatena2-black を使いながらの制作というのが、個人的には新鮮ではあったのですけれども、世間的にはどうでもいいことの一つらしいですよ。
カスタマイズ
画像を修正する
このテーマに使用している画像は タグ[buried] に置いてあります。
画像を使っているので、簡単に色違いのバージョンを作成する、……というわけにはいきませんが、どうしても他の色が良いという方のために画像の元データを置いておきます。
- buried_ai.zip Illustratorファイル
- buried_eps.zip EPSファイル
- buried.pdf PDFファイル
- buried.swf SWFファイル
- buried.svg SVGファイル
それぞれ、ヘッダとフッタの2つの画像が収録されています。編集にはベクター系のソフトが必要ですね。
- メディア:
- クリック: 3回
- この商品を含むブログを見る
尚、このファイルに関しては、ライセンスは公開デザインと同様に GPL とするので、色違いだけではなく他のテーマに使うなどご自由にお使い下さい。
日付部分を脇に動かす
使い勝手は悪いので、デフォルトでは設定していませんが、私自身はあまり日付にタイトルを使わないので、このような形に変更しています。
その代り、日付部分に文字が入りません。
変更の仕方は
.main{ width: 740px; } .day h2 { position:relative; } .day h2 .edit{ position:absolute; top: 0; right: 10px; } .day h2 span.title{ display: none; } .day .body{ width: 520px; margin: -2.1em auto 0 auto; _margin: -1.9em auto 0 auto; text-align: left; } div.comment div.caption{ padding-left: 0.5em; } div.comment div.commentshort{ width: 520px; margin: -1.8em auto 2em auto; } div.refererlist{ width: 520px; margin: -2.5em auto 3em auto; _margin: -2.4em auto 2em auto; }
で。
日付部分に加え、[コメントを書く] の文言も動かしています。