userChrome.css・userContent.cssスレ Part14

2024/03/14(木) 05:47:51.97

!extend:checked:vvvvv:1000:512
次スレを立てる方は↑を二行重ねて書いてください

●前スレ
userChrome.css・userContent.cssスレ Part13
https://egg.5ch.net/test/read.cgi/software/1700870200/

●拡張機能
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

2025/04/02(水) 20:09:38.74

うちのはFx137になっても利いてるよ
>>714のと同じかな

/* タブの高さを変更する */
:root {
--tab-min-height: 26px !important;
}

**713** (ﾜｯﾁｮｲ 7fd4-DUcv) · 2025/04/02(水) 20:33:21.26

>>714, >>717
それらの記述こちらでは、v137でもNightly(v139)でも有効になるから
新規プロファイルで試してｵﾏｶﾝを要チェック

CSSとuser.jsでUIをFixするFirefox-UI-Fix
🪚https://github.com/black7375/Firefox-UI-Fix?tab=readme-ov-file#padding-comparisons

・Photonはv57～v88までのUI
・Protonはv89から現在までのUI
　Protonはメニューの行間が間延びしまくってるのが良くない
・オリジナルのLeptonはアイコンが逆に余計すぎる

v29～v56までのAustralisって丸っこいタブのUIが可愛かった

**714** (ｱｳｱｳT Sa8f-mdxR) · 2025/04/02(水) 20:40:58.40

>>720
念の為、そのままコピペしたけど変わらず。
アドオン等追加したわけでもないのに判らない。

**721** (ﾜｯﾁｮｲ 7fd4-DUcv) · 2025/04/02(水) 22:15:19.31

>>722
プロファイルっていうか
userChrome.css内の他の記述でエラーが出てそう
だからuserChrome.cssをリネームで退避して
新規userChrome.cssに>>714, >>717だけを入れたら機能しそう

あと>>721の🪚、
試すなら本命プロファイルではやらん方がいいかも
CSSファイルは削除するだけで元に戻せるけど、
⚠1⃣https://blog.goo.ne.jp/koyusoma5102/e/c369bc61002795740d50baacecc77247
user.jsからprefs.jsに設定値が追加された値のアンインストール法が書かれてなかった

prefs.jsだけを初期値に戻す方法が意外とFirefoxに無い！
user.jsはuser.jsで独立して、user.jsを削除したらその設定は消える
な動作が理想

因みに、Firefoxが勧めてくる「リフレッシュ」は絶対押さん方がいいｗ
やるなら新規プロファイルに既存プロファイルの設定をインポート

2025/04/02(水) 22:42:14.36

うちもなんでかタブの長さしてい利かなくなってるな

2025/04/02(水) 22:53:06.80

137にしたからそのまんまコピペして試してみたけど
714
715
718
720
どれもちゃんと高さは変わるな
タブバーにはボタンは何も置いていない
タブバーのボタンを一度外してみたらどうだろう

2025/04/03(木) 00:57:53.10

普通に効いてる

/* タブの横幅 */
.tabbrowser-tab[fadein]:not([pinned]) {
min-width: 125px !important; /* 最小値デフォルト 76px */
max-width: 165px !important; /* 最大値デフォルト 225px */
}

2025/04/03(木) 01:01:22.05

これも効いてる

/* URLバーとサーチバーの見た目を変える */
#urlbar-background,
#urlbar-input-container,
#searchbar,#urlbar
#navigator-toolbox .searchbar-textbox
{
Outline: none !important;
box-shadow: none !important;
border-radius: 5px;
font-size: 11px !important;
color: #000000 !important;
background-color: #F7F7F7 !important;
}

**723** (ﾜｯﾁｮｲ 7fd4-DUcv) · 2025/04/03(木) 01:52:05.32

アドレスバーはこれトグルしといた方がいい
browser.newtabpage.activity-stream.improvesearch.handoffToAwesomebar
🔝https://susu.cc/2021/06/firefox89search.html

アドレスバーの「今回だけ使う検索エンジン: 」を
昔のverの様に、アイコンをワンクリックで飛べる様に戻すabout:configないかな？

　過去ver:　ワード入力➔アイコンクリック➔🏁
　現在ver:　ワード入力➔アイコンクリック➔Enter➔🏁
　未来ver:　ワード入力➔アイコンクリック➔アイコンクリック➔Enter➔🏁

アドレスバー系で替えてるabout:config
🔧リーダーモード:　無効
reader.parse-on-load.enabled
🔧Pocketサービス:　無効
extensions.pocket.enabled
🔧URLの自動補完:　無効
browser.urlbar.autoFill
🔧ドロップダウン数:　初期値の10だと検索アイコンまでの移動距離が遠い
browser.urlbar.maxRichResults

