読者です 読者をやめる 読者になる 読者になる

ブログデザイン手直し。

このブログのデザインであるPure-soda。
個人的に気に入ったので選んだのだが、いろいろ不便な点があったので手直ししてみた。
追記:公開デザインに投稿してみました。

ブログ全体の横幅を広げる

標準ではあまりに横幅が狭く、niconico記法をやった際はみ出すので横幅を広げる。
スタイルシートに以下を追加。

#simple-header {
width:768px;
}
.hatena-body {
width:768px;
}
.main div.day, .main div.calendar {
width:538px;
}
h1 {
width:768px;
background-color:#ffffff;
}
.main .body {
width:518px;
}

カレンダーの不具合を修正する

記事を書いた時のリンクの色と、現在の日付を表す背景色が同色で数字が見えなくなるため、囲み線に変更。
スタイルシートに以下を追加。

.sidebar table.calendar td.day-today {
background:none repeat scroll 0 0 #ffffff;
border:solid 2px #98CBFE;
}

自動リンクと手動リンクのデザインを区別する

キーワードを言及した際、自動で張られるリンクと、自分で張ったリンクが同じデザインだと混乱するので修正。
スタイルシートに以下を追加。

.body .section p a {
border-bottom:1px solid #98CBFE;
color:#67B2FC;
text-decoration:none;
}
.body .section p a.keyword {
border-bottom:1px solid #98CBFE;
color:#646464;
text-decoration:none;
}

あとはヘッダにパンくずリストを設定したりなどなど。
Firebugには本当にお世話になりました。