userChrome.css・userContent.cssスレ Part12

[過去ﾛｸﾞ] userChrome.css・userContent.cssスレ Part12 (631ﾚｽ)
上下前次 1-新

このｽﾚｯﾄﾞは過去ﾛｸﾞ倉庫に格納されています｡
次ｽﾚ検索歴削→次ｽﾚ栞削→次ｽﾚ過去ﾛｸﾞﾒﾆｭｰ

1: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ eb6e-X/6k) [sage] 2022/04/21(木) 23:24:46.59 ID:h1cG3tIy0(1) AAS
!extend:checked:vvvvv:1000:512
次スレを立てる方は↑を二行重ねて書いてください

●※前スレ
userChrome.css・userContent.cssスレ Part11
2chｽﾚ:software

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

532: 名無しさん＠お腹いっぱい。 (ｱｳｱｳｳｰT Sacf-CSnM) [sage] 2023/09/28(木) 19:50:20.77 ID:psHg24vPa(3/3) AAS
表示したとき、下ねズレても良いなら
/*#nav-bar {
background-color:transparent !important;
}
#PersonalToolbar:not(:hover) {
visibility: collapse !important;
background-color:transparent !important;
-moz-transition-duration: .15s !important;
-mozt-ransition-timing-function: ease-in-out !important;
}
#navigator-toolbox:hover > #PersonalToolbar {
visibility: visible !important;
-moz-transition: .15s ease-in-out;
}

533: 名無しさん＠お腹いっぱい。 (ﾆｸｸｴ d34f-3hLy) [sage] 2023/09/29(金) 23:47:09.01 ID:AoXvNtgi0NIKU(1/2) AAS
>>527

/* URLバー,検索バー */
#urlbar-input-container,
#searchbar,#urlbar,
#navigator-toolbox .searchbar-textbox
{
background-color: #252525!important;
color: #ffffff!important;
font-size: 11px !important;
border-radius: 5px;
Outline: none !important;
}

534: 名無しさん＠お腹いっぱい。 (ﾆｸｸｴ d34f-3hLy) [sage] 2023/09/29(金) 23:54:57.50 ID:AoXvNtgi0NIKU(2/2) AAS
/* 検索バー・URLバー・サイドバーのグレイテキストを非表示 */
#searchbar *|input::placeholder,
#urlbar *|input::placeholder,
#sidebar-search-container *|input::placeholder,
.findbar-textbox *|input::placeholder {
color: transparent !important;
}

535(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ abff-siUq) [] 2023/10/03(火) 13:55:03.07 ID:glxmpd8/0(1/3) AAS
メールの背景色をストライプにして、選択行のフォントをサイズアップする事まではできたんですが、
選択行の背景色を変える事ができません。開発ツールで見たところ、選択行の background-color が
取り消し線＋グレーアウトで無効化されているようです。うまく背景色も変える方法はありませんか？

/* 今現在、こんな感じです、、、orz */
#threadTree tr:nth-of-type(even) {
background-color: #c8c8ff !important;
}
#threadTree tr:nth-of-type(odd) {
background-color: #e0e0ff !important;
}
[is="tree-view-table-body"]:focus tr[is="thread-row"].selected, [is="tree-view-table-body"]:focus-within tr[is="thread-row"].selected, [is="tree-view-table-body"] tr[is="thread-row"].selected:focus-within {
font-weight: bold;
font-size: 16px;
color: #000000 !important;
　background-color: #ff0000 !important;
}

536: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ abff-siUq) [] 2023/10/03(火) 13:55:22.93 ID:glxmpd8/0(2/3) AAS
メールの背景色をストライプにして、選択行のフォントをサイズアップする事まではできたんですが、
選択行の背景色を変える事ができません。開発ツールで見たところ、選択行の background-color が
取り消し線＋グレーアウトで無効化されているようです。うまく背景色も変える方法はありませんか？

/* 今現在、こんな感じです、、、orz */
#threadTree tr:nth-of-type(even) {
background-color: #c8c8ff !important;
}
#threadTree tr:nth-of-type(odd) {
background-color: #e0e0ff !important;
}
[is="tree-view-table-body"]:focus tr[is="thread-row"].selected, [is="tree-view-table-body"]:focus-within tr[is="thread-row"].selected, [is="tree-view-table-body"] tr[is="thread-row"].selected:focus-within {
font-weight: bold;
font-size: 16px;
color: #000000 !important;
　background-color: #ff0000 !important;
}

537: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ abff-siUq) [] 2023/10/03(火) 13:55:41.66 ID:glxmpd8/0(3/3) AAS
メールの背景色をストライプにして、選択行のフォントをサイズアップする事まではできたんですが、
選択行の背景色を変える事ができません。開発ツールで見たところ、選択行の background-color が
取り消し線＋グレーアウトで無効化されているようです。うまく背景色も変える方法はありませんか？