2025/04/03(木) 06:09:34.97

fadeinってどういうパラメーターなの？

**114** (ｱｳｱｳT Sa8f-mdxR) · 2025/04/03(木) 08:11:15.29

新規プロファイルで試したがダメだった。
userChrome.cssは数点のみ設定したが、相変わらず下記だけ効かない。
/* タブの高さの調節 */
:root {
--tab-min-height : 23px !important;
}
他に原因あるのかな？

警備員[Lv.8][新芽] (ﾜｯﾁｮｲ df15-kVuH) · 2025/04/03(木) 08:47:28.11

他のCSSの影響があるかも
一番上に記述してみるとか

2025/04/03(木) 08:56:13.01

>>731
アドオンなしで、CSSは動作確認のため、他に2個指定しただけ
記述順を変えても同じ
OSはWin10

**114** (ｱｳｱｳT Sa8f-mdxR) · 2025/04/03(木) 09:26:33.12

>>715
>>720
OSはWindows11ですか？
10では動作しません。

2025/04/03(木) 10:54:51.38

タブバーの画像が欲しいね
ボタン類がじゃましてそうだが

2025/04/03(木) 16:47:59.06

テーマかもね

2025/04/04(金) 01:12:32.34

/* タブの高さを変更 */
.tabbrowser-tab {
min-height: 25px !important; /* 最小高さ */
max-height: 25px !important; /* 最大高さ */
}

2025/04/04(金) 01:22:16.05

/* アクティブのタブの幅を広げる */
/* .tabbrowser-tab[visuallyselected]:not([pinned]) {min-width: 165px !important; } */

/* マウスオンのタブの幅を広げる(ピン留めタブは除外) */
/* .tabbrowser-tab:not([visuallyselected]):not([pinned]):hover { min-width: 180px !important; } */

/* マウスオンのタブの幅を広げる */
/* .tabbrowser-tab:not([visuallyselected]):hover { min-width: 180px !important; } */

/* マウスオンのピン留めタブの幅を広げる */
/* .tabbrowser-tab:not([visuallyselected]):is([pinned]):hover { min-width: 180px !important; } */

2025/04/04(金) 16:05:30.70

>>685に質問があったのですが、
・右側のタブを閉じる
・左側のタブを閉じる
・全てのタブを閉じる
以上の項目は、タブを右クリックして出る「複数のタブを閉じる」の次の階層に表示されるのですが、「複数のタブを閉じる」と上に出るセパレーターを表示させず、直接表示させる方法があるでしょうか？
687では上手くなりませんでした
宜しくお願いします

警備員[Lv.6][新芽] (ｱﾝﾊﾟﾝ df15-kVuH) · 2025/04/04(金) 16:36:23.48

>>738
>>685のスクリプトを用いないと第一階層に出てきません

2025/04/04(金) 21:02:00.59

>>739
有り難う御座います
cssだけでは、やっぱり無理ですか

警備員[Lv.3][新芽] (ｱﾝﾊﾟﾝ df15-kVuH) · 2025/04/04(金) 21:12:57.27

そうです

2025/04/05(土) 18:19:34.21

css使い手ならuserChrome.jsで調べればすぐ使えるでしょ　専用スレもあるし

**728** (ﾜｯﾁｮｲ 02d4-U54R) · 2025/04/06(日) 08:54:11.45

* {-webkit-text-stroke-width: 0.45px !important;}

@font-face{
font-family: "游ゴシック【本来】"; /* ←@font-faceでfont-familyを即席で作る。名前は何でもいい */
font-weight: normal;
src: local("YuGothic-Medium"); /* ←local("　")にはフォントのPostScript名が必要 */
}
@font-face{
font-family: "游ゴシック【本来】";
font-weight: bold;
src: local("YuGothic-bold"); /* ←Bold体だけ別のフォントにすることも可 */
}

* {font-family: "游ゴシック【本来】" /* ←↑で作った即席のfont-family名 */
/* , *//* 文字化けするアイコン用Webフォントを>>698↖ */
!important;}
￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣
※
Windowsに8.1から標準搭載されてる游ゴシック(MicrosoftのYu Gothic UIとは違う)は、
Microsoft社畜がド低能なので
ウェイトが細すぎて本文などにはそのままでは使えない（※MacはMediumとBoldだけを選定して搭載してる）
から俺竜の矯正方法　（吾輩のセッティングは>>701）

* {font-family: "Lucida Console", "游ゴシック(本来)" !important;}
の様に、欧文フォントを先に入れとくと従属欧文だけを任意のフォントに混合する事も可

