🦊

Firefox で Chrome のように、オーディオ再生中に元アイコンが表示されるようにする

2024/09/22に公開

Caution

※ 以下の文章はリンクの要約
・リンク:https://chatgpt.com/share/66efc32a-3b28-8003-a57d-de70af5b9dd4
・また、Chromeと同じく、スピーカーアイコンを一番右に行かせたかったですが、上手くいきませんでした
・そのため、横に出してます
・loading時、重なって表示されてしまいます

やり方

・カスタムCSSを使う
・Firefoxでは、カスタムCSSを使ってタブやそのアイコンの見た目を変えられる

  1. 以下にアクセスし、 プロファイルフォルダー を開く(about:support内でプロファイルフォルダーで検索すれば出てくる)
about:support
  1. chrome という名前のフォルダーがない場合は、新しく作る
  2. 以下のファイル名のファイルを chrome フォルダー内に作る
userChrome.css
  1. 以下のコードを userChrome.css に書く
.tab-icon-image {
    display: block !important;   /* 元のアイコンを表示 */
    visibility: visible !important; /* 非表示にならないようにする */
    opacity: 1 !important;       /* 透明にならないようにする */
    z-index: 5 !important;       /* スピーカーアイコンより背面に配置 */
    position: relative !important; /* 相対位置に設定 */
    left: -5px !important;       /* アイコンの位置調整 */
}

/* スピーカーアイコンの調整 */
.tab-icon-overlay {
    left: 12px !important;  /* スピーカーアイコンを少し右にずらす */
    margin-right: 12px !important;
}
  1. 以下にアクセス
about:config
  1. 「動作保証外になります」と警告が出ますが、「注意して使用する」をクリック
  2. 検索ボックスに以下を入れ、「true」になっているか確かめる
toolkit.legacyUserProfileCustomizations.stylesheets
  1. false になっていたら、ダブルクリックして true に変える
  2. Restart Firefox

5~8

Firefox 69以降、カスタムCSSをEnableにするために必要らしい

GitHubで編集を提案

Discussion