Shrink the Searchfield by 88% when not needed

dude99

Some people say the omnibar (or similar feature) is the dead of the ancient searchfield, it's a waste of pixels inside the Address bar. But some of us still prefer the accessibility of searchbox over the feature bloated omnibar. This mod is a tiny improvement to make the searchfield 88% smaller when not in use.

A. Always shrink it regardless of window size:

.toolbar-addressbar .searchfield:not(:focus-within):not(:hover) {max-width:30px;}
.toolbar-addressbar .searchfield:not(:focus-within):not(:hover) > * {max-width:1px;}

B. Only shrink it in normal window, cuz space is abundant when maximized:

#browser:not(.maximized) .toolbar-addressbar .searchfield:not(:focus-within):not(:hover) {max-width:30px;}
#browser:not(.maximized) .toolbar-addressbar .searchfield:not(:focus-within):not(:hover) > * {max-width:1px;}

Just mouseover, or focus on searchfield (Ctrl E) & it will expand into normal size. Simple no?

Have fun, enjoy!

dude99

Updated code with .toolbar-addressbar to excluded speedial's searchbox from shrinking.

Hadden89

@dude99 Nice mod

There are two down arrows when the search field is minimized.
I use this line to hide the second one
.toolbar-addressbar .searchfield:not(:focus-within):not(:hover) .button-addressfield.input-dropdown.search-history svg {display: none;}

dude99

@Hadden89 Oh, u can try width:0 for 2nd line to hide the big dropdown arrow too. I preferred the bigger one so i use width:1 to overly the big one over the smaller one.