userChrome.css・userContent.cssスレ Part12

■ このスレッドは過去ログ倉庫に格納されています
2022/04/21(木) 23:24:46.59ID:h1cG3tIy0
!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
2022/05/05(木) 05:33:18.84ID:geFQXWVq00505
>>9
ありがとうございます
希望通りの色に戻すことができました
2022/05/05(木) 15:29:31.38ID:k8U3DNpY00505
>>4の /*タブをメニューバーの下*/
タブバーにアイコンを置くとタブの高さがそのアイコンのサイズに引っ張られて大変なことになる、凄まじいね
2022/05/05(木) 16:12:02.76ID:c2N3mFeD00505
>>10
よくこういう時に「戻った」「直った」という人いるけど
実際には修正ではなくて、カスタマイズなんだという意識はちゃんと持っておくべき
そうでないとトラブった際に話が合わなくなるから
2022/05/06(金) 06:58:41.47ID:70+EZ7PB0
クソどうでもいいです
2022/05/06(金) 07:54:29.38ID:Ke/QcU5c0
そうどうでもいい
2022/05/11(水) 10:34:40.50ID:Kdx8AQ5v0
https://www.youtube.com/feed/history

上記のサイトで
・履歴タイプ
・再生履歴
・コミュニティ
などのエリア(サイドバー)が広すぎて、動画フィードが狭くなってしまいます
サイドバーを狭くし、動画フィードエリアを広くするには何と記述すればいいでしょうか
2022/05/14(土) 12:31:03.63ID:Qgv8N13i0
検索履歴を表示した時すぐに検索しないようにする
CSSあれば教えてほしいです
2022/05/14(土) 17:54:06.21ID:23HAdhMn0
>>16
そういうのはcssでは無理
検索バーのならjsであったと思う
2022/05/14(土) 19:48:19.20ID:Qgv8N13i0
>>17 ありがとうございます
2022/05/14(土) 20:32:24.10ID:23HAdhMn0
>>18
これ
https://github.com/alice0775/userChrome.js/blob/master/search_history_toka_suggest_nogokuwoerabutosokukennsakuniikunowotomeru.uc.js
2022/05/14(土) 22:40:50.39ID:3VCchGhC0
YouTubeのプレイヤーでサムネイルを表示する時、高解像度のmaxresdefault.jpgではなく、
高解像度のサムネイルがあるのに低解像度のhqdefault.jpgなどで表示される動画があります。
これをなんとかmaxresdefault.jpgで表示する方法はありませんか?

一応自分でも

.ytp-cued-thumbnail-overlay-image {
background-image: url("https://i.ytimg.com/vi/<;VIDEO ID>/maxresdefault.jpg") !important;
}

みたいなCSSを作ってみましたが、うまく行きません。
<VIDEO ID>の部分をその動画のIDで可変して読み込めればいいと思うのですが。
2022/05/15(日) 20:13:28.21ID:9h7tjqvw0
仕様変更されたYouTubeのUIを元に戻したいです
2022/05/15(日) 21:17:26.96ID:XUiW+4D70
>>21
YouTubeのUIを元に戻す方法はわかります。
>>20の解決方法はありませんか?
CSS以外のスクリプトやアドオンを使う方法でも構いません。
2022/05/15(日) 21:36:46.22ID:XUiW+4D70
このスクリプトでYouTubeのUIが以前のように戻りました。

YouTube - Proper Description
https://greasyfork.org/ja/scripts/440613-youtube-proper-description
2022/05/15(日) 21:44:08.68ID:9h7tjqvw0
>>23
ありがとうございます

>>20の解決方法は分からないです
申し訳ないです。。
2022/05/15(日) 21:51:05.96ID:XUiW+4D70
>>24
いえいえ、お役に立てたようでよかったです。

>>20の解決方法が他の人からもレスがないということは、たぶん無理なのかなと思います。
自分でもいろいろググってみましたから。
それならそれで仕方ないですわ。
2022/05/16(月) 21:40:33.11ID:bPQrmYrd0
スクリプトじゃなく、CSSでも同じようなものがあるんじゃないかと探したら、ありました。

Disable new YT description
https://userstyles.world/style/4067/disable-new-yt-description

こちらの方が軽くていいかもしれません。
ただ、タイトルのフォントが太字だったので、

.ytd-video-primary-info-renderer.style-scope.title {
font-size: 18px !important;
font-weight: normal !important;
}