フォントの「PostScript名」を視られるソフトが意外と無い！
砂漠の中から砂金を👁つけれたのが dp4 Font Viewer: 📛https://us.fontviewer.de/

Windowsはレンダリングが低級なのに加えて『ヒンティング』という鱗も附いてるので
マトモに遣いたかったら更にMacTypeなどで鱗を落とす必要が有る
　c.f. 🎞https://mevius.5ch.net/test/read.cgi/win/1642086530/879n

**743** (ﾜｯﾁｮｲ 02d4-U54R) · 2025/04/06(日) 08:54:56.49

webkit-text-strokeのpx数は、使用フォントによって違うのと
Chrome(Chromium系)ではもう少しpx数が必要
Firefoxではv123から改悪されていてv122.0.1までより綺麗にならない

　　Chrome:　https://web.archive.org/web/20241106031549if_/https://pbs.twimg.com/media/Gbq2GafasAAvib7.png:orig
　🦊v122.0.1迄:　https://web.archive.org/web/20240320101902if_/https://pbs.twimg.com/media/GJGEKEVbcAAD9IT?format=png&name=orig
　🦊v123～127:　https://web.archive.org/web/20240320102005if_/https://pbs.twimg.com/media/GJGEKq2a4AE-DnI?format=png&name=orig
　🦊v128～現在:　https://web.archive.org/web/0if_/https://pbs.twimg.com/media/Gbq2HKKa8AAqkhB.png:orig
　　ﾀﾞﾒﾀﾞｺﾘｬｗ:　https://web.archive.org/web/20241106032027if_/https://pbs.twimg.com/media/Gbq2IlFbkAAQJw-.png:orig

　　※Stylusは既にManifest v3に対応済み
　　※ヒラギノUD角ゴ W3になってる箇所は W4 W6 の閒違い
　　※使用ディスプレイはWQHD 27インチでスケーリングが100%
　　　4Kディスプレイは経由しないので、
　　　4Kでもtext-strokeやヒンティングの除去が必要かは不明

現在、再々延長サポートされてるESR 115をESR 128系へ自動アップデートさせずに使う手法は、
⬇https://ftp.mozilla.org/pub/firefox/releases/　（現在だったら115.22.0esr/➔win64/➔ja/➔Firefox Setup 115.22.0esr.exe）
からインストールした直後に
作成しといた自動アップデートを無効化するdistribution\policies.json 📁📄https://aprico-media.com/posts/6417#head-d3ead33350d1d6a6599cb2e873773191
をインストールフォルダにｺﾋﾟﾍﾟして止める

　　※distribution📁はインストールの度に消える
　　※about:configのapp.update法は現在では機能しない

□https://forest.watch.impress.co.jp/docs/news/1670239.html
今月のWindows UpdateでWindowsにGoogleのNotoが標準インストールとなり
Chrome(Chromium系)では仕様により本文フォントが[メイリオ]➔[Noto Sans JP]に置き替わる

2025/04/07(月) 20:20:49.08

cssは、自分でテキストで書けるのがいい
安心でもある
cssだけで弄るのがスッキリする

userChrome.jsは、誰かが書いたスクリプトを使ってしまう感じがして、何か安心出来ない気がする

Firefoxを色んな方法でごちゃごちゃ弄りたくない
勘違い？

2025/04/09(水) 14:58:46.31

ミュートボタン？スピーカーボタン？を消したい

2025/04/09(水) 15:31:46.45

解決しましたm(_ _)m

2025/04/09(水) 15:47:47.39

How do I get rid of the mute button from the tab? : r/FirefoxCSS
ttps://www.reddit.com/r/FirefoxCSS/comments/1j69xte/how_do_i_get_rid_of_the_mute_button_from_the_tab/

2025/04/15(火) 16:05:42.93

Nightlyで menu、menuitem関連のクラス名が色々と変わった
https://bugzilla.mozilla.org/show_bug.cgi?id=1959540

2025/04/15(火) 20:10:10.22

Nightly139に更新してからだが、縦タブを有効にすると、選択タブの強調線の.tab-context-lineの全幅が0pxになって表示されなくなる。
widthを指定すると表示されるんだが、あまり余分なcss加えたくないんで戻してくれんかな

2025/04/15(火) 23:20:39.59

縦タブじゃサイドバーを結局使うからそれならアドオンでいいじゃんってなっちゃったな

2025/04/18(金) 00:28:37.28

ピクシブ百科事典ですが、インタフェースが変わってからフォントが薄くなって読みにくくなりました
https://dic.pixiv.net/

