IdobataではHook経由でHTMLをPOSTすることができる。style属性はストリップされてしまうんだけど、class属性を指定することができる。メッセージ中に使用されることを意図しているかどうかはわからないけど、下のようなスタイルが使えて結構便利だ。
Label
角丸のラベルっぽい感じにできる。label-* classを使うことで色を変えることができる。
<span class="label">ラベル</span>
<span class="label label-important">ラベル</span> <!-- 色を変える -->
| class | サンプル |
|---|---|
.label |
 |
.label.label-important |
 |
.label.label-warning |
 |
.label.label-success |
 |
.label.label-info |
 |
.label.label-inverse |
 |
Badge
左右が半円になっているやつになる。数字を表示するときとかに便利。
background属性を上書きしたいけどbackground-color属性が使われてるので色が反映されない。残念。.badge-importantだけ他のブロックで指定されてるのは別の要素に使ってるのが偶然効いてるだけのようにみえる。
<span class="badge">ラベル</span>
<span class="badge badge-important">ラベル</span> <!-- 色を変える -->
<span class="badge badge-warning">ラベル</span> <!-- バグなのか仕様なのか色は変わらない -->
| class | サンプル |
|---|---|
.badge |
 |
.badge.badge-important |
 |
.badge.badge-warning |
|
.badge.badge-success |
|
.badge.badge-info |
|
.badge.badge-inverse |
|
絵文字
Emoji
:smile:とかは変換されないようなので、imgタグを使うことで実現する。
<img class="emoji" alt=":smile:" src="/images/emoji/smile.png" height="20" width="20">
FontAwesome
FontAwesomeの絵文字が使える。
<i class="fa fa-camera-retro">カメラ</i>
その他
commit-id
コミットIDをmonospaceにするためだけに使われている。
<span class="commit-id">ABCDEF</span>
まとめ
お気に入りのclass指定ですばらしいIdobataライフを！