というCSSを追加したら以前と同じになりました。
2022/05/16(月) 22:06:39.44ID:9+as2peJ0
以下のようにしても、タブが増えるとオーバーフローのスクロールアロー(こういうの<>)がタブバーの両端に表示されるのですが
消す方法はないでしょうか
alltabs-buttonはこれで消えます

.tabbrowser-tab[fadein]:not([pinned]) {
min-width:0px !important;
max-width:150px !important;
}
#tabbrowser-tabs .scrollbutton-up,
#tabbrowser-tabs .scrollbutton-downk,
#alltabs-button {
display: none !important;
}
2022/05/16(月) 22:13:21.42ID:a9zM/C3g0
>>26
こんなサイトあったの知らんかった
2022/05/16(月) 22:29:26.19ID:a9zM/C3g0
>>27
<> 消えたけど
2022/05/16(月) 22:30:26.94ID:a9zM/C3g0
>>27
いや消えてなかったわ
2022/05/16(月) 22:37:33.72ID:a9zM/C3g0
>>27
消えた
toolbarbutton#scrollbutton-up, toolbarbutton#scrollbutton-down {display:none !important;}
2022/05/16(月) 23:04:00.70ID:9+as2peJ0
>>31
ありがとうございます
出たり消えたりでタブが微妙に動いて気持ち悪かったので
2022/05/16(月) 23:44:41.40ID:wsEPK4980
>>31
ブックマークたくさんあると, ブックマークフォルダを開いてマウスオーバーするだけで一気にスクロールしまくるし, スクロールボタンも消えるやん
2022/05/25(水) 20:39:24.99ID:YbifOlfR0
Firefoxのブックマークツールバーのフォルダボタンを押すと出てくる
メニューの幅が小さくて変えたいです

.bookmark-item[type="menu"] {
width: 500px !important;
}

この辺だと思うのですが、ブックマークアイテムが広がるだけでした
2022/05/25(水) 21:24:23.02ID:wy278lIc0
menu.bookmark-item, menuitem.bookmark-item {
min-width: 0;
max-width: 32em;
}

menupopup > menu, menupopup > menuitem, menupopup > menucaption {
max-width: 42em;
}

となってるから max-width を大きくすればいい
ブックマークツールバーからのポップアップでは32emで制限され
これを無効にすると42emの制限(その他のポップアップ)となる
2022/05/25(水) 22:48:24.11ID:YbifOlfR0
>>35
サンクスです
うちのuserChrome.cssに追加したところうまく動きませんでした

menu.bookmark-item, menuitem.bookmark-item {
min-width: 0;
width: 32em !important;
}

menupopup > menu, menupopup > menuitem, menupopup > menucaption {
width: 42em !important;
}

こんな感じで、幅を決めてしまえばなぜかうまく調整できましたがよくわかりません
2022/05/26(木) 09:30:30.03ID:RvieTpfx0
すんません>>34ですけど>>35うまく動きました
ブックマークツールバーのアイコンのテキストを消すために
.bookmark-item{
width: 20px !important;
}

これが悪さしてたみたいですありがとうございました

アイコンの名前はコレで消しました
.bookmark-item:not([type="menu"]) .toolbarbutton-text {
display: none !important;
}
2022/05/27(金) 09:31:38.66ID:I7/AZrvv0
すいません質問させてください
タブの右クリックメニューから「共有」を非表示にするため、以下をuserChrome.cssに登録したんですが

#tabContextMenu > .share-tab-url-item {
display: none !important;
}

Firefox release版100.0.2だと消えてくれたんですが、ESR 91.9.1とWaterfoxG4 4.1.2(ESR91がベースですよね)では消えてくれません
他に記入する文字があるのか、それともバージョン91だとやり方自体が違うんでしょうか?
2022/05/27(金) 10:02:42.44ID:I7/AZrvv0
すいません自己解決しました
#context_shareTabURL,
で、「共有」を消せました。失礼しました
2022/05/27(金) 22:04:55.99ID:iCjwQJtB0
Firefoxのブックマークツールバーのフォルダをクリックして出てくるメニューの背景に
色を付けたいのですけど
#PersonalToolbar .bookmark-item menupopup {
background-color: yellow !important;
}
これだと黄色の額縁のようにメニュー周辺しか色が付きません

#PersonalToolbar .bookmark-item menuitem {
background-color: red !important;
}
これだとマウスオーバーの時にいろが変わりません

