userChrome.css・userContent.cssスレ Part8
■ このスレッドは過去ログ倉庫に格納されています
userChrome.cssでタブバーを下に置いたら、ドラッグした時だけ全体が上にずりあがるんですが
直す方法ないですか？ YouTubeの再生速度変更ボタンを表示できたりしますか？ >>524
#TabsToolbar[movingtab] > #tabbrowser-tabs
や
#TabsToolbar[movingtab] + #nav-bar
あたりのmargintopやmarginbottomを0pxしたりーpx指定したりして調整してください >>525
cssではないけどアドオンのEnhancer for YouTubeどうかな >>527
こういうのがあるんですね
ありがとうございます >>524
うちの場合#TabsToolbar[movingtab]のunsetを11pxで調整できた
#TabsToolbar[movingtab] {
padding-bottom: unset !important;
} 多段タブを使うとドラッグで移動できないんですが、これって修正方法ありますか？ /* サイドバーの選択されたブックマークの色を変える */
#bookmarksPanel treechildren:-moz-tree-row(selected) {
background-color: #EEB0D0 !important;
}
60.0からこのcss動かなくなりました改善方法ないでしょうか firefox-treestyletab環境でサイドバーをマウスオーバーで開閉する様にしていますが
固定したタブが開閉に応じて動いてしまうのでなく開いた時に全体が現れる様に固定出来ますか？
今の記述内容は以下の通りです
:root {
--thin-tab-width: 32px;
--wide-tab-width: 230px;
}
#sidebar-box:not([sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"]) {
min-width: var(--wide-tab-width) !important;
max-width: none !important;
}
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"] {
position: relative !important;
transition: all 100ms !important;
min-width: var(--thin-tab-width) !important;
max-width: var(--thin-tab-width) !important;
}
#sidebar-box[sidebarcommand="treestyletab_piro_sakura_ne_jp-sidebar-action"]:hover {
transition: all 200ms !important;
min-width: var(--wide-tab-width) !important;
max-width: var(--wide-tab-width) !important;
margin-right: calc((var(--wide-tab-width) - var(--thin-tab-width)) * -1) !important;
} 「その他のツール」というボタンはこれで左に移動できました
#nav-bar-overflow-button {
-moz-box-ordinal-group: 0 !important;
}
#PanelUI-menu-buttonもいちばん左に移動させるにはどうしたらいいですか？ >>536
#PanelUI-menu-button じゃなくてその親の #PanelUI-menu
#nav-bar > * {
-moz-box-ordinal-group: 99 !important;
}
#nav-bar > #PanelUI-button {
-moz-box-ordinal-group: 1 !important;
}
#nav-bar > #nav-bar-overflow-button {
-moz-box-ordinal-group: 2 !important;
}
-moz-box-ordinal-group の値は 1 以上の整数
0 でも一応動くけど厳密には不可なので、このようにしている
おまけ
/* オーバーフローボタンの矢印 >> を反転 << */
#nav-bar > #nav-bar-overflow-button > .toolbarbutton-icon {
transform: rotate(180deg) !important;
} メニューバーを右クリックした時に出るメニュー内の区切り線の消し方が知りたいです。
ちょうど ツールバーから削除 と メニューバー の間にある区切り線です。 >>539
#toolbar-context-menu > menuseparator:not(#viewToolbarsMenuSeparator) {
visibility: collapse !important;
} Google検索で出てくる「プライバシー診断を受けてみよう」を非表示にするcss知りたいです >>544
ありがとうございました
それでいけました cssでツールチップを半透明にするがツールバーなどに配置したアイコンは標準の白のままなんですけれども
ツールバーメニューバーなどのアイコン等のツールチップも変更する方法ありましたらお願いします
https://i.imgur.com/9nvuYxq.png
/* ツールチップを半透明にする */
tooltip {
-moz-border-radius: 10px !important;
-moz-opacity: 0.9 !important;
font: message-box !important;
color: #ffffff !important;
padding: 3px !important;
border-radius: 8px !important;
-moz-appearance: none !important;
background-color: transparent !important;
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABmJLR0QA/wD/AP+gvaeTAAAAGElEQVR42mNkYGBYxkAEYGIgEowqpI5CABjxALr+NPKCAAAAAElFTkSuQmCC") !important;
border: 1px solid #666666 !important;
} Fx 61.0b14をダークテーマで使っています。
サイドバーをダークテーマと同じ色調に変えたくて、ぐぐりました。
ttp://swan-match.hatenablog.com/entry/2017/11/25/020656
こちらのサイトにあるようにuserChrome.cssに記入してみたのですが、
うまくいきません。たとえばブックマークフォルダの色が隠れてしまいます。
全体的に不自然なところが散見されます。
ご教示いただければ嬉しいです。わかる方いらっしゃいましたら、よろしくお願いします。 >>547
/* ブックマークフォルダのアイコンに色を */
.bookmark-item[container],
treechildren::-moz-tree-image(container) {
fill: #FCFCFC !important;
}
色は#FCFCFCを好みで変えて
こちらのダークテーマ参考にしたらいいかも
GitHub - Izheil/Firefox-57-full-dark-theme-with-scrollbars
https://github.com/Izheil/Firefox-57-full-dark-theme-with-scrollbars >>548
ブックマークフォルダの視認性があがって識別が容易になりました。
感謝します。ありがとうございました。 Ublock Originにダークテーマ適用したいんだが
>>548ヤツ使ってaddons.cssにTYPE-UUID-OF-UBLOCK-ORIGIN-HEREこいつを弄るみたいですが
UUIDってどこを参照すれば良いのだろうか？
どなたか馬鹿なオレに教えてください about:debuggingでID調べろって書いてあったわ
すまない Firefox60.0.2の環境下でmouseGesture2.4.2.uc.jsでのジェスチャーで、タブの複製だけが
『TypError:aParams is null』ってエラーが出てきて出来ないんだけど、
どう直したらいいか教えてもらえないでしょうか？
// タブの複製
case "Rda": openNewTabWith(gBrowser.currentURI.spec, null, null, null, false); break; Firefox userChrome.js greasemonkeyスクリプトスレと間違えました
お騒がせしました タブの高さを変更しています
タブをドラッグしたときブラウザ自体は調整してあり動きませんが
タブバーに配置したアドオンなどのボタンが動きます
画像上側がタブをドラッグした時
下が通常時です
https://i.imgur.com/MXFwgnr.png
タブバーのボタンを動かなくする方法はないでしょうか？ >>555
細くしてるなら細くしてるCSSも貼ったほうが良いよ
#TabsToolbar .toolbarbutton-1 .toolbarbutton-badge-stack {
padding: 0 var(--toolbarbutton-inner-padding) !important;
}
どう？ >>556
ありがとうございます 遅くなりました まだいくらか上方に動きます
こんな感じです
https://i.imgur.com/cO79f49.png
cssはこれらを利用していました
/* タブバーを細くする */
#TabsToolbar > #tabbrowser-tabs,
#TabsToolbar > #tabbrowser-tabs > arrowscrollbox {
min-height: 30px !important;
max-height: 30px !important;
}
/* remove 'dragging tab' margin/padding nonsense タブを動かしたときにブラウザが動くのを調整 */
#TabsToolbar[movingtab] {
padding-bottom: 15px !important;
}
#TabsToolbar[movingtab] > .tabbrowser-tabs {
padding-bottom: unset !important;
margin-bottom: unset !important;
}
#TabsToolbar[movingtab] + #nav-bar {
margin-top: unset !important;
} /* toolbar order 下に置く(start) ************************************/
#print-preview-toolbar,
#printedit-toolbar,
#titlebar {
-moz-box-ordinal-group: 0 !important;
}
#navigator-toolbox #toolbar-menubar {
-moz-box-ordinal-group: 1 !important;
}
/* navigation toolbar */
#navigator-toolbox #nav-bar {
-moz-box-ordinal-group: 2 !important;
}
/* bookmarks toolbar */
#navigator-toolbox #PersonalToolbar {
-moz-box-ordinal-group: 3 !important;
}
/* 3rd party toolbars */
#navigator-toolbox toolbar {
-moz-box-ordinal-group: 10 !important;
}
/* tabs toolbar */
#navigator-toolbox #TabsToolbar {
-moz-box-ordinal-group: 100 !important;
} >>557
なるほどなるほど
分からん(CSS素人)
タブバーにアイコン置くことなかったから動くのに気づいたら俺も気になってきた
玄人頼む >>559
どもです
あちこちググってみたらFirefox57向けのcssを見つけまして
これだとタブバーに配置したボタンが動かなかったのでこれでいくことにしました
どうもありがとうございました
/* タブの高さ */
.tabbrowser-tabs .tabbrowser-tab {
vertical-align: top !important;
-moz-box-sizing: border-box !important;
min-height: 25px !important;
max-height: 25px !important;
} >>559
すいません
.tabbrowser-tabsではなく#tabbrowser-tabsでした
それからこのcssはタブの高さを変更するだけでタブバーはそのままでした
タブをタブバーより高くしたときにはタブバーも太くなりますが
それなのでタブバーを細くしたときにボタンが動くのは解決しませんでした >>557
#TabsToolbar[movingtab] > toolbarbutton { margin-bottom: -15px !important; } >>562
ありがとうございます
タブバーを細くするcss利用してもボタンが動かなくなるよう調整できました！！ 下記が効かなくなった、61.0からかな？
/*** リンク文字列のマウスオーバーでBottomにURLを表示しない ***/
@-moz-document url(chrome://browser/content/browser.xul) {
statuspanel[type="overLink"] {
display: none !important;
}
} 61.0からだと思うけど、下記でブックマークメニューで黄色にならない。
ブックマークツールバーは黄色になる。
どう修正すれば良いの？
/***ブックマークメニューとブックマークツールバーのフォルダアイコンを以前の黄色に戻す***/
/* ブックマークメニュー */
@-moz-document url(chrome://browser/content/bookmarks/bookmarksPanel.xul) {
treechildren::-moz-tree-image(title, container),
treechildren::-moz-tree-image(title, open) {
list-style-image: url("chrome://global/skin/icons/folder-item.png")!important;
-moz-image-region: rect(0px, 32px, 16px, 16px)!important
}
}
/* ブックマークツールバー */
.bookmark-item > .toolbarbutton-icon,
menu.bookmark-item:not([query]):not([label="ブックマークツールバー"]):not([label="他のブックマーク"]) {
list-style-image: url("chrome://global/skin/icons/folder-item.png") !important;
-moz-image-region: rect(0px, 32px, 16px, 16px) !important;
} >>567
ブックマークサイドバーのURLが変わっている
@-moz-document url("chrome://browser/content/places/bookmarksSidebar.xul") { >>568
もしよろしければ履歴のURLも教えて頂けませんか
chrome://browser/content/history/history-panel.xul >>569
@-moz-document url(chrome://browser/content/bookmarks/bookmarksPanel.xul), 下記がいつからか一番上に表示されなくなった。
どう修正すれば良いの？
/*** コンテキストメニューSwift Selection Searchを一番上へ ***/
#jid1-kdtticj6wxvafa_jetpack_sss {
-moz-box-ordinal-group: 0 !important;
} ちなみに62で
chrome://global/skin/icons/folder-item.png
が削除されるので>>429を今のうちにやっておくと後で混乱しなくていいかも 61にしたらサイドバーの背景がもとに戻ってしまった。
なにか変更になったのでしょうか？背景黒にしていたのですが。 >>575
そりゃ変更があったから背景が変わったんだろうなぁ
元々適用していたCSSすら出してないから雑談にしかならないけどな リンク先のurlなどが表示されるステータスバーを昔のFxみたいにページ下に表示する方法を教えて下さい >>579
これをgoogleで検索する→ Status-4-Evarもどき(Firefox57から)
.statuspanel
.statuspanel-inner
.statuspanel-label
css内の上の記述を下のに書き換える
#statuspanel
#statuspanel-inner
#statuspanel-label >>580
横からだけど Status-4-Evarもどき を以前から使っていてFirefox61.0でうまく動かなかったのが解決しました
ありがとう！ 便乗質問
Firefox61.0で Status-4-Evarもどき の メニューバーVer を使っているのですが
アドオンのアイコンをステータスバーに配置すると下にずれてしまってアイコンの上半分しか表示されません
（履歴や印刷のアイコンは普通に表示されます）
これを解決する方法を教えてください よろしくお願いします >>582
google検索でこれを検索→ メニューバーに置いたアイコンを右寄せにしたい
このcssを有効にするとボタンがちゃんと表示されると思う
うちの環境だけだったらごめん
長いURLだとアドレスがボタンに重なり見えないし見栄えも悪いので自分はこんな感じにしている
cssの下から11行目以下をこのように
フォントサイズは12か13で。ステータスバーもどきの高さを変更してるならborder: 3pxの値を変えればいいです
#main-window:not([inFullscreen]) #statuspanel-label {
background: transparent !important;
border: 3px solid #666666 !important;
padding: 0px !important;
font-size: 1px !important;
color: #fff !important;
margin-bottom: 0px !important;
background-color: rgba(51, 51, 51, 0.625) !important; >>584
>>582 です
メニューバーに置いたアイコンを右寄せにしたい で上手くいきました
ありがとうございました！ >>584
cssの下から11行目以下ってStatus-4-Evarもどき メニューバーVerのcssね >>580
その部分書き換えたら直ったよありがとうございます
もう一つ下記のやつが動作しないんだけど修正箇所分かる人居たら教えて下さい
/*** Swift Selection Searchを一番上へ ***/
#jid1-kdtticj6wxvafa_jetpack_sss {
-moz-box-ordinal-group: 0 !important;
}
ファイル名に_sss無かったから抜いてみても駄目だった >>587
Fx60からは拡張idの後に-menuitem-が入るようになった
#jid1-kdtticj6wxvafa_jetpack-menuitem-_sss >>588
ググってもそれらしい情報見つからなくて困ってた所助かりました
皆どっから情報仕入れてるんだろう cssのSearch Bar Show Engine Namesとuc.jsのShowSearchBarHistroryByClick.uc.jsを組み合わせると
検索履歴が半行くらいでしか表示されなくなるの打つ手無い？ 豆腐さんにあるuAutoPagerizeの区切り線など利用しています
デフォの黒いバーが消えないんですが消す方法ないでしょうか
.autopagerize_page_separator {
display: none;
} 「豆腐さんにあるuAutoPagerizeの区切り線」とは何なのか、uAutoPagerizeはuc.js版なのかアドオン版なのか
最低限の情報が足りてなさ過ぎだろ アドオン版だという前提で言うと、そもそもデフォの黒いバーなんてない >>594
申し訳ないですuc.js版があるのは知りませんでした
アドオンのuAutoPagerizeです
https://addons.mozilla.org/ja/firefox/addon/uautopagerize/?src=search
豆腐さんのuAutoPagerizeの区切り線はこのページのV2Cで分断されたURLを結合するの次にあります
貼れないのでURL分割してあります
http://tofukko.blog113. fc2.com/page-1.html
スクリーンショットの赤い矢印で示した黒い横線です
uAutoPagerizeが動作するページはすべてこの線が出ます
https://i.imgur.com/e7BaasU.png
このページはYahoo検索です
uAutoPagerizeの区切り線と元々の黒の線と二本あります
https://i.imgur.com/3jWWFsP.png !important付けてみればいいんじゃね？
pageの前にあるタイルは何よ >>597
後出しですいません!important付けないとcssが働かないので付けてました
pageの前にあるタイルというのはuAutoPagerizeの緑のアイコンのことでしょうか？
これはデフォであるものだと思いますけど
クリックするとグレーアウトしuAutoPagerizeの動作を停止させたりできるようになってます すまん、ボケてたuの方か
uAutoPagerize+stylusで黒線消えるけどなぁ >>599
userContent.cssに記入してましたが
Stylishでやってみたら消えました
いろいろとありがとうございました 未読タブの文字に着色できなくなったのかよ。なんてこった…
裏技ありますか？ それ助かるけど既存タブをバックグラウンドでリロードしたときに反映されないのが残念 リンク先のurlなどが表示される左下のポップアップ、Status-4-Evarもどきを利用すると移動できるみたいですが、URLバーに表示させるようにはできませんか？
以前は拡張のLink Location Barを使用していて対応していたのですが、使えなくなってしまったので、もしCSSで対応できるならやりかたを教えてください >>605
ttps://userstyles.org/styles/96269/topstatuspanel-in-the-locationbar >>606
紹介どうもありがとうございます
でもこのCSSインストールできますか？
なんかインストールのボタンを押しても無反応で駄目なんです
自分だけでしょうか？ >>607
下にスクロールすると出てくるShow CSS Codeをクリックすると
ソースが表示されるからそれをコピペ
あと最新のFirefoxだと
.statuspanelを
#statuspanelに置き換えるはず >>608
修正箇所まで教えてくれてどうもありがとう
今はちょっと試せないのであとでやってみますね ロケーションバーcss動くのかな？
57より前のだよね う〜ん、>>606をいろいろ弄ってみたのですが、>>610さんが言うようにfirefox61だと動かないんですかね？ >>606も書き換えるのは>>580と同じだけど
一番上は.付いてないstatuspanelの間違いね >>612
どうもありがとう修正できました！
でもこのCSSって、ロケーションバーに上書きでポップアップを表示させるんですね
URLの代わりに表示させるのは現状のfirefoxだと難しいのかな？
拡張も未対応になったみたいだし 下記でタブの高さを調整したとき、タブ名が上端に位置するのですが、中央に表示するにはどう記述すれば良いのでしょうか？
.tabbrowser-tab:not([pinned]) {
min-height: 30px !important;
max-height: 30px !important;
} 検索バーのポップアップの背景色をゼブラ表示にさせるcssなんですが、修正箇所教えてくれませんか？
以前に拾ったときはこんな感じだったのですが
.autocomplete-treebody::-moz-tree-row(even) {
background-color: #eeeeee ;
}
よろしくお願いします。 >>614
タブの高さは変わるけどタブバーの高さは変わらないcssだよね
タブのタイトルはタブの中央にちゃんと位置してると思うよ >>615
.autocomplete-richlistitem:nth-of-type(even) {
background-color: #eee !important;
}
これだとロケーションバーのリストにも適用される
もし検索バーだけにしたければ
#PopupSearchAutoComplete .autocomplete-richlistitem:nth-of-type(even) {
background-color: #eee !important;
} >>617
お〜これでロケーションバーも見やすくなって助かります！
どうもありがとう！！ >>616
レスありがとう。
タブの高さ＝タブバーの高さと思っていた。
下記でほぼ中央に位置しました。
#TabsToolbar { margin-left: -38px !important; min-height: 33px !important; height: 33px !important;}
.tabbrowser-tab:not([pinned]) {
min-height: 38px !important;
max-height: 38px !important;
}
タブバーにツールボタンを配置してます。
ツールボタンを配置しなかったら、タブの高さ＝タブバーの高さで設定すれば良いのでしょうか？ 去年から火狐がHDDを100%アクセスする事態が頻発していた原因が何となく分かった。 >>621
自分もタブバーにいくつかボタン置いてるけど
どのcssを利用するかは好みなんじゃないのかな
とりあえず
タブバーの高さを変える（太く・細くする）のは>>557にあります
タブをドラッグしたときタブバーに置いたアイコンが動くのを調整は>>562
>>562さんあらためて感謝です ■ このスレッドは過去ログ倉庫に格納されています
