userChrome.css・userContent.cssスレ Part11
レス数が900を超えています。1000を超えると表示できなくなるよ。
!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 ナビゲーションバーの右側にフォントサイズ大と小の変更、それに最大化ボタンを置いている
Ctrl-+、Ctrl-+、F11のキーボードの使用は、その時の操作の流れで使い分ける
F11があればいいというものじゃない こいつ>>844は>>798-822の厄介者なんで、スルー推奨 一回閉じたSidebarModokiをもう一回表示させる方法が分からないんだけど
どこから表示・非表示できるんだったっけ・・・? ツールバーボタン クリック またはCtrl+Alt+B タブバーを下に置くcssが最近のバージョンアップて破綻する
いろいろ面白くない環境になるなあ アクティブなタブのフォントの色は以下で変更出来たけど、非アクティブの文字の色を変更する場合はどう記載すればいいかな?
/* アクティブなタブの文字変更 */
.tabbrowser-tab[selected=true] .tab-text {
font-weight: bold !important;
color: #FF0000 !important;
}
ちなみに91.4.1esr 自己解決しました
.tabbrowser-tab[selected=true] .tab-text {
を
.tabbrowser-tab:not([selected]) .tab-text {
に変更で行けました 96以降で機能するタブをツールバーの一番下に位置させるcssはどこかにないかな しばらくあげてなくていきなり95にあげたらタブバー一番下がだめで半泣きでここ来て絶望したけど
もう一度72 92とあげ直したら95.02でタブバー一番下に来てほっとした
もう96はダメなんですか? PCブラウザで見るYouTubeの動画サイズをちょっと広く大きくしたいです
(シアターモードにせずにデフォルト表示のまま)
代わりに、右サイドバーにあるオススメ動画やチャット欄は狭くして構いません
#secondary { width: 30% !important; }
と書いたのですが、動画サイズは広がりませんでした
どのように書けば希望のようになりますか? YouTubeてデフォルトでシアターモードで表示できないんだろうか。
いちいちボタン押して広げるのが面倒すぎる。 >>858
ytd-watch-flexy:not([theater]):not([fullscreen]) #secondary {
width: 20% !important;
min-width: 0 !important;
}
ytd-watch-flexy:not([theater]):not([fullscreen]) #primary .html5-video-player video {
width: 100% !important;
height: auto !important;
} >>860
駄目だこれ
プレイヤーのコントロールの幅が狭いままだ
ytd-watch-flexy:not([theater]):not([fullscreen]) #primary .html5-video-player .ytp-chrome-bottom {
width: calc(100% - 12px - 12px) !important;
}
コントロール全体はこれでいいけど
プログレスバーが如何ともしがたい >>862
ありがとう。
そんなものがあったなんて。 >>860-861
ありがとうございます
今出先なので帰ったら作業します >>861
確かにプログレスバーが取り残されてます
けれどかなり見やすくなりました! 上記のCSSを適用した状態で
下記のような縦長の動画を見るとおかしくならないですか?
https://youtu.be/zPBNj_xRBd0 >>859
前も同じような質問があったなぁと思ったら
>>550
>>552 >>858
Youtube polymer engine fixesというスクリプトを使えば、
デフォルトでもシアターモードでも任意のサイズを指定できる
https://greasyfork.org/ja/scripts/405614-youtube-polymer-engine-fixes
好みのサイズがなければ、コードの数字の部分を書き換えればいい
他にもいろいろ機能があるのであすすめ >>869
本当にありがとうございます!
とても良いですねこれ
#primary
{ margin-left:1px !important; }
も足してさらに領域の節約を試みましたが、下のコメント欄がズレてうまくいきません
https://i.imgur.com/wUaXdA2.png
赤枠の部分を切り詰めて、ビデオも右サイドバーも全部左に寄せるにはどうしたらいいのでしょうか? YouTubeなど音を出しているときタブに
YouTubeのアイコン、タイトル、サウンドのアイコンだったのですが
今サウンドのアイコンが左にいってしまいサイトのアイコンも消えてわかりにくいため
以前のように戻したいのですが何かいい方法はありますか? firefoxのページ内検索結果のハイライトの色を変える方法を教えていただけませんか?
tridactylというプラグインを使っているのですが、検索結果のハイライトの色が上書きされてしまっているようです。
そのため、about:configでui.textHighlightBackgroundを変更してもダメでした。 YouTubeLiveClockというChrome用のアドオンを使うと、
YouTubeの再生バーがプレイヤー下部の枠外に常に表示できるようです。
で、思ったのですが、これってCSSで同じことができませんかね? >>872
大変遅くなりましたがありがとうございました
他の設定でかなり手間取ってまして分かる方いたら教えてください
browser.display.use_document_fonts", 0
gfx.downloadable_fonts.enabled", false
だとwebサイトの文字はオプションから設定したフォントしか表示されない
tampermonkeyやwebサイトのユニコード文字が表示されない
stylusでフォント変更のcssを設定してもwebサイトの文字は変更されない
Firefoxの文字変更もすべて効かない(色や文字サイズとかは可)
1年以上前ぐらいのFirefoxスレで似たような人がいて
layout.css.font-visibility.levelを1から3とあったけどどちらも効果なし
新規Firefox、新規chromeでもmonkeyのユニコードは表示されず
仕方なくFont Awesome 5 Regularをインストしたところchromeは効きました
ちなみにtamper諦めてgreaseを入れてみたらユニコードで表示されなかった
fonts.woff2はどちらも効果なしです
Firefoxの方を見ると
@font-face {
src:url("data:application/font-woff2;charset=utf-8
format("woff2")
}
.far {
font-family:'Font Awesome 5 Regular';
font-weight:400
}
とやはり読み込みをしています
このwebフォントの読み込みをやめて指定したフォントにするにはどうしたらいいですか?
せめてポップアップの画面だけでもと思うのですがURLがわかりません(ダッシュボード等はわかる)
皆さんはuse_document1なんですか? webフォントをどうしても使いたくないなら広告ブロックで潰せばいいだろ
uBlockOriginなら設定にリモートフォントをブロックがあるし ツールバー群をすべて非表示にし、マウスを上辺にホーバーした時のみ表示するようなcssを用いてみた
そしたら、ブックマークツールバーのフォルダーアイコンをクリックしてプルダウンメニューを開いて
マウス操作してしばらくするとプルダウンメニューが勝手に閉じてしまう
色々試行して閉じないようにすると、今度はナビゲーションバーで検索しょうとすると
候補が下の方に伸びないジレンマに陥ってしまう
あられもない副作用が出て困惑した
検索は別のルートを使うことが多いのでブックマークツールーバーのプルダウンメニューの安定性を優先した案を採用してるけど、なんかスッキリしない こいつ>>879は>>798-822の厄介者なんで、スルー推奨 >>タブバーにアイコンを幾つか表示させた時のアイコンの間隔を狭めるcss
これについては、先日解決しました
これはタブの高さを低くすると、それにアイコンが小さくなり、結局のところ、アイコンの間隔を狭めることに繋がります
タブバーを下に位置変えするcssの中で
--tab-min-height: 22px !important; なんて記述に変更したら望みが達成されました 因みに、ツールバーの非表示については
autohide everything when not hovered anywhere on browser
https://support.mozilla.org/en-US/questions/1284841
タブバーの下配置については
firefox tabbar belowの検索語で上位に出てくる
HERE is the answer to put "TABS BELOW" which will work
with Firefox V90 using the - userChrome.css - file
https://support.mozilla.org/en-US/questions/1339095
などを利用させていただきました、ありがとうございました >>147の動作変になってると思ったら色指定の変数変わってたのね
色指定は変数でしたいけど変更されると大変だな Webサイトの太字を除く通常の太さのフォントをfont-weight:500にしたいのですが
Stylusの書式を教えて下さいお願いします >>884
特定のフォントに対してなら@font-faceでウェイトごとに使いたい太さに沿ったフォントを指定すれば出来るけど、全てのフォントを対象に太字除外で指定するのは無理じゃないかな?
例えば游ゴシックならば
@font-face { font-family:'Yu Gothic'; src:local('Yu Gothic Medium'); font-weight:100; }
以降weight:600まで指定しておきweight:700〜900はsrc:local('Yu Gothic Bold')に変え指定しておく
元のfont-familyに存在しないウェイトは書かなくていいとは思うがサイト側がどのようなウェイト指定してるか分からんので念のため -moz-accent-color
とは何だろうとぐぐるとここが見つかるんだけど、
どこに定義されてるもの? >>886
accent-colorでググると出るフォーム要素に色を付けるcssのプロパティ
-moz-はベンダープレフィックスって試験的実装の段階で付けるものだから正式実装された今は抜いて書ける
ということで合ってる筈 -moz-accent-color を
accent-color にしたら動かなくなった
やっぱり要るらしい 値の-moz-accent-colorはWin10/11の場合OSの設定→個人用設定→色→アクセントカラーそのもの
アクセントカラーがないOSだとrgb(0, 120, 215)決め打ち Google検索結果の検索バーを固定する方法ありませんか?
UserStyles.orgで公開されてるけど正常に動かない。 >>891
常時上に表示させたくないって意味なら
#searchform {position: relative !important;}
とかでいいんじゃね すべてからツールまでを隠れなくするだけなら
#top_nav
top:60pxをtop:73pxに スクロールすると検索バーがdefalt(?)に変わるけど、実害ないのでtop位置だけ変更して利用してます。 97にアップデートしたら、タブとブックマークのコンテクストメニューの不要項目削除が効かなくなりました。
長くて申し訳ないですが、教えて下さい。 /* タブのコンテキストメニューから不要項目を削除 */
#context_openANewTab, /* [新しいタブ] 89+ */
#context_openANewTab + menuseparator, /* [----------------] 89+ */
#context_reloadTab, /* [タブを再読み込み] */
#context_reloadSelectedTabs, /* [タブを再読み込み] 67+ */
#context_toggleMuteTab, /* [タブをミュート] */
#context_toggleMuteSelectedTabs, /* [タブをミュート] 67+ */
#context_pinTab, /* [タブをピン留め] */
#context_unpinTab, /* [タブのピン留めを外す] */
#context_pinSelectedTabs, /* [タブをピン留め] 67+ */
#context_unpinSelectedTabs, /* [タブのピン留めを外す] 67+ */
#context_duplicateTab, /* [タブを複製] */
#context_duplicateTabs, /* [タブを複製] 67+ */
#context_duplicateTabs + menuseparator, /* [----------------] 67+ */
#context_bookmarkSelectedTabs, /* [タブをブックマーク...] */
#context_bookmarkTab, /* [タブをブックマーク] 64+ */
#context_moveTabOptions, /* [タブを移動] 64+ 67+ */
#context_moveToStart, /* [最初のタブへ移動] 67+ */
#context_moveToEnd, /* [最後のタブへ移動] 67+ */
#context_openTabInWindow, /* [新しいウィンドウへ移動] 67+ */
#context_sendTabToDevice, /* [n 個のタブを端末へ送信] n=選択タブ数 */
#tabContextMenu > .share-tab-url-item, /* [共有] 89+ 92+ */ #context_reopenInContainer, /* [新しいコンテナータブで開く] 88+ 89+ */
#context_selectAllTabs, /* [すべてのタブを選択] 64+ 88+ */
#context_selectAllTabs + menuseparator, /* [----------------] 88+ */
#context_closeTab, /* [タブを閉じる] 88+ */
/*#context_closeTabOptions, /* [複数のタブを閉じる] 78+ */
/*#context_closeTabsToTheStart, /* [左側のタブをすべて閉じる] 88+ */
/*#context_closeTabsToTheEnd, /* [右側のタブをすべて閉じる] */
/*#context_closeOtherTabs, /* [他のタブをすべて閉じる] */
#context_undoCloseTab, /* [閉じたタブを開きなおす] 88+ */
/*#context_undoCloseTab + menuseparator, /* [----------------] 88+ */
#context-dummy-dummy-dummy /* ダミー */
{
display: none !important;
} /* ブックマークツールバーのコンテキストメニューから不要項目を削除 */
#placesContext_open, /* [開く] */
/*#placesContext_openBookmarkContainer\:tabs, /* [ブックマークをすべて開く] 89+ */
/*#placesContext_openBookmarkLinks\:tabs, /* [ブックマークをすべて開く] 89+ */
#placesContext_open\:newtab, /* [新しいタブで開く] 89+ */
#placesContext_openContainer\:tabs, /* [タブですべて開く] 89+ */
#placesContext_openLinks\:tabs, /* [タブですべて開く] 89+ */
#placesContext_open\:newwindow, /* [新しいウィンドウで開く] 89+ */
#placesContext_open\:newprivatewindow, /* [新しいプライベートウィンドウで開く] 89+ */
/*#placesContext_openSeparator, /* [----------------] */
/*#placesContext_show_bookmark\:info, /* [ブックマークを編集...] 89+ */
#placesContext_show\:info, /* [編集...] 89+ */
/*#placesContext_show_folder\:info, /* [フォルダー名を変更...] 89+ */
/*#placesContext_deleteBookmark, /* [ブックマークを削除] 89+ */
/*#placesContext_deleteFolder, /* [フォルダーを削除] 89+ */
#placesContext_delete, /* [削除] 89+ */
#placesContext_delete_history, /* [ページを削除] 89+ */
#placesContext_deleteHost, /* [このサイトの履歴を消去] 89+ */
#placesContext_sortBy\:name, /* [名前順に並べ替える] 89+ */ /*#placesContext_deleteSeparator, /* [----------------] 89+ */
#placesContext_cut, /* [切り取り] 89+ */
#placesContext_copy, /* [コピー] 89+ */
#placesContext_paste_group, /* [貼り付け] 89+ */
#placesContext_editSeparator, /* [----------------] 89+ */
#placesContext_new\:bookmark, /* [ブックマークを追加...] */
/*#placesContext_new\:folder, /* [フォルダーを追加...] */
#placesContext_new\:separator, /* [区切りを追加] */
#placesContext_newSeparator, /* [----------------] */
#placesContext_paste, /* [貼り付け] 89+ */
#placesContext_pasteSeparator, /* [----------------] 89+ */
#placesContext_createBookmark, /* [ページをブックマークに追加] */
#placesContext > #toggle_PersonalToolbar, /* [ブックマークツールバー] 85+ */
/* /* [常に表示する] 85+ */
/* /* [新しいタブのみ表示する] 85+ */
/* /* [表示しない] 85+ */
#show-other-bookmarks_PersonalToolbar, /* [他のブックマークを表示] 85+ */
#placesContext_showAllBookmarks, /* [ブックマークを管理] 89+ */
#placesContext_showAllBookmarks + menuseparator, /* [----------------] 89+ */
#context-dummy-dummy-dummy /* ダミー */
{
display: none !important;
} ↑のコンテクストメニューの件、Windowsでは問題無しで、Macでは効いていない。
別の件で、MacではCSSの構文が効かないという同じような事があった。 >>903
ありがとう。
macOS Mojaveだけど、上手くcssが反映されて、コンテキストメニューの不要項目が削除できた。 Macだけchromeの中身が違うなんていくらでもあるんだから
糞マイナーの儲が切り分けもせずここで喚いても迷惑なだけなんだよ
だから巣に帰れと言われるのだ >>905
お前、友達いないだろ、可哀想な奴だな。 ブックマークポップアップ内のフォルダ右に表示される「>」を
もう少し左にひっこめさせて他のブックマークの文字列の終端に合わせたいと思ってます。
以下で上手くいかなくて、良い方法があればお願いします。
.bookmark-item[container] .menu-right {
/* NG
position: relative !important;
left: -40px !important;
*/
/* これもNG */
margin-left: -40px !important;
} margin-inline-startを適当なマイナス値で >>909
やってみましたが margin-left: -40px !important; と同じになりました。
左に移動しないです… 言っている意味取り違えていたかも
margin-inline-end: 40px;でどうよ >>911
あぁ!いいですね、>が左に引っ込みました。ありがとうございます。
あとは
#bookmarksMenu menupopup > menuitem, #bookmarksMenu menupopup > menu {
margin-right: -20px !important;
}
で右にできた空白をつめて…
しかしサブフォルダポップアップしたら間が開いてしまった!
#bookmarksShowAll .menu-accel-container, #menu_bookmarkThisPage .menu-accel-container
もはみ出してしまう、これは泥沼っぽい。 ヤフー知恵袋の質問答えをFirefoxでコピーすると一行ずつ空いてしまうのを
cssで開かないようにできませんか MacならFirefox関係なくキーボードショートカットやAutomatorで出来るんだけどね。
ウィンドウズでも純正機能であるんじゃない? http://img3.imepic.jp/image/20220224/747280.png?424375ff6b6d908d0f209b17368c5ccd
PCでインスタ見てる人がいらっしゃったらご教授頂けたら幸いです
下記のようにしていたのですが動かなくなってしまいました
._1xMNo ._01UL2 .i0EQd {
width: 300px !important;
height: 500px !important;
}
._1xMNo ._01UL2 .i0EQd hr.W4P49 + div > div {
width: 300px !important;
height: 450px !important;
} >>916
これでどうだろう
._1xMNo,
._1xMNo ._01UL2 {
width: 300px !important;
height: 500px !important;
} >>917
本当にありがとうございます
微調整して上手くいきました
よい週末をお過ごしください! /* Gray icon on inactive tabs */
tab .tab-icon, .tab-icon-image, .tab-throbber {
filter: grayscale(1);
}
#TabsToolbar .tabbrowser-tab[selected] .tab-icon,
#TabsToolbar .tabbrowser-tab[selected] .tab-icon-image,
#TabsToolbar .tabbrowser-tab[selected] .tab-throbber {
filter: grayscale(0);
}
Firefox98にしたら↑の非選択タブのファビコンをグレーにするCSSが効かなくなりました
それに慣れ切ってしまっていたようで、タブの選択状態が分かりにくくなったし、
目にうるさくなって困っています。
修正分かる方いらっしゃいましたらよろしくお願いします。 98に更新したら
/* ファビコンのないサイトのタブに地球儀アイコンを表示 */
.tab-icon-image:not([src], [pinned], [crashed], [busy]) {
display: -moz-inline-box !important;
}
これが効かなくなった
他にも.tab-icon-imageを対象に取ったcssは全滅してるっぽい >>921
おー効くようになりました
ありがとうございます。
>>920これもいいですね。いただきました #searchbar { max-width:348px !important; }
で検索バーの幅を固定すると、右に少し余白ができてしまうのですが、どうやっても右にある戻るボタンとの間隔を狭められません。
良い方法を教えていただけると助かります。
よろしくお願いいたします。
https://i.imgur.com/fP7UkNY.png #search-container {max-width: 348px !important;}
常に幅を固定するなら min-width: 348px !important; を追加 >>924
ご回答ありがとうございます。
常に幅を固定ではなく、検索バーの右の戻るボタンとの余白を狭めたいのですが、min-widthを追加したところ、さらに余白が広くなってしまいました。 >>925
>>924でいけると思うけど
伸縮自在のスペース入ってるとか >>925
うちはこれでツールバーのアイコンの幅を詰めてる
#nav-bar toolbarbutton {padding-left:0px !important;padding-right:0px !important;} 皆さんありがとうございます。
min-widthを追加すると、このようにさらに余白が広くなってしまってます。
https://i.imgur.com/mRzedRM.png
伸縮自在のスペースは入れてません。
記述してあるすべてをのせておきます。
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
/* ツリー型タブ使用のため上部タブバーを非表示にする */
#TabsToolbar > * { visibility: collapse; }
/* #tabbrowser-tabs { visibility: collapse !important; } でも同様の効果 */
/* サイドバーヘッダー部を非表示にする */
#sidebar-header { display: none; }
/* #sidebar-header { visibility: collapse; } でも同様の効果 */
/* 検索バーのサイズ */
#searchbar { max-width:348px !important; min-width:348px !important; } フルスクリーン時の、タブ上の
「ツールバーを隠す」「全画面表示モードを終了」を消したいです
あくまでも「タブ上」のみです >>929
#searchbar { max-width:348px !important; min-width:348px !important; }
にしてますので変更はしていると思います。 表示するもんねーから右端に寄ってるとかジャネーノ?
右端に伸縮自在のスペースてーの入れてみたらどーよ >>934
ありがとうございます。
昔は検索バーを短くした分アドレスバーが長くなって、余白はない、という状態だったんですよね。 >>933
#searchbarではなく
#search-container >>936
ご指摘ありがとうございました。
無事改善されました。
改めまして、>>924 さんはじめ皆さま、本当に優しく接していただきありがとうございました。 @namespaceっていままでおまじないで書いててよくわかってなかったんだがもしかしていらない? >>939
なるほど
>>920が俺も出たんで外したんだがよくわからんままだった・・・ サイドバーの枠の点線がいつのまにか大きめになってるんですけど
これを以前のような細かい点線にすることは可能でしょうか?
可能でしたらお教え下さい。 ↑言葉足らずでした。
サイドバーのブックマークをクリックした時に出る点線の事です。
https://i.imgur.com/NxKqgfy.png
これを以前のような細かい点線にしたいです。 >>942
.sidebar-placesTreechildren::-moz-tree-row(selected) {
outline-width: thin !important;
} >>943
神!
こんなに早くお教え頂きありがとうございます。
無事細くなりました。 レス数が900を超えています。1000を超えると表示できなくなるよ。