何かいい方法を教えてください
41名無しさん@お腹いっぱい。 (ワッチョイ 97be-GUUK)
垢版 |
2022/05/27(金) 22:16:29.62ID:BS3VLMXr0
>>40
#PlacesToolbar {
--arrowpanel-background: green !important;
--arrowpanel-color: yellow !important;
}
2022/05/28(土) 08:18:49.83ID:YCk82iJr0
>>41
ありがとう完璧に動きました
こういったセレクタやプロパティなどはどうやって調べるのでしょうか

FireFoxのブラウザーツールボックスでそれっぽいセレクタを手あたり次第
userCrome.cssに書き込んでもあまりうまくはいきませんでした
43名無しさん@お腹いっぱい。 (ワッチョイ d9be-zOxv)
垢版 |
2022/05/28(土) 10:06:53.54ID:IZT4bQJw0
>>42
ブラウザーツールボックス右上の「…」メニューで「ポップアップを自動で隠さない」にチェックを入れ、対象メニューを開く
ツールボックス左上の矢印アイコンをクリックし、対象メニューをクリック

インスペクターの右サイドバー「ルール」タブの「スタイルを絞り込み」に background と入れる
左のツリーで対象付近の要素を一つ一つ選択しながら
右バーに background: ... または background-color: ... が出てこないか見る

menuitem なんかは backgrond-color: transparent; になっているがこれは透過色
この祖先のどこかで実際の色が設定されているはず…

ツリー上で祖先に向かって要素をたどっていくと、#PlacesToolbar menupopup に
background: var(--arrowpanel-background);
が設定されていることが分かった

https://i.imgur.com/lo3vvy7.png

名前が -- で始まり var(...) の形で使われているのはカスタムプロパティ

CSS カスタムプロパティ (変数) の使用 - CSS: カスケーディングスタイルシート | MDN
https://developer.mozilla.org/ja/docs/Web/CSS/Using_CSS_custom_properties

背景色を設定するなら文字色も忘れずに
同じようにして color を探し、値を設定(>>41)しておしまい
2022/05/28(土) 13:41:51.72ID:YCk82iJr0
>>43
さんくす、丁寧にありがとうございます
ブラウザーツールボックスはこうやって使うんですね
左上の矢印アイコンクリックして左ペインのインスペクターしかみてませんでした

>>41のgreenも確認できました
これは設定できる箇所が大幅に増えそうな予感、ありがとうございました
2022/05/28(土) 13:49:28.73ID:PF0E3AhX0
>>43
こんな感じにブラウザーツールボックスの使い方を解説してくれるとありがたいんだけど
ネット上には全くないんですよね
2022/05/28(土) 22:18:22.42ID:6NdCPfn60
触れば分かるからな
分からないのは触ろうとしないから
2022/05/31(火) 23:57:16.65ID:JYXMBhsz0
101.0 にしてしまいました。
すると,最大化したときにタブバーの上に3mmほどの不要な部分が表示されるようになってしまいました。
最大化しないときは,その不要な部分は表示されません。
何をどういじれば直るか教えてください。
2022/06/01(水) 08:34:02.89ID:neMLG3g50
>>47
もし、userChrome.cssに
:root[tabsintitlebar][sizemode="normal"] #titlebar { appearance: none !important; }
という行があるなら、
:root[tabsintitlebar] #titlebar { appearance: none !important; }
に置き換え

今まで非最大時のみに働いてた設定が最大時にも働くようになった模様
2022/06/02(木) 20:11:58.14ID:WNBHdlOF0
>>48
レス,ありがとうございます。
しかし,userChrome.css

:root[tabsintitlebar][sizemode="normal"] #titlebar { appearance: none !important; }

はないです。

tabsintitlebar で検索をかけてもヒットしません。
う~む。
2022/06/03(金) 06:11:20.00ID:xTDB0Ajx0
じゃあ追記して
2022/06/03(金) 18:31:29.26ID:eMK/Myis0
>>50
追記しましたが,変わりませぬ…
2022/06/03(金) 20:58:43.26ID:fguX+PZB0
用いているCSSを見せれば誰かが解明してくれる
2022/06/03(金) 21:18:48.69ID:EYp1fYZY0
多段タブあたりのスクリプトかもしれんし
2022/06/05(日) 21:49:30.09ID:mMS3A2Yl0
多段タブで,3段までとし,4段以上にするとスクロールするようにしています。
101.0にしてから,

最大化しないと,タブバーの上には何もないのですが,
https://imgur.com/HK4BUeD

最大化すると,タブバーの上に余白ができます。
https://imgur.com/rPlRyvl

