firefoxのURLバーをクリック (フォーカス) すると拡大するのを無効にしたい

投稿者: Anonymous

新しいFirefoxだとURLバーをクリックするとURLバーが広がってしまいます。
オプションと about:config を検索しましたがそれでもURLバーの拡大を無効にする仕方は書かれていませんでした。
どうやってこれを拡大しないようにできますか?

あとこういうのの設定をどこでいじるかはどうやって調べればいいですか?

画像の説明をここに入力

画像の説明をここに入力

解決

Firefox 77 では browser.urlbar.update1 オプションによる当該機能のオプトアウトが行えません[1]。よって、別の方法を用いる必要があります。ここでは Firefox Support Forum の投稿を参考に、 userChrome.css を使用する方法を紹介します。

もし userChrome.css を使用したことがない場合は、事前に以下の手順を実行してください。

  1. about:config にて toolkit.legacyUserProfileCustomizations.stylesheetstrue に設定する
  2. about:support で表「アプリケーション基本情報」にある項目「プロファイルフォルダー」の「フォルダーを開く」ボタンをクリックする
  3. 開いたディレクトリに chrome というディレクトリを作成する
  4. chrome ディレクトリに userChrome.css ファイルを作成する

以上の手順を完了したら、次に Megabar – Configuring and Styling the Firefox 75 Address Bar というサイトで、アドレスバーの拡大に関する userChrome.css 用の装飾を取得します。今回検証のために取得した装飾は、以下のようになっています。最後に、この装飾を先ほどの手順で作成した userChrome.css ファイルにコピーし、ファイルを保存した後に Firefox を再起動することで、作業は完了です。

_x000D_

_x000D_

/*** Megabar Styler General - version 2020-04-19 ***/_x000D_
_x000D_
_x000D_
_x000D_
  /*** General Preferences ***/_x000D_
_x000D_
  :root {_x000D_
_x000D_
    /* Number of pixels of enlargement when URL bar is focused */_x000D_
_x000D_
    --mbarstyler-popout-pixels: 0px; /* [0px - 7px] */_x000D_
_x000D_
_x000D_
_x000D_
    /* Top Bar Display or Not */_x000D_
_x000D_
    --mbarstyler-top-bar-display: block; /* [block,none] */_x000D_
_x000D_
_x000D_
_x000D_
    /* Font sizes (default: 13.8px for title, 10.2px for URL) */_x000D_
_x000D_
    --mbarstyler-title-font-size: 15px; /* [13px - 18px] */_x000D_
_x000D_
    --mbarstyler-url-font-size: 13px; /* [12px - 16px] */_x000D_
_x000D_
_x000D_
_x000D_
    /* Rows to show without scrolling */_x000D_
_x000D_
    --mbarstyler-max-rows-without-scrolling: 10;_x000D_
_x000D_
_x000D_
_x000D_
    /* Bottom border for each result row */_x000D_
_x000D_
    --mbarstyler-bottom-border-width: 0px; /* [0px or 1px] */_x000D_
_x000D_
    _x000D_
_x000D_
    /* Match display style */_x000D_
_x000D_
    --mbarstyler-match-weight: 700; /* [400,700] */_x000D_
_x000D_
    --mbarstyler-match-background-opacity: 0.0; /* [0.0,0.05,0.1] */_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /*** URL bar enlargement or lack thereof ***/_x000D_
_x000D_
_x000D_
_x000D_
  /* Compute new position, width, and padding */_x000D_
_x000D_
  #urlbar[breakout][breakout-extend] {_x000D_
_x000D_
    top: calc(5px - var(--mbarstyler-popout-pixels)) !important;_x000D_
_x000D_
    left: calc(0px - var(--mbarstyler-popout-pixels)) !important;_x000D_
_x000D_
    width: calc(100% + (2 * var(--mbarstyler-popout-pixels))) !important;_x000D_
_x000D_
    padding: var(--mbarstyler-popout-pixels) !important;_x000D_
_x000D_
  }_x000D_
_x000D_
  [uidensity="compact"] #urlbar[breakout][breakout-extend] {_x000D_
_x000D_
    top: calc(3px - var(--mbarstyler-popout-pixels)) !important;_x000D_
_x000D_
  }_x000D_
_x000D_
  [uidensity="touch"] #urlbar[breakout][breakout-extend] {_x000D_
