前の記事「カッとなってTracのインタフェースをカスタマイズするJavaScriptを公開してみる」の続きです。
以下に、変換後のHTMLのに付けられるid名をメモしておきます。
ヘッダー部分(<div id=”metanav”>~</div>内 )
前記事の変換後のHTMLソースを参考にCSSで定義してください。
変換前 | 変換後 | id名(<li><a id=”***”>) |
---|---|---|
Logout | ログアウト | metanav_logout |
Settings | 設定 | metanav_settings |
Help/Guide | ヘルプ | metanav_help |
About Trac | Tracとは | metanav_about |
デフォルトではログインしてる場合は以下のようにログイン表示部分のliタグにid名がつきます。
ログインユーザー名: hoge
id名:login_hoge
変更例
<li class="first">logged in as hoge</li>
↓
<li id="login_hoge" class="first">hogeがログインしています</li>
メニュー部分(<di id=”mainnav”>内 )</div>)
変換前 | 変換後 | id名(<li><a id=”***”>) |
---|---|---|
Wiki | Wiki | mainnav_wiki |
Timeline | 作業の流れ | mainnav_timeline |
Roadmap | 進捗状況 | mainnav_roadmap |
Browse Source | ソースを見る | mainnav_brouse |
View Tickets | チケット | mainnav_view |
New Ticket | 新規チケット | mainnav_new |
Search | 検索 | mainnav_search |
Admin | 運営管理 | mainnav_admin |
アクティブなページには対応するliタグにclass属性で”active”が追加定義されます。
メンバーアイコンの表示
利用ユーザーのIDを trac_design.js に登録して、以下の命名規則のclass名をCSSに定義しておけばアイコン表示を利用できます。
デフォルトでは[ cgfm_doticon_(ユーザー名)]となっています。
(このclass名の変更はJSファイルをいじってください)
class名はTracページ内を検索してこんな感じで付けられます。
例)利用ユーザー: hogeの場合
チケット内に「hoge」の文字列があったら
hoge
↓
<span class="cgfm_doticon_hoge">hoge</span>
チケットをacceptしてたら
hoge *
↓
<span class="cgfm_doticon_hoge_accept">hoge *</span>
これで誰から誰へのチケットなのか、わかりやすくなります。(少し重くなるけども)
もちろんアイコンにしなくて、上記のclass名に対してシンプルにCSSで背景色・文字色の変更するだけでも良いと思います。
こんなTIPSが本当に役に立つのかわからんですが、
同じような境遇になった人の役に立てれば幸い。
(そもそもTracにデザインなんて求めねーよ! なんて言われたらオシマイ)
コメント