この余白をなくすためには,userChrome.css などで何を変更すればよいか教えてください。
2022/06/22(水) 15:34:28.81ID:0379nkCy0
画像を表示したときに背景白、左寄せにしたいのだけど
100.0.2まで効いていたのが101.0から効かなくなって
101.0.1でも変わりありません

100.0.2
https://i.imgur.com/3MJ0NR7.png

101.0.1
https://i.imgur.com/VBI8KqV.png

画像の縦の長さ分しか効かなくなってしまいました
修正箇所を教えてください
2022/06/22(水) 15:35:46.21ID:0379nkCy0
すみません忘れてました

@-moz-document regexp("^(https?|ftp)(:\/\/[-_.!~*\'()a-zA-Z0-9;\/?:\@&=+\$,%#]+)\.(jpg|gif|png)$") {
@media not print {
body { background: #FFFFFF !important; }
img {position: relative !important; margin: .5em !important; }
}}
2022/06/22(水) 17:14:52.91ID:FNd1XM0S0
>>56
body → :root
2022/06/23(木) 00:11:33.72ID:vdIrPs5L0
>>57
出来ましたありがとう
2022/06/27(月) 21:26:00.09ID:5GeqMVwr0
このスレだったか、以前URLバーの鍵アイコンを緑にするCSSを拾ったのですが、
盾アイコンがトラッカーなどをブロック中に赤くするCSSはないでしょうかね?

鍵アイコンを緑にするCSSです。
#identity-box[pageproxystate="valid"].verifiedDomain #identity-icon,
#identity-box[pageproxystate="valid"].mixedActiveBlocked #identity-icon {
fill-opacity: 1 !important;
fill: #12BC00 !important;
}
2022/06/27(月) 22:04:58.99ID:K65BvaKl0
>>59
はい
https://www.reddit.com/r/FirefoxCSS/comments/vl3fob/list_of_tracking_icon_css_element_properties/
2022/06/27(月) 22:20:17.01ID:5GeqMVwr0
>>60
うまく行きました。
ありがとうございます。
2022/06/28(火) 00:17:57.68ID:SMYguXOJ0
-moz-accent-color、-moz-accent-color-foregroundがそれぞれAccentColor、AccentColorTextに置き換わるので使ってる人は気をつけて

https://bugzilla.mozilla.org/show_bug.cgi?id=1775247
今のところ103で実装予定(Nightly実装済)
63名無しさん@お腹いっぱい。 (スッップ Sd5f-PetT)
垢版 |
2022/06/28(火) 23:10:25.89ID:jPz8AO/Dd
Firefox 102.0
テーマ Google Chrome Darkを使用
いままではこれでタブの上に青い線をCSS
.tab-background[multiselected],
.tab-background[selected="true"] {
background: linear-gradient(to bottom, #0A84FF 1px, var(--toolbar-bgcolor) 0%, var(--toolbar-bgcolor) 100%) !important;
}

menupopup > menuitem,
menupopup > menu {
padding-block: 0.25em !important;
}

で出してたのですが、102.0にしたら消えてしまいました。
デフォのダークやシステムのテーマでは出てるんですけど
その他のテーマでまたタブの上部に青い線出せたらお教え下さい。
64名無しさん@お腹いっぱい。 (スッップ Sd5f-PetT)
垢版 |
2022/06/29(水) 00:18:14.90ID:TieFJLCxd
上の
menupopup > menuitem,
menupopup > menu {
padding-block: 0.25em !important;
}
は余計な行文でした。
2022/06/29(水) 02:59:37.28ID:TieFJLCxd
テーマがタブの枠色を指定しているとそっちが優先されているぽいです。
2022/06/29(水) 09:42:27.01ID:rcduSRph0
>>65
Firefoxに最初から入ってるテーマだったら青い線出るよ
2022/06/29(水) 11:42:24.21ID:1pPD8z2AM
>>65
outline: none !important;
を追加
2022/06/29(水) 12:48:30.03ID:TieFJLCxdNIKU
>>67
出来ました!
ありがとうございます。
マジ感謝です。
これで四角タブの上に青線出せました。
>>66
デフォのダーク システム ライトでは青線出せるのは存てましたが無事67さんのお陰で解決出来ました。
2022/06/29(水) 22:49:54.37ID:LGdSgbxk0NIKU
「アプリケーションメニューを開きます」を押したとき
メニューが右寄に表示される様に調整したいけど
どうすれば良いか教えてください
2022/07/04(月) 23:51:46.81ID:7aiNOSS40
>>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
2022/07/05(火) 10:06:35.12ID:I7+yoYaO0
>>70
赤色を紫にするだけなら>>60
 fill: red !important; を fill: #7542E5 !important; に
2022/07/05(火) 10:27:47.88ID:62MlGY5u0
>>71
すみません
そもそも>>60自体が効かないんです
2022/07/05(火) 10:37:08.18ID:I7+yoYaO0
>>72
他に用いているcssは効いてるの?
2022/07/05(火) 10:50:19.87ID:62MlGY5u0
>>73
他のは効いています

すいませんどうやらクロスサイトトラッキングが検出されたときにのみ色が変わる様でした
なので動いてること確認できましたありがとうございました
2022/07/05(火) 11:15:54.38ID:I7+yoYaO0
おい
2022/07/05(火) 11:33:43.21ID:62MlGY5u0
>>75
確認不足ですみません
2022/07/09(土) 17:16:54.88ID:IAbm//gJ0
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;
}

}
2022/07/09(土) 17:39:59.23ID:u8I2pcepa
>>77
stylus検討されたし
2022/07/09(土) 19:52:16.76ID:jaCAR1Qz0
>>77
div.rc ってどこのこと?
rc なんてクラスついた要素ないと思うんだけど
2022/07/09(土) 20:07:47.77ID:vr6cpyc70
>>77
https://sutasutashiki.blogspot.com/2019/02/search-engine-ranking-firefox-stylus.html
2022/07/09(土) 20:26:02.98ID:jaCAR1Qz0
stylus とか好みの問題で関係ない
2022/07/09(土) 22:32:31.63ID:IAbm//gJ0
>>79
今まで使っていたcssをコピペしたので、詳しい事はわかりません、ごめんなさい

