Firefox Quantum テーマのカスタマイズ タブバーの”位置と色変更”

Firefox Quantum (57.0.4) のテーマのカスタマイズについての覚書。特にタブ回りに特化して対応してみた。

2018-01-19_10h09_25.jpg

今回は、標準テーマの「Light」を適用した上でカスタマイズした。なお、タブバーの位置は3段目に移動している。

C:\Users\ユーザー名\AppData\Roaming\Mozilla\Firefox\Profiles\s7wgszc0.default\chrome\userChrome.css

テーマのカスタマイズは、プロファイルフォルダにある[chrome\userChrome.css] にcssを書き込めばよい。ファイルが存在しない場合は、新規で作成する。通常、何もしなければ存在しないので、新規で作成する必要がある。

[s7wgszc0.default]:プロファイルフォルダは、[ヘルプ] → [トラブルシューティング情報] → [プロファイルフォルダー] で確認できる。或いは、[Win] + [R] で [ファイル名を指定して実行] と云うウィンドウを出し、そこに「%APPDATA%\Mozilla\Firefox\Profiles\」と打ち込むと、[s7wgszc0.default] と云うようなフォルダが表示される。

/* userChrome.css */

/* toolbar */
#nav-bar {
	-moz-box-ordinal-group: 1 !important;
	border-top-width: 0 !important;
}

/* bookmarkbar */
#PersonalToolbar {
	-moz-box-ordinal-group: 2 !important;
}

/* tabbar */
#TabsToolbar {
	-moz-box-ordinal-group: 3 !important;
}

/* normal tabs text color /  background color */
tab:not([selected="true"]) {
	background-color:#EDD !important; 
	color:#000 !important; 
}

/* active tabs text color */
.tabbrowser-tab[visuallyselected=true] {
	 color: #FFF !important;
}

/* active tabs background color */
.tab-background[selected=true] {
	background-color: #808 !important;
	background-image: none !important;
}

/* active tabs top line color */
.tab-line[selected=true] {
	background-color: #F0F !important;
}

/* inactive tabs background color (hover) */
tab:hover {
	color: #FFF !important;
	background-color: #088 !important;
}

/* inactive tabs top line color (hover) */
.tabbrowser-tab:hover > .tab-stack > .tab-background > .tab-line:not([selected=true]) {
	background-color: #00FA9A !important;
}

今回は、タブバーを3段目にして操作性を向上させた関係で、タブ回りの色をカスタマイズしたと云う経緯がある。単なる覚書ではあるが、参考になれば幸いである。

※[userChrome.css] の反映にはFirefoxの再起動が必要になる。

admin
カテゴリ:ブラウザ
タグ:Firefox
2018/01/19 10:52 | コメント (0)
◎この記事へのコメントは 0 件です。コメント欄を表示しますか?
コメントを書く
お名前: [必須入力]

メールアドレス:

ホームページアドレス:

コメント: [必須入力]

このブログについて
jkun-400x400.jpg インターネット, パソコン, スマホ, Windows, Linux, Android, 各種アプリ, ブラウザ, ブラウザ拡張機能, 携帯電話, 社会情勢, 韓ドラ, K-POP 関連の話題を取り上げます。ジャンルとしては幅広く、特定のカテゴリに特化したブログではありません。お時間がありましたら、どうぞお立ち寄りくださいませ。
プロフィール
カテゴリ
ブログ内検索
Powered by さくらのブログ