_x000D_
    top: calc(4px - var(--mbarstyler-popout-pixels)) !important;_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /* Prevent shift of URL bar contents */_x000D_
_x000D_
  #urlbar[breakout][breakout-extend] > #urlbar-input-container {_x000D_
_x000D_
    height: var(--urlbar-height) !important;_x000D_
_x000D_
    padding: 0 !important;_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /* Do not animate */_x000D_
_x000D_
  #urlbar[breakout][breakout-extend] > #urlbar-background {_x000D_
_x000D_
    animation: none !important;;_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /* Remove shadows */_x000D_
_x000D_
  #urlbar[breakout][breakout-extend] > #urlbar-background {_x000D_
_x000D_
    box-shadow: none !important;_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /*** Top "Blue Bar" Display ***/_x000D_
_x000D_
_x000D_
_x000D_
  .urlbarView-row:first-of-type {_x000D_
_x000D_
    display: var(--mbarstyler-top-bar-display) !important;_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /*** Font Sizes and Scrolling ***/_x000D_
_x000D_
_x000D_
_x000D_
  /* Title font-size */_x000D_
_x000D_
  .urlbarView-row .urlbarView-title {_x000D_
_x000D_
    font-size: var(--mbarstyler-title-font-size) !important;_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /* URL / action font-size */_x000D_
_x000D_
  .urlbarView-row .urlbarView-secondary,_x000D_
_x000D_
  .urlbarView-row .urlbarView-url,_x000D_
_x000D_
  .urlbarView-row .urlbarView-action {_x000D_
_x000D_
    font-size: var(--mbarstyler-url-font-size) !important;_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /* Set max-height for items visible without scrolling */_x000D_
_x000D_
  #urlbarView-results, #urlbar-results {_x000D_
_x000D_
    height: unset !important;_x000D_
_x000D_
    max-height: calc(2.5 * (var(--mbarstyler-title-font-size) + var(--mbarstyler-bottom-border-width)) * var(--mbarstyler-max-rows-without-scrolling)) !important;_x000D_
_x000D_
  }_x000D_
_x000D_
  #urlbar-results {_x000D_
_x000D_
    overflow-y: auto !important; _x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /* Clean up extra spacing at the top and bottom */  _x000D_
_x000D_
  #urlbar-results {_x000D_
_x000D_
    padding-top: 0 !important;_x000D_
_x000D_
    padding-bottom: 0 !important;_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /* Subtle border between results */_x000D_
_x000D_
  .urlbarView-row:not(:last-of-type) {_x000D_
_x000D_
    border-bottom: var(--mbarstyler-bottom-border-width) solid rgba(0, 0, 0, 0.1) !important;_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /* Match Styling Like Fx43-47 */_x000D_
_x000D_
  [lwt-popup-darktext] .urlbarView-row:not([selected]) .urlbarView-title strong,_x000D_
_x000D_
  [lwt-popup-darktext] .urlbarView-row:not([selected]) .urlbarView-url strong {_x000D_
_x000D_
    font-weight: var(--mbarstyler-match-weight) !important;_x000D_
_x000D_
    box-shadow: inset 0 0 1px 1px rgba(0, 0, 0, calc(var(--mbarstyler-match-background-opacity) * 2));_x000D_
_x000D_
    background-color: rgba(0, 0, 0, var(--mbarstyler-match-background-opacity));_x000D_
_x000D_
    border-radius: 2px;_x000D_
_x000D_
  }_x000D_
_x000D_
  [lwt-popup-brighttext] .urlbarView-row:not([selected]) .urlbarView-title strong,_x000D_
_x000D_
  [lwt-popup-brighttext] .urlbarView-row:not([selected]) .urlbarView-url strong {_x000D_
_x000D_
    font-weight: var(--mbarstyler-match-weight) !important;_x000D_
_x000D_
    box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, calc(var(--mbarstyler-match-background-opacity) * 2));_x000D_
_x000D_
    background-color: rgba(255, 255, 255, var(--mbarstyler-match-background-opacity));_x000D_
_x000D_
    border-radius: 2px;_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
/*** End of: Megabar Styler General ***/_x000D_
_x000D_
_x000D_
_x000D_
/*** Megabar Styler Two-Row Flex Layout - version 2020-04-12 ***/_x000D_
_x000D_
_x000D_
_x000D_
  /* !!! Requires variables from Megabar Styler General !!! */_x000D_
_x000D_
_x000D_
_x000D_
  /* Adjust heights for scrolling */_x000D_
_x000D_
  #urlbarView-results, #urlbar-results {_x000D_
_x000D_
    max-height: calc(1.625 * (var(--mbarstyler-title-font-size) + var(--mbarstyler-url-font-size) + var(--mbarstyler-bottom-border-width)) * var(--mbarstyler-max-rows-without-scrolling)) !important;_x000D_
_x000D_
  }_x000D_
_x000D_
    /* Wrap the url (adapted from Fx75 narrow bar design) */_x000D_
_x000D_
  .urlbarView-row-inner {_x000D_
_x000D_
    flex-wrap: wrap !important;_x000D_
_x000D_
    padding-top: 0 !important;_x000D_
_x000D_
    padding-bottom: 2px !important;_x000D_
_x000D_
  }_x000D_
_x000D_
  .urlbarView-no-wrap {_x000D_
_x000D_
    max-width: 100% !important;_x000D_
_x000D_
    flex-basis: 100% !important;_x000D_
_x000D_
    position: relative;_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /* Adjust horizontal and vertical URL position */_x000D_
_x000D_
  .urlbarView-row[has-url] > .urlbarView-row-inner > .urlbarView-url {_x000D_
_x000D_
    padding-inline-start: calc(6px + 2px + /* favicon */ 16px) !important;_x000D_
_x000D_
    margin-top: calc(2px + (var(--mbarstyler-url-font-size) - var(--mbarstyler-title-font-size)));_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /* Hide the separator if there's a URL */_x000D_
_x000D_
  .urlbarView.megabar[actionoverride] .urlbarView-row[has-url] .urlbarView-title-separator,_x000D_
_x000D_
  .urlbarView.megabar .urlbarView-row[has-url]:not([type$=tab]) .urlbarView-title-separator,_x000D_
_x000D_
  .urlbarView.megabar .urlbarView-row[type=remotetab]:-moz-any(:hover, [selected]) .urlbarView-title-separator {_x000D_
_x000D_
    display: none !important;_x000D_
_x000D_
  }_x000D_
_x000D_
_x000D_
_x000D_
  /* Move Switch Tab info to URL line :: added 2020-04-12 */_x000D_
_x000D_
_x000D_
_x000D_
    /* Make sure URL is always visible */_x000D_
_x000D_
    .urlbarView-row[type="switchtab"][has-url="true"] .urlbarView-url {_x000D_
_x000D_
      visibility: visible !important;_x000D_
_x000D_
    }_x000D_
_x000D_
    /* Show Switch to Tab or Open depending on [actionoverride] */_x000D_
_x000D_
    .urlbarView:not([actionoverride]) .urlbarView-row[type="switchtab"][has-url="true"] .urlbarView-url::before {_x000D_
_x000D_
      content: "Switch to Tab: ";_x000D_
_x000D_
      font-style: italic;_x000D_
_x000D_
      color: var(--urlbar-popup-action-color);_x000D_
_x000D_
    }_x000D_
_x000D_
    .urlbarView[actionoverride] .urlbarView-row[type="switchtab"][has-url="true"] .urlbarView-url::before {_x000D_
_x000D_
      content: "Open: ";_x000D_
_x000D_
      font-style: italic;_x000D_
_x000D_
      color: var(--urlbar-popup-action-color);_x000D_
_x000D_
    }_x000D_
_x000D_
    /* Hide the existing Action phrase and separator */_x000D_
_x000D_
    .urlbarView-row[type="switchtab"][has-url="true"] .urlbarView-action,_x000D_
_x000D_
    .urlbarView-row[type="switchtab"][has-url="true"] .urlbarView-title-separator {_x000D_
_x000D_
      display: none !important;_x000D_
_x000D_
    }_x000D_
_x000D_
_x000D_
_x000D_
/*** End of: Megabar Styler Two-Row Flex Layout ***/

_x000D_

_x000D_

_x000D_

再起動後にアドレスバーへフォーカスすると、アドレスバーの拡大がされていないことがわかります。以下に私の環境での動作例を示します。

フォーカス前
フォーカスをする前のアドレスバーはuserChrome.cssを適用する前と同じ外観に見える

フォーカス後
フォーカスをするとアドレスバーは拡大せず、アドレスバーの周囲の灰色の線が青色の線に変化する


参考:

回答者: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *