X
Tap here to go to the mobile version of the site.

Support Forum

What has changed to make css code for search bar inoperable?

Posted

I have updated to v.69 and instead of a list of search engines I now see a clutch of unrecognisable icons. The setting "toolkit.legacyUserProfileCustomizations.stylesheets" is set to 'true' (default) in about:config. css code for a list is in searchbar.css imported into userChrome.css. Why has it stopped working and what can I do about it?

I have updated to v.69 and instead of a list of search engines I now see a clutch of unrecognisable icons. The setting "toolkit.legacyUserProfileCustomizations.stylesheets" is set to 'true' (default) in about:config. css code for a list is in searchbar.css imported into userChrome.css. Why has it stopped working and what can I do about it?

Chosen solution

In the first line, change

browser.xul

to

browser.xhtml

and see how it goes.

Read this answer in context 1
Quote

Additional System Details

Installed Plug-ins

OpenH264 video codec provided by Cisco Systems, Inc Widevine Content Decrytion Module provided by Google, Inc

Application

  • User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:69.0) Gecko/20100101 Firefox/69.0

More Information

jscher2000
  • Top 10 Contributor
8684 solutions 70998 answers

Helpful Reply

Hi ender21, what is this file:

css code for a list is in searchbar.css imported into userChrome.css. Why has it stopped working and what can I do about it?

I notice my rules from the following page need to be updated as well, so if that is the source, give me a little while to report back:

https://www.jeffersonscher.com/gm/search-bar-names.html

Hi ender21, what is this file: <blockquote> css code for a list is in searchbar.css imported into userChrome.css. Why has it stopped working and what can I do about it? </blockquote> I notice my rules from the following page need to be updated as well, so if that is the source, give me a little while to report back: https://www.jeffersonscher.com/gm/search-bar-names.html
Was this helpful to you? 1
Quote

Question owner

I am aware of your page but I don't remember whether I got my document from there; I refer to your page in the preamble but it looks different from yours. I don't see anything relevant in the release notes for v.69. This is my code : @-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 */
 #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 */
   /* One column - standard spacing (built-in above) */
   /* Hiding "Search for ..." */
 #PopupSearchAutoComplete .search-panel-header.search-panel-current-input {
   display: none !important;
 }
   /* Not hiding "Add ..." engine */
   /* Not hiding "Change Search Settings" */
   /* Search bar tooltip text only visible on mouseover */
   /* For light theme */
 #PopupSearchAutoComplete .search-panel-one-offs:not(:hover):not([selected]), 
 #PopupSearchAutoComplete .searchbar-engine-one-off-item:not(:hover):not([selected]) {
   color: #111 !important;
   background-color: #fafafa !important;
 }
 #PopupSearchAutoComplete .search-panel-header, 
 #PopupSearchAutoComplete .search-panel-input-value, 
 #PopupSearchAutoComplete .addengine-item {
   color: #111 !important;
 }

}

I am aware of your page but I don't remember whether I got my document from there; I refer to your page in the preamble but it looks different from yours. I don't see anything relevant in the release notes for v.69. This is my code : @-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 */ #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 */ /* One column - standard spacing (built-in above) */ /* Hiding "Search for ..." */ #PopupSearchAutoComplete .search-panel-header.search-panel-current-input { display: none !important; } /* Not hiding "Add ..." engine */ /* Not hiding "Change Search Settings" */ /* Search bar tooltip text only visible on mouseover */ /* For light theme */ #PopupSearchAutoComplete .search-panel-one-offs:not(:hover):not([selected]), #PopupSearchAutoComplete .searchbar-engine-one-off-item:not(:hover):not([selected]) { color: #111 !important; background-color: #fafafa !important; } #PopupSearchAutoComplete .search-panel-header, #PopupSearchAutoComplete .search-panel-input-value, #PopupSearchAutoComplete .addengine-item { color: #111 !important; } }
Was this helpful to you?
Quote
jscher2000
  • Top 10 Contributor
8684 solutions 70998 answers

Chosen Solution

In the first line, change

browser.xul

to

browser.xhtml

and see how it goes.

In the first line, change browser.xul to browser.xhtml and see how it goes.
Was this helpful to you? 1
Quote

Question owner

Thanks. I wasn't expecting an answer so soon. That has fixed it.

Thanks. I wasn't expecting an answer so soon. That has fixed it.
Was this helpful to you?
Quote
Ask a question

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.