[過去ﾛｸﾞ] userChrome.css・userContent.cssスレ Part14 (1002ﾚｽ)
上下前次1-新
このｽﾚｯﾄﾞは過去ﾛｸﾞ倉庫に格納されています｡
次ｽﾚ検索 歴削→次ｽﾚ 栞削→次ｽﾚ 過去ﾛｸﾞﾒﾆｭｰ
574: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲW 7fc1-4RwW) [sage] 2024/11/28(木) 12:22:35.95 ID:EPXD4VUp0(1) AAS
うお～どっちも133でヌルヌル動く!
ありが㌧
575: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ ff1f-wRxM) [sage] 2024/11/28(木) 14:39:47.89 ID:9dlOkopN0(1) AAS
>>572--uc-autohide-toolbar-delay: 200ms; /* The toolbar is hidden after 0.2s */
を1000msに書き換えることでほぼ望み通りになりました。ありがとうございます
（マウスオーバーとして感知する範囲をもう少し広げたい気もしたので
知識がないなりに適当に数字を変更してみましたができませんでしたｗ
まあこのままでもほぼ問題なく使えるのでこのまま使わせていただきます）
ちなみに自分の環境だと>>573氏のやり方だと動きがぎくしゃくしてしまいます
なんでだろう・・・・・
576: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 9f11-n0Sb) [] 2024/11/28(木) 16:46:07.47 ID:H02mbkW+0(1) AAS
128.5.0esr でメニュー、タブ、ナビゲーションツールバーの並び替え方法を教えて下さい
<toolbox id="navigator-toolbox"> ← この中の要素を並び替えたい
<vbox id="titlebar"> ← 要素1: 下2つをグループ化したもの
<toolbar id="toolbar-menubar"></toolbar> ← 要素1-1: ファイルや編集等のメニュー
<toolbar id="TabsToolbar"></toolbar> ← 要素1-2: タブ
</vbox>
<toolbar id="nav-bar"></toolbar> ← 要素2: 戻る進むボタンやURLを入力する場所
</toolbox>
要素1と要素2の並べ替え、もしくは要素1-1と要素1-2の並べ替えはorder指定で出来るのですが、
これを要素1-1、要素2、要素1-2の順に並べ替えたいのです
よろしくおねがいします
577: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 176c-dJoR) [sage] 2024/11/28(木) 17:21:13.48 ID:8ZbVWJKh0(1/5) AAS
Firefox133.0用サイドバーの自動開閉
ちょっと長いから分割する
/* サイドバーのカスタマイズ */
:root {
--thin-tab-width: 15px;
--wide-tab-width: 220px;
}
#sidebar-box {
position: relative !important;
overflow-x: hidden !important;
min-width: var(--thin-tab-width) !important;
max-width: var(--thin-tab-width) !important;
box-shadow: 0 0 2px 0 rgba(0,0,0,.35);
z-index: 1 !important;
transition: min-width 0.2s ease, max-width 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
#sidebar-box:hover {
min-width: var(--wide-tab-width) !important;
max-width: var(--wide-tab-width) !important;
box-shadow: 0 0 5px 0 rgba(0,0,0,.35);
transform: translateX(0);
}
578: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 176c-dJoR) [sage] 2024/11/28(木) 17:21:32.36 ID:8ZbVWJKh0(2/5) AAS
続き
#sidebar-box>#sidebar {
visibility: hidden !important; /* opacity -> visibility に変更 */
transform: translateX(-100%); /* 初期状態でサイドバーを隠す */
transition: visibility 0.2s, transform 0.2s ease; /* transformを使用 */
}
#sidebar-box:hover>#sidebar {
visibility: visible !important; /* hoverで表示 */
transform: translateX(0); /* スライドイン */
}
#sidebar-splitter {
cursor: ew-resize;
width: 5px;
background-color: #ccc;
}
579: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 176c-dJoR) [sage] 2024/11/28(木) 17:23:38.08 ID:8ZbVWJKh0(3/5) AAS
後は上手く短くしてくれ
580: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 176c-dJoR) [sage] 2024/11/28(木) 17:33:25.97 ID:8ZbVWJKh0(4/5) AAS
/* サイドバーを自動開閉するようにする （左側用）色々削ってみた*/
:root {
--thin-tab-width: 15px;
--wide-tab-width: 220px;
}
#sidebar-box {
position: relative !important;
overflow-x: hidden !important;
min-width: var(--thin-tab-width) !important;
max-width: var(--thin-tab-width) !important;
box-shadow: 0 0 2px 0 rgba(0,0,0,.35);
z-index: 1 !important;
transition: min-width 0.2s ease, max-width 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
#sidebar-box:hover {
min-width: var(--wide-tab-width) !important;
max-width: var(--wide-tab-width) !important;
box-shadow: 0 0 5px 0 rgba(0,0,0,.35);
transform: translateX(0);
}
#sidebar-box>#sidebar {
opacity: 0 !important;
}
#sidebar-box:hover>#sidebar {
opacity: 1 !important;
}
#sidebar-splitter {
}
581(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 176c-dJoR) [sage] 2024/11/28(木) 18:11:04.58 ID:8ZbVWJKh0(5/5) AAS
色々試したら
/* サイドバーを自動開閉するようにする （左側用）*/
使ってる人は
#sidebar-box:hoverの
margin-right: calc((var(--wide-tab-width) - var(--thin-tab-width)) * -1) !important;
これ削除で取り敢えず動く
只動くけどサイドバー開閉でとページが縮んだり元に戻り動くのでそこは誰か頼む
582: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ f76e-egXh) [sage] 2024/11/28(木) 21:22:26.80 ID:IXIbOctl0(1) AAS
>>572
ありがとうございます
1点確認したい事があります
ブックマークツールバーをマウスオーバーで表示させるのではなく常に表示させるにはどのように修正すればよいのか
教えて頂けないでしょうか
583: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ d758-cdGy) [sage] 2024/11/28(木) 21:39:31.94 ID:FigeybVf0(1) AAS
サイドバーのtransitionの仕様変わった？
下層までぐにゃっとなってキモいんだが
584: 名無しさん＠お腹いっぱい。 (ｵｲｺﾗﾐﾈｵ MMab-cwdt) [sage] 2024/11/28(木) 23:46:00.17 ID:HBRW54TeM(1) AAS
133になったらタブが上になっちゃったよ面倒くせー
585(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ f7cf-wRxM) [sage] 2024/11/29(金) 04:42:43.98 ID:vFolAiBf0(1) AAS
>>581
535ですが追加します
margin-right: calc((var(--wide-tab-width) - var(--thin-tab-width)) * -1) !important;
は削除せず
z-index: 1 !important; → z-index: 3 !important;
これで133でもサイドバー自動開閉OK、ページレイアウトの変化なし
あ、これも受け売りw
586: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ d7cf-NEce) [sage] 2024/11/29(金) 06:09:40.92 ID:ULqcIWjA0(1) AAS
>>585
おつかれ
z-index: 1 !important; → z-index: 3 !important;
これはこっち↓でも動いたわ
【Firefox】Firefox107でサイドバーを自動で開閉する ← 検索（NGワードでリンク貼れない）
587: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ ff44-wRxM) [sage] 2024/11/29(金) 08:42:15.01 ID:9s0laNB00(1) AAS
なんかURLバーにフォーカスしたら一番上に移動するようになったんだがなんだこれ
588: 名無しさん＠お腹いっぱい。 (ｽｯﾌﾟ Sdbf-9Nre) [sage] 2024/11/30(土) 00:12:03.86 ID:WeNbb2iDd(1/2) AAS
うーむ133にしたら#serchbar系もなんか変わってぽいな...
589: 名無しさん＠お腹いっぱい。 (ｽｯﾌﾟ Sdbf-9Nre) [sage] 2024/11/30(土) 00:14:44.89 ID:WeNbb2iDd(2/2) AAS
てかいろいろ変だ...
590: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 9f31-wRxM) [sage] 2024/11/30(土) 00:17:00.60 ID:v0wupYa00(1/2) AAS
すんません133に更新したら
ツールバーの並び順が効かなくなりました
分かる方いましたらよろしくです
/* ツールバーの並び順 */
#toolbar-menubar { order: 1; } /* メニューバー */
#nav-bar { order: 2; } /* ナビゲーションツールバー */
#titlebar { order: 3; } /* タブバー */
#PersonalToolbar { order: 4; } /* ブックマークツールバー */
591: 590 (ﾜｯﾁｮｲ 9f31-wRxM) [sage] 2024/11/30(土) 00:57:11.37 ID:v0wupYa00(2/2) AAS
解決いたしました
/* タブバーがツールバーの下に移動 */
/* ブックマークツールバーがタブバーの下に移動 */
#navigator-toolbox:not([tabs-hidden]) {
script, toolbar:not(#TabsToolbar,#PersonalToolbar) {
order: -1;
}
}
#TabsToolbar:not([collapsed="true"]) {
& > hbox.titlebar-buttonbox-container {
display: none;
}
}
#nav-bar {
&:not(.browser-titlebar) {
:root[tabsintitlebar] #toolbar-menubar[autohide="true"] ~ &,
:root[inFullscreen] #toolbar-menubar ~ & {
& > hbox.titlebar-buttonbox-container {
display: flex !important;
}
}
}
.titlebar-button {
padding-block: 0 !important;
}
}
592: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 17cf-hCSs) [sage] 2024/11/30(土) 05:02:14.36 ID:BcKYCGuI0(1) AAS
タブバーは #TabsToolbar
593(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 7758-RPwI) [sage] 2024/11/30(土) 22:26:09.19 ID:RfelKTAi0(1/2) AAS
/* ツールバー 並べ替え By.ChatGPT*/
/* navigator-toolbox内の要素を順番に整理 */
#navigator-toolbox {
display: flex;
flex-direction: column; /* 上から下に配置 */
}
/* メニューバーを最上位に配置 */
#toolbar-menubar {
order: 0; /* 一番上に表示 */
}
/* ナビゲーションツールバーをメニューバーの下に配置 */
#nav-bar {
order: 1; /* 2番目に表示 */
}
/* ブックマークツールバーをナビゲーションツールバーの下に配置 */
#PersonalToolbar {
order: 2; /* 3番目に表示 */
}
/* タブバーをブックマークツールバーの下に配置 */
#TabsToolbar {
order: 3; /* 最下部に表示 */
}
594: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 7758-RPwI) [sage] 2024/11/30(土) 22:26:25.07 ID:RfelKTAi0(2/2) AAS
/* 必要に応じてタイトルバーのボタンを非表示 */
.titlebar-buttonbox-container {
display: none !important;
}
595: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 9158-ODz4) [] 2024/12/01(日) 08:14:57.38 ID:l3kg1yYM0(1) AAS
CSSで多段タブを実現したい
596: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ f430-Q86W) [sage] 2024/12/01(日) 12:33:58.92 ID:WVaQGE/r0(1/2) AAS
Firefox ESR 128.5.1でタブの読み込みアニメーションを円グルグルにして使ってます
.tab-throbber[busy] {
background-image: url("chrome://global/skin/icons/loading.png") !important;
filter: grayscale(100%);
}
これでグルグルは表示されているんですが、grayscaleのgrayの部分を他の色名に変えると青色にしかならないです
例えばredとかgreeenとかにしても青くなります
グレーと青以外の色に変える方法ってありますか？
そもそも自分の使ってるスクリプトがおかしいんでしょうか？
ちなみにFirefox Release版だと上記スクリプト自体動いてくれないのでESRを使用しています
597(1): 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ 3ecf-LsAq) [sage] 2024/12/01(日) 12:48:01.28 ID:WBP+EqKz0(1) AAS
ピンク filter: hue-rotate(90deg);
角度を変えれば色相が変わる
いろいろ試せばいい
598: 名無しさん＠お腹いっぱい。 (ﾜｯﾁｮｲ f430-Q86W) [sage] 2024/12/01(日) 13:06:43.83 ID:WVaQGE/r0(2/2) AAS
>>597
ありがとうございます、色を変えられました
grayscaleのgrayって灰色の事じゃなかったんですね…恥ずかしい
上下前次1-新書関写板覧索設栞歴
あと 404 ﾚｽあります
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ AAｻﾑﾈｲﾙ
ぬこの手 ぬこTOP 0.020s