/* 今現在、こんな感じです、、、orz */
#threadTree tr:nth-of-type(even) {
background-color: #c8c8ff !important;
}
#threadTree tr:nth-of-type(odd) {
background-color: #e0e0ff !important;
}
[is="tree-view-table-body"]:focus tr[is="thread-row"].selected, [is="tree-view-table-body"]:focus-within tr[is="thread-row"].selected, [is="tree-view-table-body"] tr[is="thread-row"].selected:focus-within {
font-weight: bold;
font-size: 16px;
color: #000000 !important;
　background-color: #ff0000 !important;
}

538: 名無しさん＠お腹いっぱい。 (ﾃﾃﾝﾃﾝﾃﾝ MMcb-N/UI) [sage] 2023/10/04(水) 07:38:29.93 ID:CD/qDaPUM(1) AAS
メールって何の話だ？

539: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 25be-wXmr) [] 2023/10/04(水) 10:39:17.09 ID:b6Ry5t2R0(1) AAS
>>535
最後の
　background-color: #ff0000 !important;
の行頭だけ全角の空白になっているけどそれのせいでは?

540: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲW ab5b-gcGo) [sage] 2023/10/04(水) 15:02:24.11 ID:toq88rwo0(1) AAS
スレッドツリーって要素名出てるじゃん。
試しに537の適用してみたら空色系のストライプになるのな。
が、俺じゃ537のやりたい事は解決できんかったわ。

541: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 9d58-Hwqz) [sage] 2023/10/07(土) 17:06:54.98 ID:gMquilR20(1) AAS
age厨に構うなよ
基地外が感染るぞ

542: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 4681-GYY9) [sage] 2023/10/07(土) 19:38:44.76 ID:9JpcC6Gl0(1) AAS
#threadTree tr:nth-of-type(even) {
background-color: #c8c8ff !important;
}
#threadTree tr:nth-of-type(odd) {
background-color: #e0e0ff !important;
}　　

の!important外したら良いんじゃ無いか？

543: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲW c9b1-+36z) [sage] 2023/10/14(土) 03:47:46.43 ID:p9c68WWW0(1) AAS
はーい。○○（なんか名前）ちゃん。至急、1階理科室に来てねー♪」（校内放送風）

544: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 2b83-f0fU) [sage] 2023/10/15(日) 01:52:19.51 ID:wH/HU4v80(1/2) AAS
536です。542で提示された方法で上手くいきました。感謝！

545: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 2b83-f0fU) [sage] 2023/10/15(日) 01:52:33.12 ID:wH/HU4v80(2/2) AAS
536です。542で提示された方法で上手くいきました。感謝！

546: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 49c2-Def0) [sage] 2023/10/15(日) 19:04:37.00 ID:t8mjpJIG0(1) AAS
久しぶりにfirefox入れたらタブとタブの境目がなくなって難儀してます

/* タブ間のセパレータ表示 */
#tabbrowser-arrowscrollbox .tabbrowser-tab {
border-right: 1px solid color-mix(in srgb, -moz-accent-color-foreground 30%, transparent) !important;
padding-inline: 0px !important;
}

前に使ってたcssはこれっぽかったんですが、今は使えないみたいなのでよければ教えてくれるとうれしいです

547(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ d371-T9H3) [sage] 2023/10/15(日) 19:39:22.72 ID:7JMt6y890(1) AAS
Firefox 103以降

以下の変更があるので注意
-moz-accent-color-foreground は AccentColorText に変更
-moz-accent-color は AccentColor に変更

548: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 865d-1API) [sage] 2023/10/22(日) 09:35:55.31 ID:NgoL7Nu20(1) AAS
>>547
あ、なるほど。ありがとうございます。そりゃだめなわけだ　書き直しですね・・・

549(2): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ aa12-s3V2) [] 2023/10/24(火) 13:02:13.78 ID:audtL+8s0(1) AAS
皆この馬鹿みたいに無駄で長いコンテキストメニュー使ってんの？
やっぱChromeに戻るわ

550(1): sage (ﾜｯﾁｮｲ 4a83-C1SI) [] 2023/10/25(水) 03:15:54.66 ID:H2iQZaNw0(1/2) AAS
119.0にしたら
/* タブの上部のライン */
.tab-background[multiselected],
.tab-background[selected="true"] {
background: linear-gradient(to bottom, #0A84FF 2px, var(--toolbar-bgcolor) 0px) !important;
outline: none !important;
}
が効かなくなってしまった。もうアクティブタブのラインって無理ですか？

551(2): sage (ﾜｯﾁｮｲ 4a83-C1SI) [] 2023/10/25(水) 03:16:07.22 ID:H2iQZaNw0(2/2) AAS
119.0にしたら
/* タブの上部のライン */
.tab-background[multiselected],
.tab-background[selected="true"] {
background: linear-gradient(to bottom, #0A84FF 2px, var(--toolbar-bgcolor) 0px) !important;
outline: none !important;
}
が効かなくなってしまった。もうアクティブタブのラインって無理ですか？

552(6): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ fa97-JD/u) [sage] 2023/10/25(水) 03:45:13.02 ID:nbkLrjdD0(1) AAS
>>550
.tab-background[selected]

553: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲW 1685-RqDz) [] 2023/10/25(水) 04:13:13.12 ID:ngceVmoy0(1) AAS
>>552
出来ました。ありがとうございます♪