斜めフォントだったり文字が薄いのをなくして、メイリオなどに修正したいのですが、
cssを教えて下さい

2025/04/18(金) 10:34:14.56

>>752
とほほのCSS入門 - とほほのWWW入門
https://www.tohoho-web.com/css/

2025/04/19(土) 02:22:32.12

アップデートでまたサイドバー開閉が動かなくなった面倒臭ぇって思ったけどChatGPTに頼んだら数回のやり取りで見事に修正してくれたわ
しかもここ古いから直しといたぞっておまけ付き
いい時代になった

2025/04/19(土) 03:52:21.08

>>754
サイドバー開閉の修正後のcssを教えて下さい

2025/04/19(土) 08:27:33.57

AutohideSidebar2.uc.jsもいいですよ

2025/04/19(土) 10:23:27.62

>>755
/* サイドバー自動開閉 */
#sidebar-box {
position: absolute !important; /* 固定表示 */
top: 0;
right: 0;
height: 100% !important;
overflow: hidden !important;
width: 3px !important;
min-width: 3px !important;
max-width: 3px !important;
transition: all 0.2s ease-in-out !important;
opacity: 0.2 !important;
box-shadow: 0 0 2px rgba(0,0,0,0.3);
z-index: 1000 !important;
pointer-events: auto !important;
}
/* ホバー時の展開 */
#sidebar-box:hover {
width: 300px !important;
min-width: 300px !important;
max-width: 300px !important;
opacity: 1 !important;
box-shadow: 0 0 5px rgba(0,0,0,0.4);
}

改行多くて書き込めないんで次

2025/04/19(土) 10:23:38.43

/* サイドバー自体の表示制御 */
#sidebar {
transition: opacity 0.1s ease-in-out !important;
opacity: 0 !important;
}
#sidebar-box:hover > #sidebar,
#sidebar:hover {
opacity: 1 !important;
}
/* スクロール対応 */
#sidebar {
overflow-y: auto !important;
}

2025/04/19(土) 23:45:32.03

>>754
ありがとうございます
助かります！

2025/04/20(日) 12:12:50.15

>>753
こちら見ればどうにか出来そうですが、pixivのサイト限定ででそのcssを動作させるにはどうすればいいですか？

2025/04/20(日) 13:36:09.34

チョローンwwwwwwwwwwwwwwww

Google日本語入力サジェスト27候補目
562 ：名無しさん＠お腹いっぱい。[sage]：2025/04/20(日) 12:03:42.48 ID:jWyanckD0
>>561
こちらどうでしょうか？

userChrome.css・userContent.cssスレ Part14
760 ：名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ eab2-EGmf)[sage]：2025/04/20(日) 12:12:50.15 ID:jWyanckD0
>>753
こちら見ればどうにか出来そうですが、pixivのサイト限定ででそのcssを動作させるにはどうすればいいですか？

Google Chrome 127
438 ：名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ eab2-EGmf)[sage]：2025/04/20(日) 12:56:56.14 ID:jWyanckD0
>>411
何がどうトンチンカンな質問をしたのか論理的かつ具体的に説明してみ！？ｗ妄想バカアスペｗｗｗ

2025/04/20(日) 14:45:53.34

Ver136.0では次でタブバーを低くできたけど、137.0から効かない。
/* タブの高さの調節 */
:root {
--tab-min-height : 23px !important;
}
対応策ありませんか？

2025/04/20(日) 15:16:28.64

試してみたけどちゃんと高さは変わるな
windows11
Firefox137.0.2

>>714あたりで同じ話題が出てるけど同じ人かな？

2025/04/20(日) 16:04:16.33

>>763
そうか、ありがとう。

2025/04/21(月) 22:44:27.41

↓で決着ついてる
https://forums.mozillazine.jp/viewtopic.php?f=2&t=23123#p79764

**744** (ﾜｯﾁｮｲ 12d4-Fbt+) · 2025/05/04(日) 11:57:50.29