>>80
紹介ありがとうございます
ただ、サイトの途中に書いてある

/* Google */
div.r h3::before {
counter-increment: result;
content: counter(result) ". ";
}

に変更してみたのですが、こちらでは動かなかったのですが、自分のミスですかね?
2022/07/09(土) 22:54:23.63ID:jaCAR1Qz0
>>82
そっちは見るなよ
その上にこうあるだろ
#search h3::before { }
ていうかドメイン限定してるから #search もいらない
ちゃんと自分で検索ページを F12 押して調べなさい
2022/07/09(土) 22:55:54.66ID:jaCAR1Qz0
そのブログ記事 2021年4月8日更新 だぞ
当時は知らんが div.rc も div.r もないから
2022/07/10(日) 18:26:20.86ID:PlDH7gqt0
>>82
それは効かない
2022/07/10(日) 18:55:20.41ID:hBTv0RfA0
>>83,85
お二人ともレスどうもありがとう
やっぱり効かないんですね
番号のつけ方的にそっちのほうが好みなんですが、無理なんですかね?
2022/07/10(日) 19:07:51.56ID:PlDH7gqt0
自分はできません
2022/07/10(日) 19:19:33.03ID:UtyQIc4w0
>>86
効くとか効かないとかじゃなくて
少しは自分でウェブ開発ツールのインスペクタで確認しろよ
そうすりゃ汎用性はないけどなんとかする道はある
だけどそういうのは検索ページの仕様変更ですぐ使えなくなる
それを自分で調べる覚悟がなければ無理
2022/07/10(日) 19:41:42.52ID:eiTcRPNJa
>>86
「検索結果のナンバリング」で検索されたし
2022/07/10(日) 19:41:42.77ID:UtyQIc4w0
>>86
これがインスペクタの表示
https://i.imgur.com/tG4frdX.jpg
2022/07/10(日) 19:44:22.26ID:UtyQIc4w0
>>89
それで出てくる上位は古かったり間違ってたり・・・
自分でやりたいようにやらないと意味ない
2022/07/10(日) 19:55:24.58ID:UtyQIc4w0
>>90 の画像は2つに分かれていて
上の方は、検索結果の内容は div#search の中に入っていることを示したもの

下の方は、階層になっている例として
「Firefox 高速プライベートブラウザー - Google Play のアプリ」
  「Android 版 Firefox Beta - Google Play のアプリ」
の箇所を示した
ここから法則を導き出して頑張ってくれ
2022/07/10(日) 20:49:28.57ID:4NqnY4XL0
オッ、なんかこの時間帯親切なネ申がいるみたいなんで俺も質問

