userChrome.css・userContent.cssスレ Part12
■ このスレッドは過去ログ倉庫に格納されています
!extend:checked:vvvvv:1000:512
次スレを立てる方は↑を二行重ねて書いてください
●※前スレ
userChrome.css・userContent.cssスレ Part11
https://egg.5ch.net/test/read.cgi/software/1584753386/
●拡張機能
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 >>60 を参考にしてて、トラッキング防止の盾アイコンを紫色に戻すやつが上手く動かないのですが
どうすればいいでしょうか？
#urlbar-input-container[pageproxystate="valid"] #tracking-protection-icon-box:not([hasException])[active] > #tracking-protection-icon {
fill-opacity: 1 !important;
fill: #7542E5 !important;
}
今のシンプルなアイコンを紫色にしたいです。こんな感じに
https://prismic-io.s3.amazonaws.com/helpcenter/9c3bedbb-5893-4611-bd3b-627b933ee2f9_firefox_tracking_off.jpg >>70
赤色を紫にするだけなら>>60の
fill: red !important; を fill: #7542E5 !important; に >>71
すみません
そもそも>>60自体が効かないんです >>73
他のは効いています
すいませんどうやらクロスサイトトラッキングが検出されたときにのみ色が変わる様でした
なので動いてること確認できましたありがとうございました googleの検索結果に番号を付けるCSSなんですが、いつの間にか動かなくなっていました
あると便利なので修正箇所分かる方いたら教えてください
よろしくお願いします
@-moz-document url-prefix("http://www.google.co.jp/search";),
url-prefix("http://www.google.com/search";),
url-prefix("https://www.google.co.jp/search";),
url-prefix("https://www.google.com/search";){
/* カウンタを生成 */
div#res{
counter-reset: head !important;
}
/*.g > .r:before{ */
div.rc h3::before {
counter-increment: head !important;
content: "#" counter(head) !important;
font-size: 18px !important;
font-weight: bold !important;
margin-right: 5px !important;
padding: 0px 4px !important;
background: white url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAeCAMAAAAiq38CAAAAA3NCSVQICAjb4U/gAAAAYFBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADu7u7v7+/w8PDx8fHy8vLz8/P09PT19fX29vb39/f4+Pj5+fn6+vr7+/v8/Pz9/f3+/v7///9uR0UGAAAAQUlEQVQYlXXGtwGAMAAEsZ8ATHIk7L+lK5+/QZX0QdYX3ge64W1Qq4PqbIE3QwneCF346QnvAe3wbpgNCtAK74IOWSsakaslG2kAAAAASUVORK5CYII=") left top !important;
color: #bbb !important;
border: 1px solid #bfbfbf !important;
-moz-border-radius: 3px !important;
}
} >>77
div.rc ってどこのこと？
rc なんてクラスついた要素ないと思うんだけど >>79
今まで使っていたcssをコピペしたので、詳しい事はわかりません、ごめんなさい
>>80
紹介ありがとうございます
ただ、サイトの途中に書いてある
/* Google */
div.r h3::before {
counter-increment: result;
content: counter(result) ". ";
}
に変更してみたのですが、こちらでは動かなかったのですが、自分のミスですかね？ >>82
そっちは見るなよ
その上にこうあるだろ
#search h3::before { }
ていうかドメイン限定してるから #search もいらない
ちゃんと自分で検索ページを F12 押して調べなさい そのブログ記事 2021年4月8日更新 だぞ
当時は知らんが div.rc も div.r もないから >>83,85
お二人ともレスどうもありがとう
やっぱり効かないんですね
番号のつけ方的にそっちのほうが好みなんですが、無理なんですかね？ >>86
効くとか効かないとかじゃなくて
少しは自分でウェブ開発ツールのインスペクタで確認しろよ
そうすりゃ汎用性はないけどなんとかする道はある
だけどそういうのは検索ページの仕様変更ですぐ使えなくなる
それを自分で調べる覚悟がなければ無理 >>86
「検索結果のナンバリング」で検索されたし >>89
それで出てくる上位は古かったり間違ってたり・・・
自分でやりたいようにやらないと意味ない >>90 の画像は2つに分かれていて
上の方は、検索結果の内容は div#search の中に入っていることを示したもの
下の方は、階層になっている例として
「Firefox 高速プライベートブラウザー - Google Play のアプリ」
「Android 版 Firefox Beta - Google Play のアプリ」
の箇所を示した
ここから法則を導き出して頑張ってくれ オッ、なんかこの時間帯親切なネ申がいるみたいなんで俺も質問
右クリメニュー等の背景に透過png画像(狐ロゴ)を表示させてたんだけど(.menupopup-arrowscrollbox)
内部仕様が変わってメニュー全体が透過されるようになっちゃった
なのでもう一階層下に(.scrollbox-clip)指定し直してみた
すると表示自体は一応元通りにはなったんだが、なぜかタブバーにも画像が現れてしまう
どうしたらいいのか分からん教えろ下さい<m(__)m> >>90
遅ればせながら、わざわざ画像まで作って説明してくれてありがとう
自分で解決出来れば一番良いので、この機会に勉強してみます アドレスバーでhttpのサイトのURLを赤く表示するCSSを見つけました。
#identity-box[pageproxystate="valid"].notSecure ~ .urlbar-input-box{ color: red }
で、逆にhttpsのサイトのURLを緑で表示することもできるんじゃないかと思うのですが、
どう書けばいいでしょうか？
素人考えで色をgreenにして、notSecureの部分をSecureにすればいいのではないかと思ったのですが、
ダメでした。 自己解決しました。
ふと思い当たって、notSecureを外せばいいのではないかと試したらうまく行きました。
#identity-box[pageproxystate="valid"] ~ .urlbar-input-box{ color: green } おい、もはやお前らだけが頼りなんだが？
マジで頼むが？ >>97
素人考え
:not(#TabsToolbar) >98㌧
駄目だった…w
他にも
tabbrowser-tabs
toolbar-items
TabsToolbar-customization-target
とか試したけど消えず
つかそもそも上位のIDが指定出来りゃ苦労は無いのに
shadow-rootとかいうわけわからんIDだから困る
引き続き気長にネ申を待つ shadow-rootってことはshadowDOM
その下の要素を指定してスタイルを適用するには::partを使う必要がある
だけどuserChrome.cssは::partを使えないから、userChrome.jsのスレで質問し直しの方がいい .menupopup-arrowscrollbox { background-image: url("hoge.png") !important; }
で特に問題ないように見えるが
もしかして background: url("hage.png") !important; してた？ >101
か、解決した…www
つーかそこなの？？？？？？？？
89.0あたりで仕様が変わってからずーっと
あーでもないこーでもないやってたんだが
盲点にも程があるw
101氏をはじめレス下さった皆様本当にありがとうございました<m(__)m> >>62
ありがとう
-moz-accent-color-foreground → AccentColorText
メニューバーの文字色が黒になってしまったものを白に戻せました タブが一つの時はタブバーを非表示にするやつなんですが、
ver.103に上げると画像の通りnewtab-buttonが残るようになってしまいました。
修正方法を教えてください。
https://i.imgur.com/6X0cggh.png
/* Hide New Tab Button immediately next to solo tab */
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] {
visibility: collapse;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] + toolbarbutton {
visibility: collapse;
} cssが切れてたので以下で全文です。
これがver.103でnewtab-buttonが残ってしまいます。
教えてくださいませ。お願いします。
/* Hide New Tab Button immediately next to solo tab */
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] {
visibility: collapse;
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] + toolbarbutton {
visibility: collapse;
}
#tabbrowser-tabs .tabs-newtab-button {
visibility: collapse;
}
#tabbrowser-tabs, #tabbrowser-tabs > .tabbrowser-arrowscrollbox, #tabbrowser-arrowscrollbox {
min-height: 0 !important;
} >>105
toolbarbutton を * に変える >>106
おお！ありがとうございます！期待通りになりました。
いろいろ調べていて、以下にするとシンプルに書けました。
tab:only-of-type, tab:only-of-type + * {
display: none !important;
}
#tabbrowser-tabs, #tabbrowser-arrowscrollbox {
min-height: 0 !important;
} 目的 全サイト見にくいゴシック体・サンセリフ体を表示しない 丸ゴシック体で表示する プロポーショナルメトリクス字詰め
Firefoxフォント設定
「ウェブページが優先したフォントを優先する」チェックはずす
googleサイト→Stylus指定のフォントになる
英語圏サイト（tx16wxなど）→セリフ体
「ウェブページが優先したフォントを優先する」チェックいれる
googleサイト→ゴシック体
英語圏サイト（tx16wxなど）→Stylus指定のフォントになる
ド素人です
和文も欧文もその他言語文字も指定したいんですが、丸ゴシック体になりません
教えてくださると嬉しいです
body {
font-family : "ヒラギノ丸ゴ ProN", "UD新丸ゴ", "UDじゅん", "Helvetica Rounded" !Important ;
font-size : 1em ;
font-weight : 500 ;
-webkit-text-stroke : 0.1px ;
-webkit-text-stroke-width: 0.1px
!important;
-font-feature-settings: 'palt' 1;
}
div,dd,dt,dl,p,em,li,textarea,form,input {
font-size : 1em ;
font-weight : 500 ;
-webkit-text-stroke : 0.1px ;
} >>108
こんな感じでチマチマやる
@font-face {
font-family: "見にくいゴシック体";
src: local("ヒラギノ丸ゴ ProN");
} /* ウインドウアクティブ時のタイトルバーの背景色をOSのテーマ色に変更（以前の規定テーマと同じ） */
:is(#TabsToolbar, #toolbar-menubar):not(:-moz-window-inactive) {
color: -moz-accent-color-foreground;
background-color: -moz-accent-color;
}
最新版（103.0）にしたらこれが効かなくなったんだけどどうしたらいいだろう すいません、Firefoxでブックマークツールバーを常時表示にして、ブックマークをアイコンだけにして大量の
ブックマークアイコンを並べてるのですが、これの余白を更に詰めてより大量のアイコンを並べる事って可能ですかね？
ググってもブックマークメニューの行間（縦）を詰める情報だけ出てきて横に詰める方法が分かりません
この辺はとくに変わりませんでした
↓
#toolbar-menubar toolbarbutton {
padding-left: 1px !important;
padding-right: 1px !important;
} >>113
#PlacesToolbarItems > .bookmark-item {
padding-left: 1px !important;
padding-right: 1px !important;
} >>113
あ！！！出来ました！！！！
長年悩んでいたのですが貴方は神です！ すいません神は>>114です
>>113はただのマヌケなので jsのスレで書いた後こっちの方が適切かと思ったらそういうレスも頂いたのでこちらに移動して来ました
Youtubeで動画と上の検索窓の間の部分消したくてF12で内容見てみたのですが、そこは上の検索窓と一緒になってて（該当部分の文にカーソル合わせると一緒に緑色になる）間の部分だけの指定が見付かりませんでした
検索のある列はytd-searchbox…の指定で細くは出来たのですが、その下部分が不要なのでどうにか消したいです
ヒントでも良いのでアドバイスお願いします >>117
動画上側の1cm程度のスペースを無くしたいという解釈でおk?
だとすると
div id="columns"
div id="primary" #主エリア
div id="secondary" #チャット/動画リスト
の冒頭だから多分この辺の上側の境界/詰め/余白を調べれば良いよな
ytd-watch-flexy:not([theater]):not([fullscreen]) #primary.ytd-watch-flexy,
ytd-watch-flexy:not([theater]):not([fullscreen]) #secondary.ytd-watch-flexy {
padding-top: var(--ytd-margin-6x);
} >>118
遅くなりましたがレスありがとうございます
はい、その部分です
それでいじってみます
どうもありがとうございました 拡張機能スレに書いたけどこっちの方がいいんかな
Stylusを1.5.26にしたら、userstyles.orgからインストールも更新も一切できなくなった
1.5.25に戻すと普通にできる アドレスバーにペーストしたときのみ背景の色が上に数ピクセルずれるんですが分かる方いますか？
カーソル置いただけでは問題ないのですが。
済みませんがどなたかお助けください。
http://iup.2ch-library.com/i/i022196422415874211242.png 106.0b1 で #firefox-view-button の隣にあるセパレータみたいな棒を消す方法はありませんか >>123
#firefox-view-button + #tabbrowser-tabs {
border-inline-start: none !important;
} タブの高さは
#TabsToolbar { --tab-min-height: 24px; }で調整できますが、
タブバーの高さ調整どう記述すれば良いのでしょうか？ >>126
少しは頭使えよ
min-てーのは最小値を設定/変更するのに書くもんだ
それよりも小さく指定されていたものならそれに従って大きくなる
逆の時は何の効果も無い
逆の時も含めて実際に指定したいならそれのないもん指定する必要がある
ということはわかるよな? >>126
せめて伝聞形式にすればいいのに
ここまで堂々とバカを晒すってやっぱバカのさせる業 >>127
よく分からん？
タブの高さじゃなくタブバーの高さを変えたいと聞いてる。 esr102にアップデートしたらuserChrome.cssに書いた内容の一部が動いてくれなくなりました
これは記述が古くなったので新しく書き直さなきゃいけないってことなんでしょうか？
ちなみに動いてくれない部分はこちらです
/* タブの色 */
/* 未読み込みタブ ・白*/
.tabbrowser-tab[pending] {
font-weight: normal !important;
background: white !important;
/* タブを閉じるボタンをマウスオーバー時のみ表示 */
/.tabbrowser-tab:not([pinned]):hover .tab-close-button.close-icon {display: inline-block !important;}
/#tabbrowser-tabs .tabbrowser-tab .tab-close-button {
/ display: none!important;
/} >>130
/* タブを閉じるボタンをマウスオーバー時のみ表示 */
#tabbrowser-tabs .tabbrowser-tab:not([pinned]):hover .tab-close-button.close-icon {
display: inline-block !important;
}
#tabbrowser-tabs .tabbrowser-tab .tab-close-button.close-icon {
display: none !important;
}
でどうだろう
「未読み込みタブ ・白」は普通に動いたけど、「}」が抜けてるだけだったりしない? >>131
どうもありがとう
/* タブを閉じるボタンをマウスオーバー時のみ表示 */ の方はコピペする部分間違えていました…
正式にはこちらです
/#tabbrowser-tab:not([pinned]):hover .tab-close-button {
/ display: block !important;
/}
ただ、教えて貰った>>131の内容に書き換えてもやはり動いてくれませんでした
問題はuserChrome.cssの記述以外の所なのかな >>133に貼ったコードの一番手前の”/”は無視してください
>>131で教えて貰った内容に書き換えるためにコメントアウトしたものをそのままコピペしてしまいました そもそもタブを閉じる記述全体の行頭の「/」は何目的なの？
1行だったら「/」を先頭につければいいよってのはjavascriptのコメントアウトで
CSSは1行でも複数行でも「/*〜*/」なんなんだけども
そこを勘違いしていたとしてもそれはそれで全部消してるわけで >>135
> 1行だったら「/」を先頭につければいいよってのはjavascriptのコメントアウトで
いいえ
1行コメントは「//」ですよ？ >>135
すみません、自分自身ド素人で基本広いものを適当にいじって使ってきたレベルで…
過去に自分でコメントアウトのつもりでつけたのか、それとも拾ってきたものに最初から書かれていたのかはよくわかりません
あと、動いていない部分「未読み込みタブ ・白」ではなく「未読み込みタブ ・白」でした
未読み込みタブ ・白
.tabbrowser-tab[unreadTab] {
font-weight: normal !important;
background: white !important;
}
unreadは以前もバージョンアップの時に動かなくなったような記憶があります
あと「タブを閉じるボタンをマウスオーバー時のみ表示 」もいじった形跡があるということは同時期に動かなくなっていたかもしれません 右クリックメニューの背景色とマウスホーバー色を以下のように変更していたのですが、
いつの間にか反映されなくなりました。
menupopup{
--menu-background-color: #F4F4F4 !important;
--menuitem-hover-background-color: #C1C3C2 !important;
}
色々と試してみたのですが効果が見られませんでした。
お分かりの方、お教えいただけましたらありがたいです。よろしくお願いいたします。 >>139
menupopup {
--panel-background: #F4F4F4 !important;
}
menu[_moz-menuactive="true"], menuitem[_moz-menuactive="true"] {
background-color: #C1C3C2 !important;
} >>140
早速にありがとうございます。
無事、反映されました。心より感謝申し上げます。 下記でタブの高さは変わるのですが、タブの上に空間ができます。
この空間を無くすにはどうすれば良いのでしょうか？
#TabsToolbar { --tab-min-height: 20px; } >>131
すみません、ちゃんと動いていました
ただ、これまではタブ開きまくってどれだけ小さくなってもマウスオーバーすればタブ幅が広がって閉じるボタンが表示されてたのですが
ESR102になってからはタブ幅が広がってくれなくなったため、マウスオーバーしても変化がわからなかっただけでした
タブの数を減らしてタブ幅に余裕持たせた上で確認したら、これまで通り機能してくれました
未読み込みタブに関しては、unreadTabs.uc.jsが動いてくれなくなってる事が原因ぽいです
新規プロファイルでも症状は変わらないので、これはもう諦めるしかないのかな
どうもお邪魔しました すいません、タブツリーを使っているのですが、ピン止めされたアイコンのクローズボタンを消すのってどうするんですかね？
タブツリーのCSSは全く同じものを使っているのに、どこが影響しているのか環境によってアイコンの上にクローズボタンが乗っていることがありピン止めが殆ど機能しません
（ピン止めアイコンをクリックしようとすると閉じる）
バージョンはどちらも105.0.1です URLバー、検索バーの背景色を指定しています。
#urlbar:-moz-lwtheme > #urlbar-background, #searchbar:-moz-lwtheme {background-color: seashell !important;}
これでURLバーの検索候補の背景色もseashellになります。
検索バーから↓キーで検索履歴を表示したときの背景色はwhiteでseashellになりません。
検索履歴の背景色もseashellにすることできませんか？ popup.menuのscrollboxの選択色の指定のやりかたを教えてください。 デフォルト状態のステータスパネル
https://i.imgur.com/5EtMYoF.png
ロケーションバー内に移動させたステータスパネル
https://i.imgur.com/32vZ0H8.png
/* ステータスパネルをロケーションバー内へ移動 */
#statuspanel {
position: fixed;
top: 62px;
right: 354px;
max-width: 70.7% !important;
text-align: right;
}
昔あった拡張のStatus-4-Evarの機能を再現したくて、恐らくここで↑このスクリプトを教えてもらったのですが
本日Firefoxを106にアプデしたところ、ある一定のところまでしか移動してくれず、Firefox自体のフレーム内には表示されなくなりました。
新しい方法分かる方おられましたら教えていただけないでしょうか #statuspanel {
position: fixed !important;
top: 50px !important;
right: 354px !important;
max-width: 70.7% !important;
text-align: right !important;
} >>151
ありがとうございます。
上部ロケ―ションバーまで移動できました
しかし何故か二か所でチラチラするようになりました
一応leftにして調整してみました @font-face { src: local(<フォント名>) }でのフォント置き換えって動作してる？ 自己解決しました
security.fileuri.strict_origin_policyをオフにしないとローカルファイル読み込めなくなったのか 107.0Beta3にアップデートしたらサイドバー自動開閉のcssが効かなくなったわ #sidebar-boxの設定から
margin-rightとleftの項目を削除したら復活した。 検索バーの履歴を表示したとき、その背景とfont-weightを設定したいです。
最近、老化で視力低下したみたい。 >>157
.search-panel-tree > .autocomplete-richlistitem {
font-weight: bold !important;
}
#PopupSearchAutoComplete .autocomplete-richlistitem:nth-child(2n+1):not([selected]):not(:hover) {
background-color: var(--toolbar-bgcolor) !important; /* 明るいテーマ */
/*background-color: #31255c !important; /* Alpenglow */
/*background-color: #383838 !important; /* ダークモード */
} >>158
早々のレス、ありがとう。
見やすくなりました。 自己解決
cssの問題じゃなかった
about:confIg → browser.urlbar.maxRichResults → -1
これで出なくなりました 2ちゃんの生き残りの老害
「上げるな！ sage進行がマナーだろ！」 >>165
ちゃんとアンカー付けろ！
それがマナーだろうが！
老害ｗ >>167
誰にも迷惑はかけてないｗ
迷惑しかかけてない老害のお前とは違うｗ ■ このスレッドは過去ログ倉庫に格納されています