FirefoxのUIに使われてるWindowsのｸｿUIﾌｫﾝﾄをポアする方法
──────────────────────────────userChrome.cssの方
* {-webkit-text-stroke-width: 0.2px !important;}
* {font-family: "エセナパＪ" !important;}
::selection {
color: #000;
background: #c0c0c0;}
──────────────────────────────userContent.cssの方
@-moz-document url-prefix(about:), url-prefix(moz-extension:), url-prefix(chrome://), domain(mozilla.org)
{
* {-webkit-text-stroke-width: 0.2px !important;}
* {font-family: "エセナパＪ", "Material Icons" !important;}
* {text-shadow: 0px 0px 0.36px #acacac80 !important;}
::selection {
color: #000;
background: #c0c0c0;}
}
──────────────────────────────
エセナパ🇯: https://tanukifont.com/esenapaj/#toc4

　・userContent.cssに入れてるのは、userChrome.cssでは替えきれないFirefoxの関連ページ
　　url-prefix(chrome://)も必要だったかは不明
　・"Material Icons"は、mozilla.orgで使われてるWebフォントだったかも
　・color: #000;は、選択範囲時の白文字がtext-stroke-widthと相性が悪いので黒に変えてる
　・text-shadowとbackgroundは任意、text-stroke-widthは>>744

>>698のIPAexゴシックの太字欠品をNoto Sans JPでの補間法は、
　先月のWindows Updateでインストールされた「NotoSansJP-VF.ttf」の方で指定するなら
　PostScript名が "NotoSansJP-Thin" になってるから、
　太字なのに
font-weight: bold;
src: local("NotoSansJP-Thin");

2025/05/04(日) 17:37:14.13

>>766
フォントが変わったすごい

2025/05/04(日) 21:33:39.90

FirefoxのURLバーと検索バーの色を変えようとしています。

#urlbar-background{
background-color: #E6E6E6 !important;
}
#searchbar{
background-color: #E6E6E6 !important;
}

これでほぼできたのですが、
https://i.imgur.com/k6cXTnb.png
このように検索バーに入力したときに出てくる候補が表示されるエリアの色を変える方法はありますか？

警備員[Lv.6][新芽] (ﾜｯﾁｮｲ 9315-KeI6) · 2025/05/04(日) 22:13:55.55

>>768
はい
.search-panel-tree {
background-color: light-dark(ivory, darkgreen) !important;
}
.search-panel-tree > .autocomplete-richlistitem:hover {
background-color: light-dark(palegoldenrod, green) !important;
}

2025/05/04(日) 22:22:47.39

>>769
ありがとうございます、だいぶ良くできました。ですがまだ上下に白が残ります
https://i.imgur.com/ufLzB5u.png

警備員[Lv.6][新芽] (ﾜｯﾁｮｲ 9315-KeI6) · 2025/05/04(日) 22:34:03.68

>>770
白い部分は検索バーに入力したときに出てくる候補が表示されるエリアじゃないから
また別にしないといけない

警備員[Lv.6][新芽] (ﾜｯﾁｮｲ 9315-KeI6) · 2025/05/04(日) 22:57:56.60

#PopupSearchAutoComplete {
--panel-color: var(--toolbar-field-focus-color);
--panel-background: light-dark(#ccc, darkgreen) !important;
--panel-border-color: var(--arrowpanel-border-color);
}

2025/05/04(日) 23:05:18.69

>>772
理想通りになりました！ありがとうございました

2025/05/05(月) 19:18:25.47

な、ガイジage厨だろ👆

2025/05/06(火) 05:48:05.50

自己紹介か

2025/05/10(土) 01:01:02.54

右クリックで出るコンテキストメニューの角が丸くなってしまったのですが
丸みを無くす事はできませんか？

2025/05/10(土) 01:25:49.79

>>776
menupopup {
--panel-border-radius: 0px !important;
}
menuitem {
border-radius: 0px !important;
}

2025/05/10(土) 23:53:22.63

QuickDrag WEを使ってGoogle検索結果からリンクをドラッグして別タブで開いてるんですが、そのドラッグ操作中にGoogleレンズの窓が開いて邪魔してきます
これを無効化する方法があったら教えてもらえませんか

2025/05/10(土) 23:56:45.28

cssスレで聞くことなんかな

2025/05/11(日) 00:59:17.00

ググったらcssで解決してる記事が出てくるけど

2025/05/11(日) 01:31:17.55

>>780
そうなんです、そのページの頭に

※現在同じような現象が再発しています。

と書かれている通り、現バージョンのFirefoxではもう効かなくなってしまってるので新しく使えるcssが分かる人がいないかなと

2025/05/11(日) 05:08:47.39

Googleレンズは無効になるのかな

@-moz-document domain("google.co.jp"), domain("google.com") {
.NzSfif {
display: none !important;
}
}

! 2025-05-11 google.co.jp google.com
www.google.co.jp##.NzSfif
www.google.com##.NzSfif

2025/05/11(日) 12:31:21.44

>>782
ありがとうございます
自分の環境ではうまくいかないようでした

警備員[Lv.3][新] (ﾜｯﾁｮｲ b315-ZkZz) · 2025/05/11(日) 12:57:55.37

userContent.cssに記述してる？

ころころ (ﾜｯﾁｮｲ b315-ZkZz) · 2025/05/11(日) 12:59:06.09

下のはuBlock Origin用で別だよ

2025/05/11(日) 14:15:57.91

画像検索自体ができなくなっちゃうな

2025/05/11(日) 14:20:54.73

>>784
おおーuserContent.cssを作ってそちらにコピペしたら窓が出なくなりました
おかげさまで快適になりました、ありがとうございます

何度か試してみて今のところ上のだけで問題なく動いてくれているみたいなんですが、uBlock Originにも下の記述を足しておいた方がいいんでしょうか？

2025/05/11(日) 14:24:18.92

firefoxのバージョンとか関係なくてgoogleのクラス名がしょっちゅう変わるだけじゃね

警備員[Lv.5][新] (ﾜｯﾁｮｲ b315-ZkZz) · 2025/05/11(日) 14:30:21.44

>>787
好きな方に追加で

2025/05/11(日) 14:45:40.05

これなら検索結果ページでのみGoogleレンズ無効になる

@-moz-document url-prefix("https://www.google.co.jp/search?";), url-prefix("https://www.google.com/search?";) {
.NzSfif {
display: none !important;
}
}

2025/05/12(月) 23:58:18.17

Firefoxサイドパネルでブックマーク表示中、一番上に表示される「ブックマークを検索」のテキスト入力欄の色を変えたいです
テキストボックスは#search-box、その周囲は#sidebar-search-containerであることがわかり、
display: noneで消すことはできるのですが、background-colorで色を指定しても反映されません

2025/05/13(火) 08:21:41.70

>>791
userChrome.css で appearance: none
background-color 以外も解除されるので自分で適当に設定する

@-moz-document url(chrome://browser/content/places/bookmarksSidebar.xhtml),
url(chrome://browser/content/places/historySidebar.xhtml)
{
#search-box {
appearance: none !important;
background-color: green !important;
color: yellow !important;
border: solid thin var(--input-border-color) !important;
border-radius: 2px !important;
padding: 2px 3px !important;
}
}

2025/05/13(火) 10:29:54.80

>>792
横からありがとうございます
自分もどうして変わらないのか悩んでいて
appearanceは盲点というか考えが及ばなかった

2025/05/17(土) 21:54:19.41

タブの高さを狭く変更したのですが、タブ内の文字位置がタブの上端からではなく少し下にズレて表示されます
上端から表示させるにはどう書けばいいでしょうか

.tabbrowser-tab {
height: 24px !important;
}

2025/05/18(日) 10:12:04.79

#TabsToolbar {
--tab-min-height: 24px !important;
}
#TabsToolbar #tabbrowser-tabs {
min-height: auto !important;
}

2025/05/18(日) 10:26:23.20

>>795
横からだけど、ありがとう。

2025/05/18(日) 13:51:34.31

>>795
水平タブには効きましたが垂直タブには効かないみたいです

2025/05/18(日) 14:16:08.25

あーそうか、今は垂直タブも考慮しないといけないのか
.tab-background {
min-height: 24px !important;
}
も追加で

タブ間隔の広さが気になる場合は
#tabbrowser-tabs[orient="vertical"] .tabbrowser-tab {
padding-block: 0px !important;
}
も追加

2025/05/18(日) 17:03:33.30

>>798
ありがとうございます！

2025/05/21(水) 16:14:52.58

タブグループ名の高さをタブと同じにするにはどうすれば良いですか？
https://imgvb.com/images/2025/05/21/5aee9cb8bb3b066e79e1efaa17e580c6.png

2025/05/21(水) 18:34:20.70

>>800
とりあえず作ってみたがこれで正しいのかわからない

/* グループタブの形状 */
#tabbrowser-tabs[orient="horizontal"] .tab-group-label {
font-size: 12px !important;
padding-top: 8px !important;
padding-inline: 10px !important;
min-height: 36px !important;
border-radius: 12px !important;
outline: none !important;
}

