sphinxのadmonition用にcssを書いたの続き¶
前回のアイコンはサイズも適当に作成していた。画像の余白を削り、サイズも統一した。 さらに、CSSを変更して、タイトル部分をboldにして、それぞれの要素のマージンを合わせた。
Caution
caution用のディレクティブはこう。old mac風のアイコンで区別できるようにしてみてます。なかなかにそれっぽくできた。
Danger
危険(?)のディレクティブをかくとこんな感じ。前回は爆弾マークだったのだが、テロ推奨マークのようであまりいい感じがしなかったので、ドクロマークに変更した。
Note
ノート用のディレクティブはこう。この"Note"や"Danger"の文字を消すには、コラムディレクティブ(http://sphinx-users.jp/cookbook/columndirective/index.html)を使う必要があるみたい。CSSのfloat属性とPaddingをうまく使って、"Note"や"Danger"の文字をアイコンの下へつけるようにした。
Tip
tipのディレクティブをかくとこんな感じ。本文の上辺のpaddingもアイコンの上辺と合わせたつもり。
Warning
警告用のディレクティブをかくとこんな感じ。種類によって背景色も変えた方が良いかもと思って色々と試した。が、色をつけると以外に下品になる。色についてはAppleHelpFileを作るときにもう少し考えてから行うことにする。
cssの実装方法は、htmlのソースとcssのソースを見ればすぐにわかると思うので特に記述しない。
Comments
comments powered by Disqus