userChrome.css・userContent.cssスレ Part11
■ このスレッドは過去ログ倉庫に格納されています
!extend:checked:vvvvv:1000:512
次スレを立てる方は↑を二行重ねて書いてください
●※前スレ
userChrome.css・userContent.cssスレ Part10
http://egg.5ch.net/test/read.cgi/software/1571968384/l50
●拡張機能
Stylish
https://addons.mozilla.org/ja/firefox/addon/stylish/
Stylus
https://addons.mozilla.org/ja/firefox/addon/styl-us/
User Style Manager (レガシーアドオン・要Classic Add-ons Archive)
https://addons.mozilla.org/ja/firefox/addon/user-style-manager/
●スクリプト
userChromeJS/UserCSSLoader at master ・ Griever/userChromeJS
https://github.com/Griever/userChromeJS/tree/master/UserCSSLoader
UserCSSManager (要userChromeES)
https://greasyfork.org/scripts/35880
●CSS（ユーザースタイルを記入するべきファイル）
userChrome.css（UI） / userContent.css（Web Site）
●関連サイト
Userstyles.org
https://userstyles.org/
CSS: カスケーディングスタイルシート | MDN
https://developer.mozilla.org/ja/docs/Web/CSS
とほほのスタイルシート入門
http://www.tohoho-web.com/css/
VIPQ2_EXTDAT: checked:vvvvv:1000:512:: EXT was configured >>599
盾、鍵マークまで部分まで
#urlbar-input-container{background-color:#FFFFFF!important;}
盾、鍵マークの背景色は残す
#urlbar-input{background-color:#FFFFFF!important;}
CSS初心者がやってることなので弊害が出るかも >>601
うちでは両方変わってるんだけどな
初心者にはこれ以上は無理だわ Twitterのフォローのボタンを黒から青に戻すやつをお願いします cssでそれなりに昔のスタイルを温存した環境作れたのだが
browser.proton.enabled true だと
アクティブタブの上辺の線の描画とアクティブタブの背景色の設定がうまく行かない
ブックマークメニューのアイテム名が冗長になり視認性が落ちるのでアイコン復活のcssを使いしたのだが
アクティブタブの上辺の線の描画は、browser.proton.enabled false だとうまく行くのだけど
そうすると復活させたアイコン描画の無効になってしまう
弄繰り回して、アクティブタブの上辺の線の描画とアクティブタブの背景色の設定がうまくいくcssには漕ぎ付けたのだが
ハンバーガーメニューで、アイコンの項目名の間にスペースがなくなって見づらくなった
他にタブをピン止めするとその右に空白が出来て見栄えがよくない
とりあえず、整合性のある見栄えのcssを整えた
それに、アクティブタブの上辺の線の描画のcssを付け加えると
一番左のタブがアクティブになったとき上辺の線が線が見えなくなるという瑕疵がつきまとう、トホホ >>604
div.css-18t94o4.css-1dbjc4n.r-14lw9ot.r-42olwf.r-sdzlij.r-1phboty.r-rs99b7.r-2yi16.r-1qi8awa.r-1ny4l3l.r-ymttw5.r-o7ynqc.r-6416eg.r-lrvibr{background:#0af !important;} >>606,607
ありがとうございます！
元に戻ったー 非アクティブタブをマウスオーバーして上部に線を出したり
文字色を変えたりタブの色を変えたり出来るようになったんだけど
アクティブタブだと出来ない
どうやればいいんでしょうか？ その辺がうまく行かないな
今は妥協案として、アクティブタブの背景色を非アクティブタブより明るくし
マウスオーバーしたタブはその中間の明るさ背景色にしてマウスオーバー感が出るようにしている
だが、アクティブタブが一番左にあるとタブの上の線が描画されないので困ってる
タブを少しドラッグすると上辺の線が見えるのだが
また、アクティブタブの背景色も変えたいのだが、それも従来設定では効かなくなった >>610
.tabbrowser-tab[selected]:hover .tab-background {
box-shadow : 0 0 0 calc(var(--tab-min-height) * 0.5) [変えたい色] inset !important;
}
すごく邪道なやり方だけど >>612
ありがとうございます！
.tabbrowser-tab[selected]:hover を使ったら全部できたよ
/* アクティブタブ背景色(マウスオーバー) */
.tabbrowser-tab[selected]:hover .tab-background[selected] {background-color: white !important;}
/* アクティブタブ文字色(マウスオーバー) */
.tabbrowser-tab[selected]:hover .tab-text {color: blue !important;}
/* アクティブタブ上部の線(マウスオーバー) */
.tabbrowser-tab[selected]:hover .tab-background {border-block-start-color: deeppink !important;} タブのミュートボタンと複数のタブを閉じるの左のタブをすべて閉じるを消せませんかね >>615
タブのミュートボタン
.tab-icon-overlay { display:none !important; }
.tab-icon-sound { display:none !important; }
自分はタブのミュートボタンを使っていますが
YouTube、TVerで確認したら上記ので消えました
左のタブをすべて閉じる
#context_closeTabsToTheStart{display: none !important;}
CSS初心者がやってることなので弊害が出るかも 上記のでは駄目でした
自分の使ってるCSSと併用すると消えるのですが
.tab-icon-image:not([pinned]){opacity: 1 !important}
.tab-icon-overlay { display:none !important; }
.tab-icon-sound { display:none !important; }
でどうでしょうか >>618
自分の使っているCSSをすべて消して
試してみたけど両方消えてるんですよね
CSSいじり始めたばかりですが難しいです
お力になれず残念 モード違ってていろいろ違ってるかもしれんよ
お願いするときはモードも示せよ https://github.com/black7375/Firefox-UI-Fix
これ通知ウィンドウなんで透過させてんだろ
見にくくてしょうがないしfixになってない foxage2ch使っててサイドバーのフォントを変えたいんだけど
userChrome.cssにどう書き込んだらいいかな？
/*サイドバー*/
.sidebar-placesTreechildren {
font-family: 'BIZ UDPゴシック' !important;
font-weight: bold;
color: #595959 !important;
font-size: 14px !important;
}
で変わらなかった URLバーと検索バー境目が分り難いからちょっと濃いめのグレーにふち取りしたいんだけど、URLバーと検索バーのふちに色を付けることって可能？ >>623
拡張機能のサイドバーの中身はuserContent.css
調べるには about:debugging → この Firefox → 拡張機能 → [調査] ボタン
使い方はブラウザーツールボックスと同じ
まずフレーム選択ボタンで調査対象をサイドバーの中身にする
https://developer.mozilla.org/ja/docs/Tools/Browser_Toolbox#targeting_a_document >>624
分かり難いと思ったことないけどテーマによるのかな
こんなんでどう
#urlbar:not(:focus-within),
#searchbar:not(:focus-within) {
border: solid 1px #494d50 !important;
border-radius: var(--toolbarbutton-border-radius) !important;
} >>625
ありがとうございます
少し触ってみたのですがブラウザツールボックスも弄ったことがないので、フレーム選択ボタンがどれなのか分かりませんでした
https://i.imgur.com/D7kdIrX.png
の赤枠の部分がフレーム選択ボタンかと思いますが、以下の画面にそれっぽいボタンは見当たりませんでした
https://i.imgur.com/nyEtJlT.png >>626
有り難うございます
色だけ変更して理想的な見た目になりました >>627
存在していないものは選べないよ
調べたいサイドバーを開いた状態でないと サイドバーを開いてみたのですが、ボタンが表示されないみたいです
https://i.imgur.com/3k8z3iv.png >>630
ごめんわかんない
てっきりFoxAge5chだと思ってた、FoxAge2chなのね
Firefox 91で動くFoxAge2chってどこにあるの
AMOには無いしググっても見つけられなかったんだけど FoxAge5chってあるのか！そっちを知らなかった >>633
ども
WebExtensionとしてインストールするけどXULアドオンちっくな…どういう仕組みなんだろこれ
ともかく、ブラウザーツールボックスで調査できました
userChrome.css に書いてください:
@-moz-document url("chrome://foxage2ch/content/foxage2ch.xhtml") {
#mainTree,
#subTree {
font-family: 'BIZ UDPゴシック' !important;
font-weight: bold !important;
color: #595959 !important;
font-size: 14px !important;
}
} わざわざ調べてくださり有り難うございます
無事フォントを変更する事が出来ました Lepton を使っている方に質問があります
「Proton UI」を維持しつつ、タブやメニューを以前のスタイルっぽくしてくれる Firefox 用テーマ「Lepton」 ? GIGA！無料通信
https://www.gigafree.org/firefox/lepton/
Lepton を適用すると、履歴 → すべての履歴を表示 で表示される
ブラウジングライブラリー内の、管理 などのメニュー表示が、こちらでは
半透明になってしまうのですが、これはおま環でしょうか？
Lepton の適用を止めるとメニューの半透明化は直るので、Lepton の
不具合かと思うのですが、皆さんの所ではどうでしょうか？
宜しくお願いします チョンの作ったやつなんか使うなよ
気色悪いな もう 最新のLeptonだと、そもそも、履歴(S)とブックマークとブックマーク(B)が他とが違ってきている
だから、即刻、前のバージョンに戻した
元々の設定を表示するように戻したのかもしれないけど、何らかの取り残しが生じたようだ
メニューの仕立てには問題があった
91だと、メニューの背景色や区切り線に関するcssに副作用が出てこないのでそれを使っているけど
履歴(S)とブックマークとブックマーク(B)のプルダウンメニューと他では、はっきりした色の違いが出た
それなのに、僅か幾つかで元々の反転色か残る
反転色の違いは、管理のプルダウンメニューと同じになる
Leptonはプルダウンメニューのアイコン表示に便利だが
若干バグが含まれていて、不思議な現象が生じる
その副作用を取り除くことはなかなか困難 >>637
何も役に立つもの生産できないネトウヨが嫉妬するなよ
気持ち悪いなもう メニューに関しては、92から次の段階の迷走が始まる
そこでの問題をLeptopでは対応できてない
Leptonを導入するにも、ユーザーがそれまでに作った環境の放棄に値するほどでもない
つまり、おま環言われても相容れなければ意味は薄い
というのは、1/10程度の記述でアイコン以外の必要なことが実現できていたのだから
メニュー表示に関することで問題があるのは事実だ
メニューにアイコン付加するための最小限の副作用の起きないバージョンが望まれる >>640
レス有難うございます
おま環が分かっただけでも収穫です
使っているのは black7375 で最新だと思います
報告ってやっぱり英語ですよね？う〜むｗ 教えてください！
91の行間は改善したんですが
メニューバーのブックマーク等の背景色をグレーにするには
下記のCSSにどのように追記すれば良いですか？
/* ブックマークアイテムの高さを変える */
.bookmark-item,
.bookmark-item > menupopup,
.bookmark-item > menupopup > menuitem {
padding-block: 0.15em !important;
}
/* タブの間隔を狭くする */
.tab-background {
margin-bottom: 0 !important;
border-radius: 0 !important;
fabbrowser-tab {
padding-left: 0 !important;
padding-right: 0 !important;
} 91までだね、92以降はブックマークツールバーのフォルダーのプルダウンメニューは別の施策が必要
/* コンテキストメニューの色の変更 */
menupopup {
-moz-appearance: none !important;
background-color: gray !important;
} >>645
「メニューバーのブックマーク等」がどの部分を
指してるか分からないがサイドバーじゃくツールバーなら
#toolbar-menubar,
#PersonalToolbar,
#TabsToolbar,
#nav-bar
{background-color: #ff0000 !important;}
あっちのスレでした質問を取り消して
スレを移動したこと書き込んだほうがいいぞ >>646
ありがとうございます
追記しましたがグレーになりませんでした
バージョンは最新の91.0.2です それぞれの環境、テーマなどの違いがあるから
>>647でも、試してみたけど、逆に、そちらではだめだったwww >>647
あっちはクローズしてきました <(_ _)>
https://i.imgur.com/S2BHMGl.png
改悪前は画像の色だったんですが黒っぽくなってしまいました ワロタ、>>647は自分のcssだと、記述場所を変えて、全部または部分で
メニューバーの色を変えるのに使えるにゃwww 見つけたのは
.menupopup-arrowscrollbox {background-color: grey !important;}
メニューの大部分に有効になってしまうが >>652
自分のは変化無しです
具体的に教えてください！ >>653
やってみましたが変化無しです
テーマの影響でしょうか？
Black Shine使ってますが改悪前はグレーでした >>654
申し訳ない
それは全然見当違いの場所に適用するやつです
>>653さんのやつでいけるみたいです >>655
テーマ Black Shine 入れて確認してみたけど下記のでいけますね
.menupopup-arrowscrollbox{
background-color:#ff0000!important;
}
カラーコードを調べて自分の好きなカラーを選んでで
「#ff0000」を書き換えてみても変化ありませんか？ >>653
一番下から一番上に記述したら色が変わりました！
ありがとうございます！
>>656
どういたしまして <(_ _)>
初心者に付き合って頂いて感謝です >>657
真っ赤になって焦りました(笑)
ありがとうございます <(_ _)> すみません
もう一つだけ教えてください
背景色は変えられましたが
文字を黒にする記述を教えてください
今現在は白です 自己解決しました
.menupopup-arrowscrollbox {
color: black !important;
background-color: grey !important;
}
いろんな色で楽しんでいます
お騒がせしました<(_ _)> だけど、どうやら、92では
.menupopup-arrowscrollbox {
color: black !important;
background-color: #fffff0 !important;
}
で、行けそうだ、ありがとうよんwww
今までは、テーマをfirefox colorでハンバーガーメニューの背景色を指定替えすることで
それと色の従属関係にあったブックマークツールバーのフォルダープルダウンメニューの背景色を変えていた
そうなると、テーマーの選択肢がなくなった
また、ブックマークツールバーのフォルダープルダウンメニューの影の部分に副作用があった
それも解消した
後は、leptonを導入した場合のタブの色の指定だ
従来方法とバッティングする >>663
92でもイケそうで安心しました
取り敢えず今日はここまでで90％元に戻りました
/* コンテキストメニューの色の変更 */
.menupopup-arrowscrollbox {
color: #000000 !important;
background-color: #c0c0c0 !important;
}
/* ブックマークアイテムの高さを変える */
.bookmark-item,
.bookmark-item > menupopup,
.bookmark-item > menupopup > menuitem {
padding-block: 0.15em !important;
}
/* ブックマークアイテム以外の高さを変える */
menupopup > menuitem, menupopup > menu {
padding-block: 2px !important;
}
/* タブの間隔を狭くする */
.tab-background {
margin-bottom: 0 !important;
border-radius: 0 !important;
fabbrowser-tab {
padding-left: 0 !important;
padding-right: 0 !important;
}
後の10％は各メニューバー項目で非活性（グレーアウト）の色を白に変えたいけどわかりませんでした
どなたか教えてください！ うーん
.menupopup-arrowscrollbox {
color: black !important;
background-color: #fffff0 !important;
}
で、解決したと思ったけど
この設定ではコンテキストメニューの部分で極端に遅く反応する場合が生じた
Leptonとの関連か
まいったね なんだろ、全体がおかしくなった
回線パクラレたかにゃ 全体の情況を見ようと、52esrを起動したらいきなりバージョンアップした
アドオンも同時にアップさせられ
本体、プロファイルのバックアップで何とか戻した
だが、コンテキストメニューの挙動が前のようでない
何なんだろう
他のバージョンも同様、レジストリーかキャッシュか
訳分らないな 問題がなかったバージョンにもおこりセーフモードでは発生しない
全部のプロファイルにゴミが入ったとは考えにくいのだが ブックマークツールバーに並んだアイコンのコンテキストメニューには遅延は発生しない
その他のコンテキストメニューが遅延する
表示領域のコンテキストメニューは問題ない
何かアドオンが悪さしているのだろうか 遅延を促進する呪文のようなカーソルの動かし方は見つけたけど
いつも、有効ではない
一斉に違ったバージョンで起きると言うのが解せない 同一バージョン、同一OSで起きていることではないし
そして、もっさりというのでなく、無反応 ブックマークアイコンやフォルダーのメンテナンスに係わることだから、そのままの状態で使う分には問題ない
が、メンテナンスの操作性を大幅に損なう
モジラが、一斉に何らかの意図を持ってアクションを起していると疑いをもつ
更新確認もしない設定なのに、テストのために温存していた52,9.0esrがいきなりバージョンアップした
問題のなかった温存していたバージョンでも、Linuxでも見られるのだから、訳ワカメ
リフレッシュしたら、Chromeさえも比べられない劣化環境になる
今のところ試行錯誤の結果は、アドオンは問題ないようだ
userChrome.jsを有効*無効のトグル操作で調べたところ、無効にすると問題は生じない
ローダーか、個別のスクリプトかは弁別できる所まで行ってない 大方、問題は特定した
ToolbarAutoHide.uc.js
コンテキストメニューを開いた時点でプルダウンメニューの位置がぶれて
システムのステータス取得に不都合が起きるのだろう
しかし、ここに来てなぜ状況が顕在化したのか不明 ToolbarAutoHide.uc.jsの運用上のトラブル回避策
コンテキストメニューを開くとき、アイテムの一番右側にカーソルを持って行ってから右クリックすると
コンテキストメニューのカーソル反転が直ぐ行なわれるようになる 以上のような情況ですので、ToolbarAutoHide.uc.jsの作者の方、よろしくお願いします プルダウンメニュー/コンテキストメニューの構築も問題なのかも ブックマークツールバー・フォルダーアイコンの右クリックメニューの92になると実装が変わる
そのために、プルダウンメニューの背景色が設定に従来どおりでは行かない場合が生じる
その解決方法が見つかったら、コンテキストメニューの反応の問題が生じた
ま、だましだまし、使っていくしかないね
纏めると、背景色の問題は
.menupopup-arrowscrollbox {
color: black !important;
background-color: #fffff0 !important;
}
で対策
コンテキストメニューの反応異常の問題はアイテムの右単で右クリックする
でとりあえず凌げる
モジラの実装、ToolbarAutoHide.uc.js、別の見た目対策
に期待待ちというところですか おまえ昨日から同じ奴だろ
何の参考にもならないおま環修復の結果報告なんかダラダラやるなよ ブックマークツールバーのフォルダーアイコンの実装がオーバーフローメニューやハンバーガーメニュー見たいな実装になるのはたしかだし
コンテキストメニューの背景色を変えたい人もいる
ToolbarAutoHide.uc.jsを使っている人もいる
役立つか役立たないかその人次第、
そのあたりの実装にほかに色々問題があるのも事実
それにユーザーはユーザーなりに対処せざるを得ない状況が生まれてきているって事だ 11-に構ってる奴も11-
つまりe2f1-4thNは11-
1f6d-zH/yも11- 誰かStylus用のココのサイトをこういうふうにするCSSを書いて公開してくれぇ〜
っていうリクエストを書くスレってどこかにありますかね？ macでFF91なんだけど
タブのコンテキストメニューが消えなくなった
91前はタブを再読み込みは
#context_reloadTab
で消せた
ググって
#context_reloadSelectedTabs
を追加したけど効果なし
こういうのどうやって調べるんですか？ >>688
web開発ツールの設定の詳細設定の項目にある
"ブラウザーとアドオンのデバッガーを有効化"と"リモートデバッガーを有効化"にチェックを入れると
ブラウザーツールボックスが使えるようになるからコレで調べな >>689
>>690
サンクス
でもどうやらmacOS Big Surではネイティブコンテキストメニュー？
というものが優先されて使われるらしい・・・proton UI関係あるのかな
そういうのさっぱりわからないわ
なので#context云々ではどうにもならないみたい
widget.macos.native-context-menusをfalse
でネイティブコンテキストメニューを無効にして消えたけど
proton UIに反するのかなあ。。。 Leptonが頻繁に改訂されているけど、回を重ねるごとに混迷を深めた形で立ち現れてくるので困惑してる
最新版ではメニューバーの各メニュー項目のアイテムまでアイコンを表示するようになったのだけど
メニューバーにもアイコンが表示されてしまい、アイコンつくのとつかないとで隙間があったりアイコンがあったりと
従来メニュー表示を逸脱したものになっている
その他、メニューの背景色などを設定していると顕在化するのだが
「履歴(S)とブックマーク(B)のプルダウンメニューの描画が他とは違う扱いになっている
あと、タブバーの一番左が他とは別の振る舞いをする
そこで、比較的混迷度の低い初期バージョンを使うことになる
アイコンを復活させないのであれば、別の接近で解決したほうが副作用は少なく見える デフォテーマでブックマークメニューポップアップの背景色おかしくなってるし
管理できてないね 連日更新してるようで、先ほど最新版を試して見た
メニューバーへの必要もないアイコン付加を引っ込めてくれたのかと思ったけど、そのままで
併用していたcssで、前回までは有効であったブックマークメニューのフォルダーアイコンの個別割り当て設定が効かなくなったいた
何処を目指しているのだろうか >>694
たぶんオマエのようなうっせえクソクレーマーのふるい落としなんじゃね？ ワロタ、[importの一行消せばそのままやっていける
そして機能しなかったのが復活して切れが良くなる
アイコン付加だけがなくなるだけ 恐らく leptonの作者はメニューバーを表示した時のことをテストしてないのか
でも、そのプルダウンメニューにアイコンについて作業しているのだから、ありえないことなんだけどね ■ このスレッドは過去ログ倉庫に格納されています