2025/05/21(水) 18:34:34.97

/* グループタブの形状縦タブ */
.tab-group-label {
#tabbrowser-tabs[orient="vertical"]:not([expanded]) & {
width: 24px !important;
max-width: 24px !important;
margin: auto !important;
font-size: 0 !important;
padding-top: 2px !important;
min-height: 16px !important;
border-radius: 8px !important;
outline: none !important;
}
}
.tab-group-label {
#tabbrowser-tabs[orient="vertical"][expanded] & {
font-size: 12px !important;
padding-top: 2px !important;
padding-inline: 10px !important;
min-height: 16px !important;
border-radius: 12px !important;
outline: none !important;
}
}

**766** (ﾜｯﾁｮｲ cad4-mHPU) · 2025/05/21(水) 18:54:19.98

「Ctrl + F」の検索で掛かる
　・該当ワードの[グリーンに白の🔤]
　・☑すべて強調表示でハイライトする[マゼンタに白の🔤]
を
userChrome.cssかuserContent.cssで指定する方法知らない？

about:configの方で
　ui.textSelectAttentionBackground
　ui.textSelectAttentionForeground
　ui.textHighlightBackground
　ui.textHighlightForeground
から指定が出来るのだけど、
.cssに書き込んだ方が管理がし易そう

🕡https://www.insidespeech.com/post-241/
　findbar.modalHighlight
なんて裏技も在ったらしい（けど実装が中途半端に終わってる）