右クリメニュー等の背景に透過png画像(狐ロゴ)を表示させてたんだけど(.menupopup-arrowscrollbox)
内部仕様が変わってメニュー全体が透過されるようになっちゃった
なのでもう一階層下に(.scrollbox-clip)指定し直してみた
すると表示自体は一応元通りにはなったんだが、なぜかタブバーにも画像が現れてしまう
どうしたらいいのか分からん教えろ下さい<m(__)m>
2022/07/11(月) 23:48:48.46ID:bc2Q49FA0
>>90
遅ればせながら、わざわざ画像まで作って説明してくれてありがとう
自分で解決出来れば一番良いので、この機会に勉強してみます
2022/07/12(火) 16:20:03.92ID:ICSF3SAm0
アドレスバーでhttpのサイトのURLを赤く表示するCSSを見つけました。

#identity-box[pageproxystate="valid"].notSecure ~ .urlbar-input-box{ color: red }

で、逆にhttpsのサイトのURLを緑で表示することもできるんじゃないかと思うのですが、
どう書けばいいでしょうか?
素人考えで色をgreenにして、notSecureの部分をSecureにすればいいのではないかと思ったのですが、
ダメでした。
2022/07/12(火) 16:30:39.61ID:ICSF3SAm0
自己解決しました。
ふと思い当たって、notSecureを外せばいいのではないかと試したらうまく行きました。

#identity-box[pageproxystate="valid"] ~ .urlbar-input-box{ color: green }
2022/07/14(木) 23:38:30.88ID:r4F0p2vW0
おい、もはやお前らだけが頼りなんだが?
マジで頼むが?
2022/07/15(金) 00:12:19.42ID:yMzH5nh+0
>>97
素人考え

:not(#TabsToolbar)
2022/07/17(日) 14:37:37.34ID:F8E2RULa0
>98㌧
駄目だった…w
他にも
tabbrowser-tabs
toolbar-items
TabsToolbar-customization-target
とか試したけど消えず

つかそもそも上位のIDが指定出来りゃ苦労は無いのに
shadow-rootとかいうわけわからんIDだから困る

引き続き気長にネ申を待つ
2022/07/17(日) 14:58:41.26ID:FBNMCZmD0
shadow-rootってことはshadowDOM
その下の要素を指定してスタイルを適用するには::partを使う必要がある
だけどuserChrome.cssは::partを使えないから、userChrome.jsのスレで質問し直しの方がいい
2022/07/17(日) 15:00:25.55ID:6eLzhjZU0
.menupopup-arrowscrollbox { background-image: url("hoge.png") !important; }
で特に問題ないように見えるが
もしかして background: url("hage.png") !important; してた?
2022/07/17(日) 15:47:57.81ID:F8E2RULa0
>101
か、解決した…www
つーかそこなの????????

89.0あたりで仕様が変わってからずーっと
あーでもないこーでもないやってたんだが
盲点にも程があるw

101氏をはじめレス下さった皆様本当にありがとうございました<m(__)m>
2022/07/27(水) 02:40:17.61ID:hL6DRW0N0
>>62
ありがとう
-moz-accent-color-foreground → AccentColorText
メニューバーの文字色が黒になってしまったものを白に戻せました
2022/07/27(水) 13:26:34.80ID:HQSrqE4/0
タブが一つの時はタブバーを非表示にするやつなんですが、
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;
}
2022/07/27(水) 13:49:52.65ID:HQSrqE4/0
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;
}
106名無しさん@お腹いっぱい。 (ワッチョイ b9be-Mq9P)
垢版 |
2022/07/27(水) 15:15:38.31ID:gl1EkmbL0
>>105
toolbarbutton を * に変える
2022/07/27(水) 16:08:17.47ID:HQSrqE4/0
>>106
おお!ありがとうございます!期待通りになりました。

いろいろ調べていて、以下にするとシンプルに書けました。
tab:only-of-type, tab:only-of-type + * {
display: none !important;
}
#tabbrowser-tabs, #tabbrowser-arrowscrollbox {
min-height: 0 !important;
}
2022/07/31(日) 16:41:33.13ID:rkkfbBAF0
目的 全サイト見にくいゴシック体・サンセリフ体を表示しない 丸ゴシック体で表示する プロポーショナルメトリクス字詰め

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 ;
}
2022/07/31(日) 19:02:01.36ID:W/RrEZUB0
>>108
こんな感じでチマチマやる
@font-face {
font-family: "見にくいゴシック体";
src: local("ヒラギノ丸ゴ ProN");
}
■ このスレッドは過去ログ倉庫に格納されています
5ちゃんねるの広告が気に入らない場合は、こちらをクリックしてください。

ニューススポーツなんでも実況