diff --git a/chrome/click_selected_tab_to_focus_urlbar.css b/chrome/click_selected_tab_to_focus_urlbar.css index 030b80c..76c62b8 100644 --- a/chrome/click_selected_tab_to_focus_urlbar.css +++ b/chrome/click_selected_tab_to_focus_urlbar.css @@ -1,45 +1,60 @@ -/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/click_selected_tab_to_focus_urlbar.css made available under Mozilla Public License v. 2.0 +/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/selected_tab_as_urlbar.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ -/* Clicking selected tab selects focuses urlbar */ -/* Selected tab cannot be normally clicked (right-,middle- or left-clicked) EXCEPT from the tab icon */ +/* This is a horrible hack and absolutely requires click_selected_tab_to_focus_urlbar.css to work. In general it's pertty bad, but meh */ -/* Clicking selected pinned tab doesn't focus urlbar by default since I expect you might not want to change pinned tab address - see below */ +/* Also hides the nav-bar and shows main menu button next to window controls. And makes the selected tab expand a whole bunch */ +/* Whole bunch of z-indexing */ +#main-window > body > box{ position: relative; z-index: 1 } +.urlbar-input-box{ z-index: -1 !important; } +#urlbar{ z-index: auto !important; } +#alltabs-button, +#PanelUI-button, +#nav-bar-overflow-button{ z-index: 2; position: relative } +#PanelUI-button, +#nav-bar-overflow-button{ margin-top: -4px !important } -/* Make selected tab unclickable so click goes to the capture box, obviously it can't be clicked at all anymore */ -/* remove the :not([pinned]) bit to make clicking pinned tab AROUND the tab-icon focus urlbar*/ +:root[sizemode="normal"] #urlbar-container{ margin-inline: 40px !important; } -:root{ --tab-block-margin: var(--proton-tab-block-margin) } +#urlbar-input-container > :not(.urlbar-input-box){ opacity: 0 } -.tabbrowser-tab:not([pinned])[selected]{ pointer-events: none } - -/* Add back pointer-events to several elements so UI remains usable */ -/* The selected tab can be clicked normally from the icon */ -#tabbrowser-tabs toolbarbutton, -.tabbrowser-tab, -.tabbrowser-tab .tab-close-button, -.tabbrowser-tab .tab-icon-image{ - pointer-events: auto +#urlbar-background{ + background: transparent !important; + border: none !important; + box-shadow: none !important; } - -/* Invisible capture box behind tabs*/ -:root:not([customizing]) #urlbar-input-container::before{ - position: fixed; - display: block; - top: 0; - left: 0; - width: calc(100vw - 138px); - height: calc(var(--tab-min-height) + 2*var(--tab-block-margin)); - content: ""; -} -:root[sizemode="normal"]:not([customizing]) #urlbar-input-container::before{ left: 40px; width: calc(100vw - 138px -80px) } - -#urlbar-input-container:focus-within::before{ display: none !important; } - -/* Make tabs appear over the invisible box */ -:root:not([customizing]) #tabbrowser-tabs{ - position: relative; +.urlbarView{ + background: var(--lwt-toolbar-field-focus); + border: 1px solid var(--lwt-toolbar-field-focus-border-color) !important; z-index: 1; - pointer-events: none -} \ No newline at end of file + padding: 6px; + border-radius: 6px; + box-shadow: 0 0 26px #444; + left: 50vw; + margin-left: -50% !important; +} + +.tabbrowser-tab[selected][fadein]{ max-width: 100vw !important; min-width: 200px !important;} + +#navigator-toolbox:focus-within .tabbrowser-tab[selected] .tab-content{ + opacity: 0; +} +#navigator-toolbox:focus-within .tab-background[selected]{ + background-image: -moz-element(#urlbar-input) !important; + background-position: calc(var(--tab-inline-padding,4px) + 6px) 3px !important; + background-color: var(--lwt-toolbar-field-focus) !important; + background-size: auto !important; +} + +:root:not([customizing]) #titlebar{ margin-bottom: -40px } + +/* Oh and! also hide other buttons from the nav-bar because why not */ +#nav-bar-customization-target > :not(#urlbar-container){ visibility: collapse } +#TabsToolbar > .toolbar-items{ margin-right: 40px !important; } + +#nav-bar{ + padding-right: 138px; + box-shadow: none !important; + background-color: transparent !important; +} \ No newline at end of file