2025/05/21(水) 20:00:34.19

>>801
>>802
ありがとうございます

警備員[Lv.4][新芽] (ﾜｯﾁｮｲ 4f15-FIIW) · 2025/05/21(水) 20:16:00.86

>>803
cssでは無理らしい

2025/05/22(木) 16:51:28.91

https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/compact_urlbar_megabar.css
https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/urlbar_popup_full_width.css
URLバーがちょっと大きくなるのとかURLバー下の検索窓がURLバー幅でしか開かないの弄るために久々に調べたメモ
以前もやったのに変更入って無効になってた

2025/05/22(木) 18:02:14.84

>>806
MrOtherGuyの人cssマスターだよね
自分手直ししてこれ使ってたわ
https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/overlay_fullscreen_toolbars.css
https://github.com/MrOtherGuy/firefox-csshacks/blob/master/chrome/textual_searchbar_one-offs.css

**803** (ﾜｯﾁｮｲ cad4-mHPU) · 2025/05/23(金) 06:58:03.66

>>805
調べても掛からないから意外と無いのかも。

Skiaのフォントレンダリングを補整できるwebkit-text-stroke-widthは
文字が選択範囲で白字化する際に
白色化前のcolorでstrokeしてしまいアウトラインが黒縁になるので、
about:config法(>>803)で文字色にあたるForegroundの方を　#000000　(⬛)に書き変え。

　⚙about:configは
　　何の為にどの記述を変えたのかをノートしとかないと🩶https://bokete.jp/boke/27401566

それから、>>701と>>766の
* {text-shadow: 0px 0px 0.36px #acacac80 !important;}
::selection {
color: #000;
background: #c0c0c0;}
を、

* {text-shadow: 0px 0px 0.36px rgba(128, 128, 128, 0.333) !important;}
::selection {background: rgba(128, 128, 128, 0.5);}

にchange the 𝖂ord
　・16進数の#カラーコードではなくてrgba(,,,)値で指定した方が、色とα(透過)率を把握し易い
　・シャドウ(blur-radius)はK(⬛)で透過の方が良いかと思ったけど、白以外の背景色との兼ね合いでは･･･灰色で･･････
　・::selectionはcolor値を指定しないと白字化しなかったので、ではbackgroundを灰色で半透明で。

>>806-807, MrOtherGuy
適用前と適用後の画像を添えておくと、とっても参考になるよ

2025/05/23(金) 19:28:33.49

overlay_fullscreen_toolbars.css は
全画面表示のときマウスポインタを上に持っていくとタブとツールバーが出てくるが
ページを押し下げカクカク出てくるのがページの上にかぶさるように出てくるようになる

動画フルスクリーンのときバグがあるので
:root[sizemode="fullscreen"] を以下のように変更するとよい

:root[sizemode="fullscreen"]:not([inDOMFullscreen="true"]) {

textual_searchbar_one-offs.css は検索バーのアイコンにテキスト表示するもの
画像左のようになる右のは好みに成型した自分用のもの
https://i.imgur.com/LUGIofd.png

**808** (ﾜｯﾁｮｲ cad4-mHPU) · 2025/05/23(金) 20:40:35.27

>>809
なるほど

＞overlay_fullscreen_toolbars.css
の方はFirefoxがデフォルトに採用するべき挙動

＞textual_searchbar_one-offs.css
　・検索エンジン数が多かったり
　・同じサイト内のパラメーター違いの検索はアイコンが同じになったり
してアイコンだけだと判別し難くなる訳ね

吾輩は、選択範囲から検索する時用に
Gesturefyの⚙[その他＞ロッカージェスチャー＞左クリックした状態で右クリック]
に「[Popup] 検索エンジン」を入れてる

　　検索エンジンを追加する時は
　　Add custom search engine: 🧩https://addons.mozilla.org/ja/firefox/addon/add-custom-search-engine/
　　を使ってる
　　　使ってる🔍は:　Google，英辞郎， YouTube， Wiktionary， OK辞典， Twitter(𝕏)

>>728で書いたが、
NightlyのFirefox入れてみたら判るけど
そこ、今後めっちゃ使い難くなるよ

2025/05/23(金) 21:44:25.97

browser.urlbar.scotchBonnet.enableOverrideをfalseにしとけ

2025/05/24(土) 19:59:43.73

>>806
#urlbar { will-change: auto !important; }

1949742 - Use will-change: transform in the urlbar to make sure to consistently contain fixed position descendants.
https://bugzilla.mozilla.org/show_bug.cgi?id=1949742

2025/05/24(土) 20:51:50.12

な、ガイジage厨だろ👆

2025/05/24(土) 21:41:14.21

また指差し基地外湧いてる

2025/05/24(土) 22:14:27.66

>>812
何しても左寄せに出来なくて諦めてたし聞くか迷ってたんだそれ
ありがとうございます

2025/05/25(日) 00:34:10.25

な、ガイジage厨だろ👆

2025/05/25(日) 06:02:03.05

>>812の
#urlbar { will-change: auto !important; }
と>>806の
full_width_urlbar_popup,compact_urlbar_megabar
に
/* 検索結果のURL表記を一行にまとめる */
#urlbar > .urlbarView .urlbarView-url{
padding-left: 8px !important;}
#urlbar > .urlbarView .urlbarView-row-inner {
flex-wrap: nowrap !important;}
#urlbar > .urlbarView .urlbarView-no-wrap {
flex-basis: unset !important;
max-width: 80% !important;}
/* タイプアイコンを別枠で表示 */
#urlbar > .urlbarView .urlbarView-body-inner{
margin-inline-start: 34px !important;}
#urlbar > .urlbarView .urlbarView-type-icon{
width: 17px !important;
height: 17px !important;
margin: 0 0 0 -28px !important;}
を追加してこんな感じに落ち着きました
https://i.imgur.com/rXDohi9.png
ありがとうございました

