firefox search bar show engine names (firefox 43 ... search...oct 04, 2017 · 2015-12-24 added...

Firefox Search Bar Show Engine Names (Firefox 43+)by Jefferson

Share this styleView Stats Edit Style Update Style

Information:

Author Jefferson

License CC BY - Creative CommonsAttribution

Date Created December 21, 2015

Last Updated October 4, 2017

Installs this week Total installs

Applies to:browser

Create New Style FORUMAccount

Firefox Search Bar Show Engine Names (Firefox 43+) | Userstyl... 1 of 4

https://userstyles.org/styles/122214/firefox-search-bar-show-engi... 10/4/2017, 9:28 PM

https://userstyles.org/styles/122214/firefox-search-bar-show-engi

Description:IMPORTANT -- SITE REDESIGN REQUIRES YOU TO SCROLL DOWN AND USE "ADVANCED STYLESETTINGS" BEFORE INSTALLATION!

As of May 9th, there is no way to revise your initial selection through this page. If you didn't get them the wayyou want, unfortunately you have to completely remove the style from the Add-ons page, User Styles section,and then reload this page and choose your style setting options again.

If you have multiple search engine plugins for the same site, having only an icon may be annoying. This styleshows a more classic list-style display. Developed and tested on Firefox 43.

To try different options after you install the style, reload the page until you get a green Update button, thenyou can choose a different option and update to it.

Show CSS Code ⚙ Advanced Style Settings

/* HELLO! This script has optional settings that you can try out if you return to its page: https://userstyles.org/styles/122214/firefox-search-bar-show-engine-names-firefox-43*/@-moz-document url(chrome://browser/content/browser.xul) { /* Make the one-off buttons span the full width */ #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext] { width: 100% !important; height: 24px !important; background-image: none !important; padding-left: 6px !important; box-sizing: content-box !important; line-height: 1em !important; }

(1) Vertical spacing and columns

(2) Hide the "Search for..." line above the non-default search engines?

(3) Hide the "Add ..." line for a site's own search engine (and the green + on the icon)?

(4) Hide the "Change Search Settings" line at the bottom?

(5) Show "Search using ..." tooltip text in or above the search box?

(6) Theming for search engines on hover/selection



https://userstyles.org/styles/122214/firefox-search


(6A) Custom text color

(6B) Custom background color

(6C) Custom boldness

Notes from latest update:Additional images: {Vertical spacing options - difference} • {Turn optional sections of the panel on and off} •{Overlay default search engine name on search bar}

If you have over 20 search plugins showing in the drop-down, consider using the two-column list style (lastitem on the drop-down for #1).

Change Log:2017-08-08 Fix selectors to avoid restyling the bottom of the address bar drop-down (Fx55)2016-02-03 Tweak text position, add two-column option, space for 5 suggestions2015-12-28 Added color theming options2015-12-27 Override the green + on the icon if you aren't going to show the Add... bar2015-12-25 Tweaked Search Bar tooltips to avoid overflowing the available space2015-12-24 Added option for search box tooltip (e.g., Search using DuckDuckGo)2015-12-24 Tweak sizes and positions, added install-time options for hiding various parts2015-12-21 Initial version (+ minor modification to shorten row heights)

Archive this Style

Discussion:

Send Feedback

Jefferson May 1, 2017

[May 1 Workaround] Insert Missing Style Settings Controls




fioiu omotrl March 19, 2017

A request for modification

gerdami April 29, 2016

Thank you!

Max T January 28, 2016

Search tips.

Florian “Floutsch” Hartig January 20, 2016

Brings back the search bar how it should be

See More




Read tips on making user styles.To specify which URLs will have the style applied, use the Mozilla @-moz-document format. If you'reusing Chrome, you can use the "To Mozilla Format" button to generate the code.Styles for sites with adult content are not allowed.Styles adding adult content to sites are not allowed.Do not post other people's content without their permission.If you decide to stop maintaining your style, please delete it rather than blanking it out. By deleting, youcan make it so your style doesn't come up in searches while still being accessible via direct access foryour current users.

NameFirefox Search Bar Show Engine Names (Firefox 43+)

Description - A brief (3-4 sentences) description of the style. Some HTML allowed.

IMPORTANT -- SITE REDESIGN REQUIRES YOU TO SCROLL DOWN AND USE "ADVANCED STYLE SETTINGS" BEFORE INSTALLATION!As of May 9th, there is no way to revise your initial selection through this page. If you didn't get them the way you want, unfortunately you have to completely remove the style from the Add-ons page, User Styles section, and then reload this page and choose your style setting options again.If you have multiple search engine plugins for the same site, having only an icon may be annoying. This style shows a more classic list-style display. Developed and tested on Firefox 43. To try different options after you install the style, reload the page until you get a green Update button, then you can choose a different option and update to it.

Additional Info (Optional) - Release notes, versioning info, change log, instructions, credits, etc. Some HTML allowed.

Additional images: {<a href="https://userstyles.org/style_screenshots/122214_additional_18009.png" target="_blank">Vertical spacing options - difference</a>} • {<a href="https://userstyles.org/style_screenshots/122214_additional_18010.png" target="_blank">Turn optional sections of the panel on and off</a>} • {<a href="https://userstyles.org/style_screenshots/122214_additional_18011.png" target="_blank">Overlay default search engine name on search bar</a>}

If you have over 20 search plugins showing in the drop-down, consider using the two-column list style (last item on the drop-down for #1).

Change Log:2017-08-08 Fix selectors to avoid restyling the bottom of the address bar drop-down (Fx55)2016-02-03 Tweak text position, add two-column option, space for 5 suggestions2015-12-28 Added color theming options2015-12-27 Override the green + on the icon if you aren't going to show the Add... bar2015-12-25 Tweaked Search Bar tooltips to avoid overflowing the available space2015-12-24 Added option for search box tooltip (e.g., Search using DuckDuckGo)2015-12-24 Tweak sizes and positions, added install-time options for hiding various parts2015-12-21 Initial version (+ minor modification to shorten row heights)

CSS Enable source editor


https://userstyles.org/d/styles/122214/edit 10/4/2017, 9:29 PM

https://userstyles.org/style_screenshots/122214_additional_18009.png

https://userstyles.org

https://userstyles.org/style_screenshots/122214_additional_18011.png

https://userstyles.org/d/styles/122214/edit

/* HELLO! This script has optional settings that you can try out if you return to its page: https://userstyles.org/styles/122214/firefox-search-bar-show-engine-names-firefox-43*/@-moz-document url(chrome://browser/content/browser.xul) { /* Make the one-off buttons span the full width */ #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext] { width: 100% !important; height: 24px !important; background-image: none !important; padding-left: 6px !important; box-sizing: content-box !important; line-height: 1em !important; } /* Hide the empties */ #PopupSearchAutoComplete .searchbar-engine-one-off-item:not([tooltiptext]) { display: none !important; } /* Fix up borders */ #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext], #PopupSearchAutoComplete .addengine-item { border-bottom: 1px solid #ccc !important; } #PopupSearchAutoComplete .search-setting-button.search-panel-header, #PopupSearchAutoComplete .addengine-item, #PopupSearchAutoComplete .search-panel-header.search-panel-current-input { border-top: none !important; max-height: 26px !important; min-height: 16px !important; padding-top: 1px !important; } /* Insert descriptive name for search engine plugin */ #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext]::after { content: attr(tooltiptext); margin: 5px 6px 0px !important; display: block !important; } /* Fix icon positioning */ #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext] > .button-box { display: inline-flex !important; width: 16px !important; max-width: 16px !important; border: none !important; padding: 0 0 !important; } #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext] > .button-box > .button-icon { display: block !important; margin-top: 4px !important; margin-left: -1px !important; } /* Lock in space for 5 search suggestions with scroll bar */



https://userstyles.org


#PopupSearchAutoComplete .autocomplete-tree.plain.search-panel-tree .tree-bodybox, #PopupSearchAutoComplete .autocomplete-tree.plain.search-panel-tree .autocomplete-treebody { display: flex !important; flex: 1 1 auto !important; } #PopupSearchAutoComplete .autocomplete-tree.plain.search-panel-tree .autocomplete-treebody { max-height: calc(5 * 1.5em) !important; min-height: calc(5 * 1.5em) !important; } #PopupSearchAutoComplete .autocomplete-tree.plain.search-panel-tree .tree-scrollbar[collapsed="true"] { visibility: visible !important; } /* User style options */ /*[[vertspace]]*/ /*[[searchfor]]*/ /*[[addengine]]*/ /*[[chgsettings]]*/ /*[[tooltiptext]]*/ /*[[theming]]*/}

Example URL (Optional) Provide a URL that is affected by this style

Style Settings (Optional) Need help with style settings?

(1) Vertical spacing and columns vertspace

Standard 4 pixel whitespace std Default

/* One column - standard spacing (built-in above) */

Narrow 2 pixel whitespace narrow Default

/* Narrow spacing */ #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext] { height: 20px !important; } #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext]::after { margin-top: 3px !important; } #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext] > .button-box > .button-icon { margin-top: 2px !important; } #PopupSearchAutoComplete .search-panel-header.search-panel-current-input,




#PopupSearchAutoComplete .search-panel-header.search-panel-current-engine { padding: 0 6px !important; max-height: 20px !important; }

Tight 1 pixel whitespace tight Default

/* Tight spacing */ #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext] { height: 18px !important; } #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext]::after { margin-top: 2px !important; } #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext] > .button-box > .button-icon { margin-top: 1px !important; } #PopupSearchAutoComplete .search-panel-header.search-panel-current-input, #PopupSearchAutoComplete .search-panel-header.search-panel-current-engine, #PopupSearchAutoComplete .search-setting-button.search-panel-header, #PopupSearchAutoComplete .search-setting-button.search-panel-header > .button-box { padding: 0 6px !important; max-height: 18px !important; }

Two columns twocol Default

/* Two columns - standard spacing */ #PopupSearchAutoComplete { width: calc(32em + 14px) !important; min-width: calc(32em + 14px) !important; } #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext] { width: 16em !important; white-space: nowrap; overflow: hidden; }

(2) Hide the "Search for..." line above the non-default search engines? searchfor

Yes, hide it hidesearchfor Default

/* Hiding "Search for ..." */




#PopupSearchAutoComplete .search-panel-header.search-panel-current-input { display: none !important; }

No, show it showsearchfor Default

/* Not hiding "Search for ..." */

(3) Hide the "Add ..." line for a site's own search engine (and the green + on the icon)? addengine

No, show it showengine Default

/* Not hiding "Add ..." engine */

Yes, hide it for Windows hideenginew Default

/* Hiding "Add ..." engine (Windows) */ #PopupSearchAutoComplete .addengine-item { display: none !important; } #PopupSearchAutoComplete .searchbar-search-button[addengines="true"] { list-style-image: url("chrome://browser/skin/search-indicator.png"); -moz-image-region: rect(0, 20px, 20px, 0); width: 20px; } #PopupSearchAutoComplete .searchbar-search-button:hover { -moz-image-region: rect(0, 40px, 20px, 20px); } #PopupSearchAutoComplete .searchbar-search-button:hover:active { -moz-image-region: rect(0, 60px, 20px, 40px); } /* From http://mxr.mozilla.org/mozilla-release/source/browser/themes/windows/searchbar.css */ @media (min-resolution: 1.1dppx) { #PopupSearchAutoComplete .searchbar-search-button[addengines="true"] { list-style-image: url("chrome://browser/skin/[email protected]"); -moz-image-region: rect(0, 40px, 40px, 0); } #PopupSearchAutoComplete .searchbar-search-button:hover { -moz-image-region: rect(0, 80px, 40px, 40px); } #PopupSearchAutoComplete .searchbar-search-button:hover:active { -moz-image-region: rect(0, 120px, 40px, 80px); }



http://mxr.mozilla.org/mozilla-release/source/browser/themes/windows/searchbar.css

mailto:chrome://browser/skin/[email protected]


}

Yes, hide it for Mac OS X hideenginem Default

/* Hiding "Add ..." engine (Mac) */ #PopupSearchAutoComplete .addengine-item { display: none !important; } #PopupSearchAutoComplete .searchbar-search-button[addengines="true"] { list-style-image: url("chrome://browser/skin/search-indicator.png"); -moz-image-region: rect(0, 20px, 20px, 0); } #PopupSearchAutoComplete .searchbar-search-button:hover { -moz-image-region: rect(0, 40px, 20px, 20px); } #PopupSearchAutoComplete .searchbar-search-button:hover:active { -moz-image-region: rect(0, 60px, 20px, 40px); } /* From http://mxr.mozilla.org/mozilla-release/source/browser/themes/osx/searchbar.css */ @media (min-resolution: 2dppx) { #PopupSearchAutoComplete .searchbar-search-button[addengines="true"] { list-style-image: url("chrome://browser/skin/[email protected]"); width: 20px; -moz-image-region: rect(0, 40px, 40px, 0); } #PopupSearchAutoComplete .searchbar-search-button:hover { -moz-image-region: rect(0, 80px, 40px, 40px); } #PopupSearchAutoComplete .searchbar-search-button:hover:active { -moz-image-region: rect(0, 120px, 40px, 80px); } }

Yes, hide it for Linux hideenginel Default

/* Hiding "Add ..." engine (Linux) */ #PopupSearchAutoComplete .addengine-item { display: none !important; } #PopupSearchAutoComplete .searchbar-search-button[addengines="true"] { list-style-image: url("chrome://browser/skin/search-indicator.png"); -moz-image-region: rect(0, 20px, 20px, 0); } #PopupSearchAutoComplete .searchbar-search-button:hover { -moz-image-region: rect(0, 40px, 20px, 20px); } #PopupSearchAutoComplete .searchbar-search-button:hover:active { -moz-image-region: rect(0, 60px, 20px, 40px);



http://mxr.mozilla.org/mozilla-release/source/browser/themes/osx/searchbar.css

mailto:chrome://browser/skin/[email protected]


}

(4) Hide the "Change Search Settings" line at the bottom? chgsettings

No, show it showchg Default

/* Not hiding "Change Search Settings" */

Yes, hide it hidechg Default

/* Hiding "Change Search Settings" */ #PopupSearchAutoComplete .search-setting-button.search-panel-header { display: none !important; }

(5) Show "Search using ..." tooltip text in or above the search box? tooltiptext

No thanks tttno Default

/* Search bar tooltip text only visible on mouseover */

Yes, in the bar tttinbar Default

/* Overlay search bar tooltip text in the search bar */ #searchbar { position: relative !important; } .searchbar-textbox[tooltiptext]:not(:hover):not([focused])::after { content: attr(tooltiptext); font-style: italic; color: #888; background-color: inherit; display: inline-block; padding-left: 4px; position: absolute; bottom: 3px; right: 8px; z-index: 1000; white-space: pre; direction: rtl;




max-width: calc(100% - 40px); overflow-x: hidden; } #searchbar .textbox-input::placeholder { opacity: 0 !important; }

Yes, above the bar tttabove Default

/* Overlay search bar tooltip text above the search bar */ #searchbar { position: relative !important; } .searchbar-textbox[tooltiptext]:not([focused])::after { content: attr(tooltiptext); font-style: italic; font-size: 11px; color: #888; background-color: transparent; display: inline-block; position: absolute; top: 0; margin-top: -12px; right: 3px; z-index: 1000; white-space: pre; direction: rtl; max-width: calc(100% - 6px); overflow-x: hidden; text-overflow: ellipsis; } #searchbar .textbox-input::placeholder { opacity: 0 !important; }

(6) Theming for search engines on hover/selection theming

No specific theming themenone Default

/* No color scheme */

Default "highlight" theming themehighlight Default

/* Default hover/selection theming */




#PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext]:hover, #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext][selected] { color: HighlightText !important; background-color: Highlight; }

White on bright blue themewonblue Default

/* White on blue hover/selection theming */ #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext]:hover, #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext][selected] { color: #fff !important; background-color: #00f !important; }

Bold white on black themewonblack Default

/* Bold white on black hover/selection theming */ #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext]:hover, #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext][selected] { color: #fff !important; background-color: #000 !important; font-weight: bold !important; }

Choose your own (see below) themeyours Default

/* Custom theming */ #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext]:hover, #PopupSearchAutoComplete .searchbar-engine-one-off-item[tooltiptext][selected] { color: /*[[usertextcolor]]*/ !important; background-color: /*[[userbackcolor]]*/ !important; font-weight: /*[[userboldness]]*/ !important; }

(6A) Custom text color usertextcolor Default #FFFFFF

(6B) Custom background color userbackcolor Default #0000FF

(6C) Custom boldness userboldness

Normal weightnormal Default




400

Bold weightbold Default

700

Primary Screenshot This screenshot will be displayed on your style page and in search results. It should clearly represent what thesite or app looks like with your style applied. More info on screenshots.

Automatically generate screenshot(coming soon) Upload screenshot (GIF, PNG, JPG, at least 700 x 350, <200KB)

RemoveChange: No file selected.

No screenshots(Styles won't show on search results and any of the categories)

Additional Screenshots (Optional) Other screenshots to demonstrate what your style does.

Description Upload Remove CurrentImage

Vertical spacing options - difference No file selected.

Turn optional sections of the panel on and off No file selected.

Overlay default search engine name on search bar No file selected.

No file selected.

No file selected.

Pledgie Campaign ID (Optional)

LicenseBy posting styles to userstyles.org, you are at minimum allowing people to use your styles for personal use. Youmay be more specific in what you allow by choosing a license. This setting defines the license for this style; youmay also define a default license for all your styles on your user page. You can use the Creative CommonsLicense Chooser to help you pick a Creative Commons license. Be sure you understand the licenses before youchoose them as they may not be revokable.

Use my default (currently CC BY - Creative Commons Attribution)CC0 - Public DomainCC BY - Creative Commons AttributionCC BY-SA - Creative Commons Attribution-ShareAlikeCC BY-ND - Creative Commons Attribution-NoDerivsCC BY-NC - Creative Commons Attribution-NonCommercialCC BY-NC-SA - Creative Commons Attribution-NonCommercial-ShareAlikeCC BY-NC-ND - Creative Commons Attribution-NonCommercial-NoDerivs No Redistribution




firefox search bar show engine names (firefox 43 ... search...oct 04, 2017 · 2015-12-24 added...

Documents