diff --git a/chrome/autohide_navigation_button.css b/chrome/autohide_navigation_button.css new file mode 100644 index 0000000..350ff19 --- /dev/null +++ b/chrome/autohide_navigation_button.css @@ -0,0 +1,33 @@ +/* Hides navigation-buttons (back/forward/stop/reload) buttons and shows them when cursor is over the right edge of urlbar */ +/* Disabled button are completely hidden, such as back-button when there is no page to go back to */ + +/* To set this up you need to customize the order of items to be such that layout from LEFT to RIGHT is +urlbar +flexible space +navigation-buttons in any order + */ +/* The order of items before urlbar and after navigation-buttons doesn't matter */ + +#nav-bar-customization-target > toolbarbutton.chromeclass-toolbar-additional[overflows="false"], +#nav-bar-customization-target > #stop-reload-button > #reload-button{ + margin-inline-start: -30px !important; + visibility:hidden; + transition: margin 66ms linear !important +} + +#nav-bar-customization-target > .chromeclass-toolbar-additional[overflows="false"]:hover, +#nav-bar-customization-target > .chromeclass-toolbar-additional[overflows="false"]:hover ~ .chromeclass-toolbar-additional[overflows="false"], +#nav-bar-customization-target > .chromeclass-toolbar-additional[overflows="false"]:hover ~ #stop-reload-button > #reload-button, +#nav-bar-customization-target > #urlbar-container + toolbarspring:hover ~ .chromeclass-toolbar-additional[overflows="false"], +#nav-bar-customization-target > #stop-reload-button:hover > #reload-button, +#nav-bar-customization-target > #urlbar-container + toolbarspring:hover ~ #stop-reload-button > #reload-button{ + margin-inline-start: 0px !important; + visibility: visible +} + +#nav-bar-customization-target > #downloads-button { margin-inline-start: 0px !important; visibility: visible !important; } + +#nav-bar-customization-target > toolbarbutton.chromeclass-toolbar-additional[overflows="false"][disabled], +#nav-bar-customization-target > #stop-reload-button > [disabled]{ display: none } + +#urlbar-container + toolbarspring{ max-width: 4px !important; min-width: 4px !important; } \ No newline at end of file