**806,817** (ｵｯﾍﾟｹT Srcf-3DDr) · 2025/05/25(日) 06:09:22.48

忘れてたけど普段URLバー短い運用してるのでクリックしたときに伸ばして広げるために
#urlbar[breakout][breakout-extend] {
width: 80vw !important;}
も自分用で入れてる

**810** (ﾜｯﾁｮｲ 9fd4-t9SY) · 2025/05/25(日) 07:24:17.36

>>811
は、>>728で謂う今後の
　・現在 ⇦ 未来
　（Firefox 83.0～現行の138.0.4の🔍 ⇦ Nightly v140で展開されてる🔍）
を戻せるabout:config

　・過去 ⇦ 現在
　（Firefox 82.0.3までの🔍 ⇦ Firefox 83.0～現行の138.0.4の🔍 ）
に戻す事はYou can (not) redo?

⚙
about:preferences#privacyの「アドレスバー」は ☑回覧履歴のみ、
browser.urlbar.maxRichResultsは「5」行にしてる

　　ﾃﾞﾌｫﾙﾄの「10」行だとﾜｰﾄﾞ入力からｱｲｺﾝｸﾘｯｸまでｶｰｿﾙ移動が長すぎて5⃣https://archive.md/BMgy9/61c57d6407d9c8af7a00e6638e31a0cbf745ee14.jpg

　　⌨https://support.mozilla.org/ja/kb/keyboard-shortcuts-perform-firefox-tasks-quickly#w_jian-suo
　　　[Alt + ⇅]から選択する事も可能だけど、
　　　Alt, Ctrl, Shiftやマウス(🖲)の同時押し系は、意識しないと押せない分反射的遅延が生じる

　　>>817の［Ⓖ⌵］が、Nightlyで展開されてる今後の🔍
　　「⌵」のｸﾘｯｸでドロップダウンするからカーソルの移動量は減るけど、(ﾎﾊﾞｰにしたら?→)ｸﾘｯｸ数が1回増えて移動が2軸になる

　　v82.0.3までの🔍は、単純な直線運動からの1クリックだけで飛べて視覚的にもこれが良い

[class*="searchbar-engine-one-off-add-engine"] {display: none !important;}
　↑これは特定のサイト上(mozilla.orgなど)で、アドレスバー入力時に
　　最終検索アイコンの右に出現する「⊕検索エンジン“████”を追加します」アイコン
　　をdisplay: noneするCSSらしいのだけど、
　表示上は消えててカーソルのクリック判定も無いが、
　キーボードショートカット上ではvisibility: hidden状態になっていて
　[Alt + ⇅]から惚れさせ２９５すると追加できてしまう