From 467a53ee72e169a9cef54b8677738b71dffd1335 Mon Sep 17 00:00:00 2001 From: MrOtherGuy Date: Sun, 16 Jun 2024 12:00:20 +0300 Subject: [PATCH] use class instead of id selector for urlbar-input elements See bug 1610530 --- chrome/button_effect_scale_onclick.css | 4 ++-- chrome/button_effect_scale_onhover.css | 6 +++--- chrome/click_selected_tab_to_focus_urlbar.css | 6 +++--- chrome/compact_urlbar_megabar.css | 2 +- chrome/drag_window_from_urlbar.css | 6 +++--- chrome/fake_urlbar_dropmarker.css | 4 ++-- chrome/minimal_text_fields.css | 2 +- chrome/round_ui_items.css | 4 ++-- chrome/selected_tab_as_urlbar.css | 6 +++--- chrome/urlbar_info_icons_on_hover.css | 2 +- chrome/urlbar_popup_full_width.css | 4 ++-- 11 files changed, 23 insertions(+), 23 deletions(-) diff --git a/chrome/button_effect_scale_onclick.css b/chrome/button_effect_scale_onclick.css index 80e1fa6..6dba120 100644 --- a/chrome/button_effect_scale_onclick.css +++ b/chrome/button_effect_scale_onclick.css @@ -8,14 +8,14 @@ See the above repository for updates as well as full license text. */ .downloadIconShow > .button-box > .button-icon, .menuitem-iconic .menu-iconic-icon, #downloads-indicator-icon, -#urlbar-input-container [role="button"] image{ +.urlbar-input-container [role="button"] image{ transition: transform 83ms linear !important; } toolbar .toolbarbutton-1 > .toolbarbutton-icon{ transition: padding 83ms linear !important; } -#urlbar-input-container [role="button"]:active image, +.urlbar-input-container [role="button"]:active image, .tab-close-button:active, .downloadIconShow:active > .button-box > .button-icon, #downloads-button:active #downloads-indicator-icon, diff --git a/chrome/button_effect_scale_onhover.css b/chrome/button_effect_scale_onhover.css index c6e86fb..8509261 100644 --- a/chrome/button_effect_scale_onhover.css +++ b/chrome/button_effect_scale_onhover.css @@ -8,14 +8,14 @@ See the above repository for updates as well as full license text. */ .downloadIconShow > .button-box > .button-icon, .menuitem-iconic .menu-iconic-icon, #downloads-indicator-icon, -#urlbar-input-container [role="button"] image{ +.urlbar-input-container [role="button"] image{ transition: transform 83ms linear !important; } toolbar .toolbarbutton-1 > .toolbarbutton-icon{ transition: padding 83ms linear !important; } -#urlbar-input-container [role="button"] image, +.urlbar-input-container [role="button"] image, .tab-close-button, .downloadIconShow > .button-box > .button-icon, .unified-extensions-item-menu-button > .toolbarbutton-icon, @@ -32,7 +32,7 @@ toolbarbutton#scrollbutton-down > .toolbarbutton-icon{ transform: scale(-0.8) !i toolbar .toolbarbutton-1 > .toolbarbutton-icon{ padding: calc(var(--toolbarbutton-inner-padding) + 2px) !important; } -#urlbar-input-container [role="button"]:not([disabled]):hover image, +.urlbar-input-container [role="button"]:not([disabled]):hover image, .tab-close-button:hover, .downloadIconShow:hover > .button-box > .button-icon, #downloads-button:not([disabled]):hover #downloads-indicator-icon, diff --git a/chrome/click_selected_tab_to_focus_urlbar.css b/chrome/click_selected_tab_to_focus_urlbar.css index d9a4c2e..ae63689 100644 --- a/chrome/click_selected_tab_to_focus_urlbar.css +++ b/chrome/click_selected_tab_to_focus_urlbar.css @@ -38,7 +38,7 @@ See the above repository for updates as well as full license text. */ pointer-events: auto } /* Invisible capture box behind tabs*/ -:root:not([customizing]) #urlbar-input-container::before{ +:root:not([customizing]) .urlbar-input-container::before{ position: fixed; display: block; left: 0; @@ -48,11 +48,11 @@ See the above repository for updates as well as full license text. */ content: ""; pointer-events: auto; } -:root[tabsintitlebar]:not([customizing]) #urlbar-input-container::before{ +:root[tabsintitlebar]:not([customizing]) .urlbar-input-container::before{ left: var(--uc-window-drag-space-width); width: calc(100vw - var(--uc-window-control-width) - var(--uc-buttons-width) - 2 * var(--uc-window-drag-space-width)); } -#urlbar-input-container:focus-within::before{ display: none !important; } +.urlbar-input-container:focus-within::before{ display: none !important; } /* Make tabs appear over the invisible box */ :root:not([customizing]) #TabsToolbar-customization-target{ diff --git a/chrome/compact_urlbar_megabar.css b/chrome/compact_urlbar_megabar.css index 3d45cc0..b6b6fcb 100644 --- a/chrome/compact_urlbar_megabar.css +++ b/chrome/compact_urlbar_megabar.css @@ -24,7 +24,7 @@ See the above repository for updates as well as full license text. */ #urlbar-background{ animation: none !important; } -#urlbar-input-container{ +.urlbar-input-container{ padding: 0px 1px !important; height: initial !important; } diff --git a/chrome/drag_window_from_urlbar.css b/chrome/drag_window_from_urlbar.css index 7e82d38..4359a57 100644 --- a/chrome/drag_window_from_urlbar.css +++ b/chrome/drag_window_from_urlbar.css @@ -3,14 +3,14 @@ See the above repository for updates as well as full license text. */ /* Makes the window draggable from urlbar when urlbar is not focused. This means you can't click the urlbar text to activate it normally. But right-click works to activate urlbar. */ -.urlbar-input-box,#urlbar-input,#urlbar-scheme,#urlbar-container{ +.urlbar-input-box,.urlbar-input,#urlbar-scheme,#urlbar-container{ -moz-window-dragging: drag; cursor: default; } -#urlbar-input-container > box, +.urlbar-input-container > box, #page-action-buttons, #urlbar-container:focus-within, -#urlbar-container:focus-within :is(.urlbar-input-box,#urlbar-input,#urlbar-scheme,#urlbar-container){ +#urlbar-container:focus-within :is(.urlbar-input-box,.urlbar-input,#urlbar-scheme,#urlbar-container){ -moz-window-dragging: no-drag; cursor: auto; } \ No newline at end of file diff --git a/chrome/fake_urlbar_dropmarker.css b/chrome/fake_urlbar_dropmarker.css index 4ca146d..2aa712d 100644 --- a/chrome/fake_urlbar_dropmarker.css +++ b/chrome/fake_urlbar_dropmarker.css @@ -16,7 +16,7 @@ See the above repository for updates as well as full license text. */ opacity: 0; transition: opacity 150ms linear } -#urlbar-input-container:hover > #page-action-buttons::before{ opacity: 1 } +.urlbar-input-container:hover > #page-action-buttons::before{ opacity: 1 } .urlbar-input-box:not(:focus-within){ margin-inline-end: -24px; } -#urlbar-input:not(:focus-within){ padding-inline-end: 24px !important; } +.urlbar-input:not(:focus-within){ padding-inline-end: 24px !important; } .urlbar-input-box:focus-within ~ #page-action-buttons::before{ -moz-user-focus: normal } \ No newline at end of file diff --git a/chrome/minimal_text_fields.css b/chrome/minimal_text_fields.css index e93eee8..24be454 100644 --- a/chrome/minimal_text_fields.css +++ b/chrome/minimal_text_fields.css @@ -36,7 +36,7 @@ See the above repository for updates as well as full license text. */ #tracking-protection-icon-container:hover, #tracking-protection-icon-container ~ *:hover, #urlbar:focus-within > *, -#urlbar-input-container:focus-within > *, +.urlbar-input-container:focus-within > *, .searchbar-textbox:hover > *, .searchbar-textbox:focus-within > *{ opacity: 1 } diff --git a/chrome/round_ui_items.css b/chrome/round_ui_items.css index 302e405..43dfb3d 100644 --- a/chrome/round_ui_items.css +++ b/chrome/round_ui_items.css @@ -4,8 +4,8 @@ See the above repository for updates as well as full license text. */ /* Make bunch of things in the main UI round */ :root{ --toolbarbutton-border-radius: 24px !important } -#urlbar-input-container > box:hover, -#urlbar-input-container > box[open], +.urlbar-input-container > box:hover, +.urlbar-input-container > box[open], #main-menubar > menu, .titlebar-button:hover, #scrollbutton-up, diff --git a/chrome/selected_tab_as_urlbar.css b/chrome/selected_tab_as_urlbar.css index 341c24b..f10ddd6 100644 --- a/chrome/selected_tab_as_urlbar.css +++ b/chrome/selected_tab_as_urlbar.css @@ -14,19 +14,19 @@ See the above repository for updates as well as full license text. */ #PanelUI-button, #nav-bar-overflow-button{ z-index: 2; position: relative } -#urlbar-input-container{ +.urlbar-input-container{ width: calc(100vw - var(--uc-window-control-width) - var(--uc-buttons-width) - 2 * var(--uc-window-drag-space-width) - 76px) !important; left: calc(76px + var(--uc-window-drag-space-width)) !important; pointer-events: none; overflow: visible !important; } -:root:not([customizing]) #urlbar-input-container::before{ +:root:not([customizing]) .urlbar-input-container::before{ position: absolute; left: 0; top: 0 !important; height: var(--urlbar-container-height); } -#urlbar-input-container > :not(.urlbar-input-box){ opacity: 0 } +.urlbar-input-container > :not(.urlbar-input-box){ opacity: 0 } #urlbar-background{ background: transparent !important; diff --git a/chrome/urlbar_info_icons_on_hover.css b/chrome/urlbar_info_icons_on_hover.css index f506ffa..f677eee 100644 --- a/chrome/urlbar_info_icons_on_hover.css +++ b/chrome/urlbar_info_icons_on_hover.css @@ -14,7 +14,7 @@ See the above repository for updates as well as full license text. */ #identity-box.extensionPage{ max-width: 32px } -#urlbar:hover #urlbar-input-container > box, +#urlbar:hover .urlbar-input-container > box, #urlbar:hover #identity-box.extensionPage #identity-icon-label{ max-width: 300px; } diff --git a/chrome/urlbar_popup_full_width.css b/chrome/urlbar_popup_full_width.css index 8842c8f..1491934 100644 --- a/chrome/urlbar_popup_full_width.css +++ b/chrome/urlbar_popup_full_width.css @@ -36,9 +36,9 @@ See the above repository for updates as well as full license text. */ box-shadow: 0 1px 4px rgba(0,0,0,.05); } -#urlbar > #urlbar-input-container{ padding: 0px !important; width: auto !important; height: auto !important; } +#urlbar > .urlbar-input-container{ padding: 0px !important; width: auto !important; height: auto !important; } #urlbar > #urlbar-background{ display: none !important; } /* This may seem pretty weird, but it gets around an issue where the height of urlbar may suddenly change when one starts typing into it */ /* If you are otherwise modifying the urlbar height then you might need to modify the height of this too */ -#urlbar > #urlbar-input-container::before{ content: ""; display: flex; height: 24px; } +#urlbar > .urlbar-input-container::before{ content: ""; display: flex; height: 24px; }