554: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ d5cf-ANn9) [sage] 2023/10/25(水) 08:58:47.66 ID:eUF47XP20(1) AAS
>>549
なんの話？w

555: 名無しさん＠お腹いっぱい。 (CA 0Hb1-6fVo) [sage] 2023/10/25(水) 09:03:45.28 ID:3+PMKa0tH(1) AAS
>>549
（　´,_ゝ`）ﾌﾟｯ

556: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 1676-s3V2) [sage] 2023/10/25(水) 10:32:45.07 ID:+AeJOHd60(1) AAS
>>551
これって118.0.2の新規プロファイルで試してみたんですがタブの見た目に変化はありませんでした
どのような感じになるのか画像をお願いできませんでしょうか
もし有用そうなら私も使用しようかなと思いまして

557(2): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 16cf-JD/u) [sage] 2023/10/25(水) 14:51:47.05 ID:bPHWPtVe0(1/2) AAS
2chｽﾚ:software

/* 選択中のタブの色をツールバーと同一化 */
.tab-background[selected="true"] {
color: var(--toolbar-color) !important;
background-color: var(--toolbar-bgcolor) !important;
}

119.0で効かなくなりました
修正箇所ありましたら教えてください

558: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 8e13-ptOG) [] 2023/10/25(水) 15:39:59.51 ID:B2VqDQqQ0(1) AAS
>>552
横からありがとー

559: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 16cf-JD/u) [sage] 2023/10/25(水) 17:24:24.10 ID:bPHWPtVe0(2/2) AAS
>>552
>>551のどの部分を置き換えるのでしょうか

新規のuserChrome.cssに>>551だけ書いて

.tab-background[multiselected],
.tab-background[selected="true"]

それぞれどちらかを.tab-background[selected]に置き換えても変化なし
2行とも消して.tab-background[selected]だけ書いても変化なしでした

118.0.2では>>551,557で反映されていました

560(2): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ d676-GRDq) [sage] 2023/10/25(水) 20:31:07.85 ID:y2JWOoIL0(1) AAS
>>557
selected="true"を　selected

561(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 1a78-iKuA) [sage] 2023/10/25(水) 21:25:46.63 ID:V2Ry5K2m0(1) AAS
ええ…今迄のCSSそのまま使えるんなら、.tab-context-lineまで馬鹿正直に指定し直したのは無駄だったんか

/* 選択タブ上部のラインを強調 */
.tabbrowser-tab:is([multiselected],[selected="true"]):not(:-moz-lwtheme) .tab-stack .tab-background {
background: rgb(255,255,255) !important;
}
.tabbrowser-tab:is([multiselected],[selected="true"]) .tab-stack .tab-background .tab-context-line {
border-top: 2px solid rgb(64,128,251) !important;
}
/* 非選択タブ上部の枠線 */
.tabbrowser-tab:not([multiselected],[selected="true"]) .tab-stack .tab-background {
background: linear-gradient(to bottom, rgba(100, 100, 100, 1.0) 1px, rgba(77, 77, 77, .20) 0%, rgba(77, 77, 77, .20) 100%) !important;
}

562: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 1676-s3V2) [sage] 2023/10/26(木) 00:29:42.90 ID:nvDVNtCg0(1) AAS
タブバーの背景色をメニューバーから引き継ぎたいんですが、
--toolbar-bgcolorみたいなのありますか？

#tabbrowser-tabs {
background-color: var(--menubar-bgcolor) !important;
}

563(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ ce73-dClG) [sage] 2023/10/26(木) 00:50:54.58 ID:rV+4BsPt0(1) AAS
その上の方でroot で色指定してるんじゃね

564: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ bd6c-ptOG) [sage] 2023/10/26(木) 07:39:17.71 ID:0BAp8JMp0(1/2) AAS
>>552
横からだけどありがとう｡
同じくタブ上部のラインの色が効かなくてここに来ました｡
無事解決した｡

565: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ bd6c-ptOG) [sage] 2023/10/26(木) 07:39:25.81 ID:0BAp8JMp0(2/2) AAS
>>552
横からだけどありがとう｡
同じくタブ上部のラインの色が効かなくてここに来ました｡
無事解決した｡

566: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ f5b8-s3V2) [sage] 2023/10/26(木) 08:10:57.31 ID:V+pbOwTC0(1/4) AAS
>>563
上の方ではメニューバーの色を指定してるんですが（rootでは指定していません）、この色が--menubar-bgcolorに反映されません
そもそも--menubar-bgcolorなんてものは無くて、適切な文字列があるのでしょうか？

/* メニューバーの背景色 */
#toolbar-menubar, menubar#main-menubar > menu {
background-color: #E3E4E6 !important;
}
/* タブバーの背景色 */
#tabbrowser-tabs {
background-color: var(--menubar-bgcolor) !important; /* 反映されない？ */
}

567(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ f5b8-s3V2) [sage] 2023/10/26(木) 08:56:11.14 ID:V+pbOwTC0(2/4) AAS
あー、もしかして--toolbar-bgcolor変数なんてものもなくて
cssの上の方で--toolbar-bgcolorをユーザ定義してるってことですかね
でも--toolbar-bgcolorはユーザ定義してないですがちゃんと色入ってますね

568(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 7a97-JD/u) [sage] 2023/10/26(木) 12:16:41.38 ID:kv1Lk2og0(1) AAS
>>567
--toolbar-bgcolorは:rootでブラウザが定義してる
スタイル当てたらそれらしい変数に勝手に割り当ててくれるなんて機能はない
値を使いまわしたいなら:rootでなくてもいいから共通の親で自分でcss変数定義すればいい

569: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ f5b8-s3V2) [sage] 2023/10/26(木) 13:27:59.67 ID:V+pbOwTC0(3/4) AAS
>>568
やっぱり--toolbar-bgcolorはブラウザ定義なんですね
そういうブラウザ定義のリストってどこかにありませんか？

570(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 41cf-iKuA) [sage] 2023/10/26(木) 13:46:30.08 ID:ZvDnGjaS0(1) AAS
このへんじゃね?
chrome://browser/skin/browser-shared.css

571: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 16cf-JD/u) [sage] 2023/10/26(木) 14:28:50.61 ID:h6pHxydk0(1) AAS
>>552
>>560
ありがとう
でもできなかったです

>>561
こちらでタブ上部ラインとタブの色をツールバーと同一化
できましたありがとう

572: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ f5b8-s3V2) [sage] 2023/10/26(木) 15:49:39.80 ID:V+pbOwTC0(4/4) AAS
>>570
ありがとうございます！

573: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 4e72-s3V2) [sage] 2023/10/27(金) 00:03:37.40 ID:LduYCR+R0(1) AAS
ブックマークアイテムを右クリックするとコンテキストメニューが出るけど
選択したブックマークアイテムの背景色が選択されてない状態に戻ってしまいます

選択したブックマークアイテムの背景色を残したままコンテキストメニューを開いて選択できるような挙動にするには
どのようなcssになりますか？お願いします

574(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ dd5d-ptOG) [sage] 2023/10/27(金) 18:08:13.21 ID:r9Ml0IYI0(1/3) AAS
/* サイドバーの背景色 */
#historyTree,
#bookmarks-view treechildren,
#bookmarksPanel/* 検索ボックスの周囲の色 */ {
background-color: #3C444B!important;
border: solid 1px #3C444B !important;
}

/* クリック中選択状態のボーダーを消す */
treechildren::-moz-tree-row(current, focus) {
border: 1px dotted #F3D982 !important;
outline: none !important;
}

/* クリック中選択状態のアイテム */
#bookmarksPanel treechildren::-moz-tree-row(selected,current,focus) {
background-color: #6a788a !important;
border: solid 1px #495361 !important;
}

575: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ dd5d-ptOG) [sage] 2023/10/27(金) 18:08:46.58 ID:r9Ml0IYI0(2/3) AAS
/* 非アクティブ状態で選択状態のテキスト */
#bookmarksPanel treechildren::-moz-tree-cell-text(selected) {
color: #ffffff !important;
background-color: #6a788a !important;
}
/* 背景色 */
#bookmarksPanel treechildren::-moz-tree-row(selected) {
background-color: #6a788a !important;
border: solid 1px #495361 !important;
}

/* アクティブ状態で、選択状態のテキスト */
about:stylish-edit?id=15#bookmarksPanel treechildren::-moz-tree-cell-text(selected,focus) {
color: #ffffff !important;/*白抜き文字*/
background-color: #6a788a !important;
}

576: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ dd5d-ptOG) [sage] 2023/10/27(金) 18:09:56.96 ID:r9Ml0IYI0(3/3) AAS
/* セパレーター */
#bookmarksPanel treechildren::-moz-tree-separator {
border: 1px dotted #c7c7c7 !important;
margin-bottom: 1px !important;
margin-right: 10px !important;
}

577(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ cd97-ptOG) [sage] 2023/10/27(金) 19:59:41.11 ID:0ytDqati0(1) AAS
サイドバー開いて､サイドバーのブックマーク欄の空白部分をクリックした時に出るこの水色の点線枠消したいのですが､
お教え下さい｡
https://i.imgur.com/4vEL74M.png

578: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 4e1b-ptOG) [sage] 2023/10/27(金) 20:27:12.12 ID:LQ21L+jl0(1) AAS
>>574
こうですか？うまく緑になりませんがどこか違うんでしょうね…
#bookmarksMenu menupopup > menuitem treechildren::-moz-tree-row(selected)
{ background-color: green !important; }

579: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 4a56-JD/u) [sage] 2023/10/27(金) 22:40:40.30 ID:Yu37zTfi0(1) AAS
ツイキャスの配信開始時に出るクリックしないと消えないダイアログ？を出ないようにする方法ありますか？

580(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 814f-Q0z2) [sage] 2023/10/29(日) 11:14:49.21 ID:q6Jtw/pd0(1) AAS
>>577

/* 選択中の点線を消す */
:root {
--default-focusring-width : 0px !important;
}

上記消えない場合か不都合があれば↓で。

/* 選択中の点線を消す */
treechildren::-moz-tree-row(current, focus) {
border: 1px dotted #F3D982 !important; /* 周囲と同じ色を指定する */
outline: none !important;
}

581: 名無しさん＠お腹いっぱい。 (ﾆｸｸｴ eb6c-Q0z2) [sage] 2023/10/29(日) 14:06:26.62 ID:WwYD5jxO0NIKU(1) AAS
>>580
ありがとうございます！
上のCSSで無事消せました！
感謝です｡

582: 名無しさん＠お腹いっぱい。 (ｽｯｯﾌﾟ Sd33-ZQZw) [sage] 2023/10/30(月) 00:19:05.47 ID:hKMZydOnd(1/3) AAS
んー上のやってみたがタブの色戻らんなぁ

583: 名無しさん＠お腹いっぱい。 (ｽｯｯﾌﾟ Sd33-ZQZw) [sage] 2023/10/30(月) 00:39:04.32 ID:hKMZydOnd(2/3) AAS
ホバーのときはもとので出来るのに

584: 名無しさん＠お腹いっぱい。 (ｽｯｯﾌﾟ Sd33-ZQZw) [sage] 2023/10/30(月) 01:15:04.63 ID:hKMZydOnd(3/3) AAS
.tabbrowser-tab[selected] > .tab-stack > .tab-background{

できたわ

585: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ d3ad-Q0z2) [sage] 2023/10/30(月) 08:07:53.73 ID:JtHnNYR10(1/3) AAS
描画速度としてはCSSセレクタは子セレクタ（>でつなげる）よりも、小孫セレクタ（スペースでつなげる）の方が速いらしいって聞いて
子セレクタで書いてたやつをほとんど小孫セレクタに書き換えたわ、体感的には分からんけど
ブラウザで取得できるCSSセレクタも小孫セレクタだしな

586(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ d3ad-Q0z2) [sage] 2023/10/30(月) 09:27:01.83 ID:JtHnNYR10(2/3) AAS
タブが１つの時はタブバーを非表示にしたいんですが、以下ではうまくいきませんでした
どのようなセレクタが適切でしょうか？教えて頂ければ幸いです

tab:only-of-type:has(#TabsToolbar)
{
display: none !important;
}

587(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 1397-H9h+) [sage] 2023/10/30(月) 10:45:47.94 ID:r6GkuSgf0(1) AAS
>>586
逆
#TabsToolbar:has(tab:only-of-type) {
display: none !important;
}

588: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ d3ad-Q0z2) [sage] 2023/10/30(月) 13:54:38.64 ID:JtHnNYR10(3/3) AAS
>>587
ありがとうございます、でもhas使いこなせず結局うまくいかなかったので
以下を参考にしてタブバー隠せました
https://support.mozilla.org/en-US/questions/1394300

tab:only-of-type, tab:only-of-type + #tabbrowser-arrowscrollbox-periphery
{ display: none !important; }

589: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 29cf-n4SB) [] 2023/10/30(月) 20:37:26.66 ID:RGZ6UolO0(1) AAS
つべの投稿が何日前とかじゃなく投稿日で見えるようにするやつ
前は後者だけだったのだがhoverするまでの位置が安定しなかった
背景はダーク用な
/* 次のの直前:最初からサイズ0なのだが次のの位置決定に悪さする対策 */
tp-yt-paper-tooltip.style-scope.ytd-watch-info-text
{left: 0px !important; top: 0px !important;}
/* 有効になったときに動くと鬱陶しいので元の位置も変えておく */
div#description div#tooltip.style-scope.tp-yt-paper-tooltip,
div#description div#tooltip.style-scope.tp-yt-paper-tooltip.hidden
{display:block !important; width:621px; height:13px;
position:absolute; top:-3px; left:-5px;
background:#282828; font-size:13px !important;}

590: 名無しさん＠お腹いっぱい。 (中止 13f4-XVKo) [sage] 2023/10/31(火) 00:32:26.75 ID:iqpOrJ4W0HLWN(1) AAS
119、visuallyselected使えなくなってる？

591: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 094a-Q0z2) [] 2023/11/01(水) 15:34:22.06 ID:KThtrPBO0(1) AAS
>>0588
横から Many thanks!

592(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ d335-Q0z2) [sage] 2023/11/01(水) 15:53:27.22 ID:AjY8Q9D10(1/3) AAS
アドレスバーの候補表示設定を全てチェックを外すとポップアップで候補が表示されなくなりますが
URLをクリックすると青い枠が表示されます
目障りなので青い枠を表示させないようにするcssを教えてください

以下はだめでした
#urlbar:-moz-focusring {
outline: none !important;
}

593(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 2158-9BPk) [sage] 2023/11/01(水) 16:26:18.91 ID:8JmZmfoZ0(1) AAS
以下が効かなくなったのですが修正方法を教えてください
img:-moz-loading{visibility:hidden!important;}

594(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ d335-Q0z2) [sage] 2023/11/01(水) 20:23:59.23 ID:AjY8Q9D10(2/3) AAS
ブラウザツールボックス内のコンテキストメニューの縦幅サイズが大きいのですが
ここはuserChrome.cssでのカスタムはムリでしょうか？
以下は効きませんでした
menuitem, menu
{ padding: 2px 5px 2px 5px !important; }

595(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 1397-c8RC) [sage] 2023/11/01(水) 21:48:46.01 ID:wAXBWz1U0(1) AAS
>>594
ブラウザツールボックス用のcssはchrome_debugger_profile\chromeの中に置く

596: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ d335-Q0z2) [sage] 2023/11/01(水) 22:01:33.38 ID:AjY8Q9D10(3/3) AAS
>>595
できました！ありがとうございます

597(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ d3ba-Q0z2) [sage] 2023/11/02(木) 14:09:26.40 ID:m2u+gzLF0(1/2) AAS
>>592のやつですが以下で青色が出ないようにはできました
ただ、枠外のボーダーかシャドウがまだ出てしまうので、それも出ないようにしたいです
（つまりURLバーをクリックしても見た目が変わらないようにしたい）
現状以下です、よろしくお願いします

/* アドレスバーにフォーカスしても見た目を変えない */
#urlbar {
--toolbar-field-focus-border-color: var(--toolbar-field-border-color) !important;
--toolbar-field-focus-background-color: var(--toolbar-field-background-color) !important;
box-shadow: 0px !important;
border: 0px !important;
}

598(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ b1be-QCFe) [] 2023/11/02(木) 17:28:01.25 ID:D5QlkTpH0(1) AAS
>>597
#urlbar-background {
outline: none !important;
box-shadow: none !important;
}

599: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ d3ba-Q0z2) [sage] 2023/11/02(木) 19:16:48.26 ID:m2u+gzLF0(2/2) AAS
>>598
ありがとうございます！

600(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 22f5-jfG6) [sage] 2023/11/07(火) 21:42:22.00 ID:c+tTtFER0(1) AAS
UIのポップアップメニューのマウスオーバー色は変えたいけど
コンテンツ内のプルダウンメニューのマウスオーバー色はデフォルトにしたいです
以下ではblueにはなりませんでしたが、デフォルトのマウスオーバー色にもなりませんでした
ご教示のほどお願いします

/* ポップアップメニューアイテムのマウスオーバー色 */
menuitem:hover {
background-color: blue !important;
}
/* コンテンツ内プルダウンメニューアイテムのマウスオーバー色 */
.ContentSelectDropdown-item-0:hover {
background-color: initial !important;
}

601(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 31be-Zzzn) [] 2023/11/08(水) 07:06:08.77 ID:+nsDVE5s0(1) AAS
>>600
menupopup:not(#ContentSelectDropdownPopup) :is(menu, menuitem):not([disabled])[_moz-menuactive] {
background-color: blue !important;
}

602: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 22d3-jfG6) [sage] 2023/11/08(水) 10:11:01.21 ID:oaEIXEKj0(1) AAS
>>601
menuitem:not(.ContentSelectDropdown-item-0):hover
で除外できました。ありがとうございます。
後方でinitial等で初期値を上書きできればと思ったんですが、うまくいかないものですね。

603: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 9d11-9NWm) [sage] 2023/11/09(木) 14:55:57.94 ID:mKBsKUDr0(1) AAS
>>560
557じゃないけどありがとうございます

604: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ c64a-jfG6) [sage] 2023/11/09(木) 16:55:27.65 ID:xJjECzt90(1/2) AAS
:where(.aaa, .bbb)
がなんとなく調子悪いので
:is(.aaa, .bbb)
を使ってる

:whereって複数選択できないのかな？

605: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 4297-sdYh) [sage] 2023/11/09(木) 17:17:51.52 ID:lYn3aIN50(1) AAS
:whereは詳細度上がらないから有無を言わさずルール上書きしたい場合に向かない

606: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ c64a-jfG6) [sage] 2023/11/09(木) 19:02:11.37 ID:xJjECzt90(2/2) AAS
なるほど、やっぱり:isを使うべきか

607(1): 名無しさん＠お腹いっぱい。 (ｽｯﾌﾟｰT Sdc2-jfG6) [sage] 2023/11/10(金) 15:40:27.75 ID:voYkgPVmd(1) AAS
Chromeだったらアドオンでいくつかあるのだけど、Firefoxには見当たらないので、
YouTubeのコントロールバーをプレイヤーの下に表示するCSSを作りました。
標準プレイヤーのみの対応ですが、よければ使ってください。

/* 標準プレイヤーの高さをコントロールバーの分増やす */
ytd-watch-flexy:not([theater]) #player-container-inner {
height: 51px !important
}
/* プレイヤーバックの色変更 */
ytd-watch-flexy:not([theater]) #movie_player {
background-color: #000000 !important
}

なお、コントロールバーは一定時間経てば消えますが、
常時表示したい場合は、次のスクリプトをインストールしてください。

YouTube Permanent ProgressBar
https://greasyfork.org/ja/scripts/426283-youtube-permanent-progressbar

このCSS、シネマモードでも使えるようにしたいのですが、どうもうまく行きません。
もしいい方法があれば、助言お願いします。

608: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 194f-jfG6) [sage] 2023/11/10(金) 20:24:32.44 ID:f3pKcrn20(1/2) AAS
Firefoxのポップアップの背景色だけ有効にしたいでのですが
どのようにすれば良いですか

/* ポップアップ */
.menupopup-arrowscrollbox{
background-color: Pink !important;
}

609: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 22f5-jfG6) [sage] 2023/11/10(金) 21:03:58.18 ID:WOCSS5Dk0(1) AAS
Pinkじゃなくてとりあえずredで試してみたら？
俺は以下で変えられてる

/* ポップアップメニューの背景色 */
.menupopup-arrowscrollbox {
background-color: #F2F2F2 !important;
}

610: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 194f-jfG6) [sage] 2023/11/10(金) 23:08:12.50 ID:f3pKcrn20(2/2) AAS
FirefoxのUI以外はどのように除外すればよいのでしょう？
一部のサイトで色が変わってしまいます

611(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 1f5e-gzdM) [sage] 2023/11/11(土) 06:02:19.50 ID:DRpcqQZc0(1/2) AAS
>>607

:root {
--controller-height: 51px;
}
#full-bleed-container {
margin-bottom: var(--controller-height) !important;
}
ytd-watch-flexy[theater] {
z-index: 0 !important;
}
ytd-watch-flexy[theater] .html5-video-player {
overflow: visible !important;
}
ytd-watch-flexy[theater] .ytp-chrome-bottom {
margin-bottom: calc(var(--controller-height) * -1) !important;
}
ytd-watch-flexy[theater] #player-container::after {
content: '';
position: absolute;
width: 100%;
height: var(--controller-height);
margin-bottom: calc(var(--controller-height) * -1);
background: #000;
z-index: -1;
}

--controller-heightでコントローラー位置を調節できる

612(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 1f5e-gzdM) [sage] 2023/11/11(土) 08:01:50.19 ID:DRpcqQZc0(2/2) AAS
>>611
横着したら普通の方のデザインが崩れてたので訂正
:root {
--controller-height: 51px;
}
ytd-watch-flexy[theater] #full-bleed-container {
margin-bottom: var(--controller-height) !important;
}
ytd-watch-flexy[theater] {
z-index: 0 !important;
}
ytd-watch-flexy[theater] .html5-video-player {
overflow: visible !important;
}
ytd-watch-flexy[theater] .ytp-chrome-bottom {
margin-bottom: calc(var(--controller-height) * -1) !important;
}
ytd-watch-flexy[theater] #player-container::after {
content: '';
position: absolute;
width: 100%;
height: var(--controller-height);
margin-bottom: calc(var(--controller-height) * -1);
background: #000;
z-index: -1;
}

ついでにツールチップの位置を下げるやつ

.ytp-tooltip {
margin-top: var(--controller-height) !important;
}

613: 607 (ﾎﾟｷｯｰT Sd1f-gzdM) [sage] 2023/11/11(土) 21:50:24.44 ID:iFV/7D8Nd1111(1) AAS
>>612
うまく行きました。
本当にありがとうございます。
このCSSを見ると、自分のスキルではまだまだ無理だと実感しましたw

個人的に、コントロールバーを下にずらしたので、
バーを覆っていた影が気になるため、非表示にしました。

/* プレイヤー下部の影の非表示 */
ytd-watch-flexy .ytp-gradient-bottom {
display: none !important
}

614: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 1f58-kIyz) [sage] 2023/11/15(水) 00:03:48.32 ID:6c0l3urr0(1) AAS
>>593
削除されてました
1850342 - Remove :-moz-loading, and avoid exposing :-moz-broken pseudo-class to content.
https://bugzilla.mozilla.org/show_bug.cgi?id=1850342

615(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 7f76-Zoup) [] 2023/11/16(木) 15:55:02.31 ID:GAfZis5L0(1/3) AAS
ここにある
https://www.userchrome.org/firefox-89-styling-proton-ui.html
↓のように、アクティブタブの上部に青線、だけほしいので書式お願いします。

Container/Active Tab color line:
+Blue Line on active tab

616: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 7f09-gzdM) [sage] 2023/11/16(木) 16:39:40.94 ID:dwMVWCtr0(1) AAS
/* タブの上部のライン */
.tab-background[multiselected],
.tab-background[selected] {
background: linear-gradient(to bottom, #0A84FF 2px, var(--toolbar-bgcolor) 0px) !important;
outline: none !important;
}

617: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 7f76-Zoup) [sage] 2023/11/16(木) 20:15:35.11 ID:GAfZis5L0(2/3) AAS
>>615
ありがとうございます。試したのですが出来ないみたいですので
とりあえずは、そこのCSS based on above options:
での書式で行きます。

618(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 1f66-gzdM) [sage] 2023/11/16(木) 21:16:15.52 ID:9vD6Cyf/0(1) AAS
/* アクティブタブの上に青い線 */
.tab-background:is([selected], [multiselected]) {
border-top: 1px solid Blue !important;
}

619: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 7f76-Zoup) [sage] 2023/11/16(木) 21:48:31.17 ID:GAfZis5L0(3/3) AAS
>>618
ありがとうございます。出来ました。

620: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 9f58-Zoup) [sage] 2023/11/17(金) 19:08:03.92 ID:OXKGruvy0(1) AAS
/* アクティブタブの文字色 */
label.tab-text.tab-label[selected="true"]{font-weight: bold !important;}

これが119で動かないんだけどどこを修正すれば動きますか？

621: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ ffb8-gzdM) [sage] 2023/11/17(金) 19:33:17.61 ID:xX6UYbsC0(1) AAS
="true"
を削除

622: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 1f4f-gzdM) [sage] 2023/11/17(金) 20:32:00.21 ID:UwG7SfoR0(1) AAS
/* アクティブタブの背景色 */
.tab-background:is([selected], [multiselected])

/* アクティブタブの文字色 */
.tabbrowser-tab:is([visuallyselected], [multiselected])

/* 非アクティブタブの背景色 */
.tab-background:not([selected], [multiselected])

/* 非アクティブタブの文字色 */
.tabbrowser-tab:not([visuallyselected], [multiselected])

/* アクティブにマウスオンしたときの背景色 */
.tabbrowser-tab:hover > .tab-stack > .tab-background:is([selected], [multiselected])

/* アクティブにマウスオンしたときの文字色 */
.tabbrowser-tab:hover > .tab-stack >:is([selected], [multiselected])

/* 非アクティブにマウスオンしたときの背景色 */
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected], [multiselected])

/* 非アクティブにマウスオンしたときの文字色 */
.tabbrowser-tab:hover > .tab-stack >:not([selected], [multiselected])

623(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ c176-hO6y) [sage] 2023/11/18(土) 19:17:35.84 ID:cgw9DvTW0(1) AAS
firefoxでstylus更新したらCSS効かなくなったんだけどなんで？

624: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ a503-hO6y) [sage] 2023/11/18(土) 22:56:43.75 ID:XB8apQtC0(1) AAS
>>623
バージョンは？
1.5.37 はバグありで取り下げられた

625(1): 名無しさん＠お腹いっぱい。 (HappyBirthday! 520c-hO6y) [sage] 2023/11/20(月) 23:52:25.21 ID:9MiWme6b0HAPPY(1) AAS
現バージョンでの音が出ているタブの色を変える方法が判明したら教えていただけますか

626(2): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ e92d-rrr/) [sage] 2023/11/21(火) 02:53:40.34 ID:PceYQi9w0(1) AAS
>>625

.tabbrowser-tab:is([soundplaying], [muted]) .tab-background {
background-color: #f00 !important;
}

627: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 520c-hO6y) [sage] 2023/11/21(火) 04:15:33.59 ID:MY2f9Xb80(1) AAS
>>626
ほんと助かります、どうもありがとう

628: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 5dee-D72S) [sage] 2023/11/21(火) 18:02:55.23 ID:KzKE9Xic0(1) AAS
>>626
動くアイコンより見やすくていいね

629: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ f925-rrr/) [sage] 2023/11/21(火) 19:20:04.63 ID:YsTcpB/K0(1) AAS
俺はアイコンで音のオンオフするから全部乗せにてるわ
普通に見やすい

/* サウンドタブをアニメーション化 (赤) */
/* ミュートアイコンに色を付ける (黒) */
/* サウンドタブのファビコンを復活 */
/* サウンドタブの背景色+半透明化 */

630: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 82f4-o99j) [sage] 2023/11/22(水) 16:28:41.22 ID:5dG5VQLh0(1) AAS
Firefox 120で結構変更入ったっぽい？
まあESR使ってるからあんまり関係ないけど

631: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 0676-wJQt) [sage] 2023/11/22(水) 16:45:50.24 ID:DbYbpYZP0(1) AAS
アクティブタブ上部に線をつけたいです

上下前次 1-新書関写板覧索設栞歴

ｽﾚ情報赤ﾚｽ抽出画像ﾚｽ抽出歴の未読ｽﾚ AAｻﾑﾈｲﾙ

ぬこの手ぬこTOP 0.056s