MozillaZine

Migrate userChrome.css from 62.0.3 to 63.0

User Help for Mozilla Firefox
MarcosD2
 
Posts: 33
Joined: August 4th, 2016, 10:49 am

Post Posted October 25th, 2018, 4:35 am

Good morning, everybody.

I have the following userChrome.css (Aris):

Code: Select all
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

@import url(./css/locationbar/ac_popup_classic_with_two_lines.css);

@import url(./css/locationbar/ac_popup_searchwith_and_visit_items_hidden.css);

@-moz-document url(chrome://browser/content/browser.xul) {
  /* Remove " - Visit" or " - Search with" bar in the drop-down */
  #PopupAutoCompleteRichResult richlistitem:first-of-type[type*="heuristic"],
  #PopupAutoCompleteRichResult richlistitem:first-of-type[actiontype="searchengine"],
  #PopupAutoCompleteRichResult richlistitem:first-of-type[actiontype="visiturl"],
  #PopupAutoCompleteRichResult richlistitem:first-of-type[actiontype="keyword"] {
    display:none !important;
  }
  #PopupAutoCompleteRichResult .autocomplete-richlistbox {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
 
  /* Create sufficient height for two lines */
  #PopupAutoCompleteRichResult .autocomplete-richlistitem:not([actiontype="searchengine"]) {
    position: relative !important;
    height: 45.5px !important;
  }
  /* Subtle border between results */
  #PopupAutoCompleteRichResult .autocomplete-richlistitem {
    border-bottom-color: #eee !important;
  }
  /* Position page title, set font-size */
  #PopupAutoCompleteRichResult .autocomplete-richlistitem:not([actiontype="searchengine"]) .ac-title {
    position: absolute !important;
    left: 54px;
    top: 0px;
    font-size: 16px !important;
  }
  /* Position page url / action, set font-size */
  #PopupAutoCompleteRichResult .autocomplete-richlistitem:not([actiontype="searchengine"]) .ac-url,
  #PopupAutoCompleteRichResult .autocomplete-richlistitem:not([actiontype="searchengine"]) .ac-action {
    position: absolute !important;
    left: 54px;
    top: 22px;
    font-size: 14px !important;
  }
 
  /* Position bookmark tags */
  #PopupAutoCompleteRichResult .autocomplete-richlistitem .ac-tags {
    position: absolute !important;
    right: 0px;
    top: 3px;
  }
  /* Hide separator between title and URL */
  #PopupAutoCompleteRichResult .autocomplete-richlistitem:not([actiontype="searchengine"]) .ac-separator {
    display: none !important;
  }
  /* Position special icon (bookmark, switch-to-tab) */
  #PopupAutoCompleteRichResult .autocomplete-richlistitem .ac-type-icon {
    margin-left: 4px !important;
 }
  /* Prevent excess indenting of icons in Photon */
  #PopupAutoCompleteRichResult .autocomplete-richlistitem [anonid="type-icon-spacer"] {
    display: none !important;
  }
  #PopupAutoCompleteRichResult {
     --item-padding-start: 0 !important;
  }
 
  .autocomplete-richlistitem[selected=true] {
    background-color: Highlight !important;
  }
  .autocomplete-richlistitem[selected=true] .ac-title, 
  .ac-title[selected],
  .autocomplete-richlistitem[selected=true] .ac-url, 
  .ac-url[selected],
  .autocomplete-richlistitem[selected=true] .ac-action,
  .ac-action[selected],
  .autocomplete-richlistitem[selected=true] .ac-separator,
  .ac-separator[selected] {
    color: HighlightText !important;
  }
  /* Use default text matching style */
  /* Ability to scroll in Fx57 */
  #PopupAutoCompleteRichResult .autocomplete-richlistbox > scrollbox {
    overflow-y: auto !important; 
    padding-right: 3px !important;
  }
  #PopupAutoCompleteRichResult .autocomplete-richlistbox {
    padding-right: 0 !important;
  }
}


... using the following ac_popup_classic_with_two_lines.css provided by Aris also:

Code: Select all
/*AGENT_SHEET*/

/* Firefox 57+ userChrome.css tweaks ****************************************************/
/* code mostly taken from 'Classic Theme Restorer' & 'Classic Toolbar Buttons' add-ons **/
/* by Aris (aris-addons@gmx.net)*********************************************************/
/* Github: https://github.com/aris-t2/customcssforfx ************************************/
/****************************************************************************************/

@-moz-document url(chrome://browser/content/browser.xul) {

   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete),
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] {
     -moz-binding: url("./../../xml/urlbarBindings_fx57.xml#urlbar-rich-result-popup") !important;
   }

   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) .autocomplete-richlistitem,
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem {
     -moz-binding: url("./../../xml/urlbarBindings_fx57.xml#autocomplete-richlistitem") !important;
   }
   
   /* remove space around box */
   #PopupAutoCompleteRichResult .autocomplete-richlistbox {
     padding: 0 !important;
   }
   
   /* restyle popup items */
   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) .autocomplete-richlistitem,
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem {
     -moz-box-orient: vertical !important;
     min-height: unset !important;
     height: unset !important;
     max-height: unset !important;
     padding: 4px 0px !important;
     border-radius: 0 !important;
   }

   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) .autocomplete-richlistitem .ac-separator,
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem .ac-separator {
     display:none !important;
     visibility: collapse !important;
   }

   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) .autocomplete-richlistitem :-moz-any(.ac-site-icon,.ac-title,.ac-action,.ac-url),
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem :-moz-any(.ac-site-icon,.ac-title,.ac-action,.ac-url){
     -moz-margin-start: unset !important;
     -moz-margin-end: unset !important;
     -moz-padding-start: unset !important;
     -moz-padding-end: unset !important;
   }

   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) .autocomplete-richlistitem .ac-type-icon,
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem .ac-type-icon {
     margin-inline-start: 4px !important;
     margin-inline-end: 4px !important;
   }

   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) .autocomplete-richlistitem .ac-site-icon,
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem .ac-site-icon {
     -moz-margin-start: 4px !important;
   }

   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) .autocomplete-richlistitem .ac-title,
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem .ac-title{
     -moz-margin-start: 5px !important;
     margin-top: -3px !important;
   }
   
   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) .autocomplete-richlistitem :-moz-any(.ac-url, .ac-action),
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem :-moz-any(.ac-url, .ac-action){
     -moz-margin-start: 25px !important;
     margin-top: 1px !important;
   }
   
   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) .autocomplete-richlistitem .ac-url,
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem .ac-url{
     padding-bottom: 1px !important;
   }

   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) .autocomplete-richlistitem .ac-action[actiontype=searchengine]:not([selected]),
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem .ac-action[actiontype=searchengine]:not([selected]) {
     display: block !important;
   }

   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) .autocomplete-richlistitem #ibox-spacer,
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem #ibox-spacer {
     width: 100000px !important;
   }
   
   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) hbox[anonid="search-suggestions-notification"],
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] hbox[anonid="search-suggestions-notification"] {
     display: none !important;
   }
   
   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) deck[search-suggestions-notification],
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] deck[search-suggestions-notification] {
     display: none !important;
   }
   
   /* show scrollbar */
   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) scrollbox,
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] scrollbox{
     overflow-y: auto !important;
   }
   
   /* for Windows Classic theme *//*
   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) .autocomplete-richlistitem .ac-title,
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem .ac-title {
     padding-top: 2px !important;
     padding-bottom: 2px !important;
   }

   panel[type="autocomplete-richlistbox"]:not(#PopupAutoComplete) .autocomplete-richlistbox,
   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistbox {
     padding: 0 !important;
   }
   
   /**/

}


I'm not being able to use it in Firefox 63.0, it doesn't give me the same results I achieve in previous versions:

https://i.imgur.com/jXnYL58.png

How can I migrate it to achive the same results in 63.0 version?

Thanks in advance.
Last edited by smsmith on October 25th, 2018, 5:24 am, edited 1 time in total.
Reason: removed image tags because the image size was breaking the forum layout - smsmith/moderator

jscher2000

User avatar
 
Posts: 10856
Joined: December 19th, 2004, 12:26 am
Location: Silicon Valley, CA USA

Post Posted October 25th, 2018, 3:13 pm

On the following page, I see ac_popup_classic_with_two_lines.css was updated "10 hours ago" so perhaps that will resolve the issue (I don't know what the issue is, but if this works, I don't need to know):

https://github.com/Aris-t2/CustomCSSforFx/tree/master/classic/css/locationbar

You can use the "Raw" display of any given file to save that particular file without doing the full download again.

----

Oh wait, I also see one called

ac_popup_classic_with_two_lines_fx63.css

Not sure which is best for you now. Maybe check in the current userChrome.css for guidance.

Apparently, you need both.

MarkRH

User avatar
 
Posts: 1291
Joined: September 12th, 2007, 2:30 am
Location: Oklahoma City, OK

Post Posted October 25th, 2018, 4:16 pm

ac_popup_classic_with_two_lines_fx63.css imports the other one so you only need to include this one.
Code: Select all
/* Firefox Quantum userChrome.css tweaks ************************************************/
/* Github: https://github.com/aris-t2/customcssforfx ************************************/
/****************************************************************************************/

@import "ac_popup_classic_with_two_lines.css";

@-moz-document url(chrome://browser/content/browser.xul) {

   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] {
     -moz-binding: url("./ac_popup_classic_with_two_lines_fx63.xml#urlbar-rich-result-popup") !important;
   }

   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem {
     -moz-binding: url("./ac_popup_classic_with_two_lines_fx63.xml#autocomplete-richlistitem") !important;
   }

}

MarcosD2
 
Posts: 33
Joined: August 4th, 2016, 10:49 am

Post Posted October 26th, 2018, 4:30 am

Current userChrome.css on 63.0 version:

Code: Select all
/* Firefox Quantum userChrome.css tweaks ************************************************/
/* Github: https://github.com/aris-t2/customcssforfx ************************************/
/****************************************************************************************/

@import "ac_popup_classic_with_two_lines.css";

@-moz-document url(chrome://browser/content/browser.xul) {

   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] {
     -moz-binding: url("./ac_popup_classic_with_two_lines_fx63.xml#urlbar-rich-result-popup") !important;
   }

   #PopupAutoCompleteRichResult[autocompleteinput="urlbar"] .autocomplete-richlistitem {
     -moz-binding: url("./ac_popup_classic_with_two_lines_fx63.xml#autocomplete-richlistitem") !important;
   }

}


ac_popup_classic_with_two_lines.css and ac_popup_classic_with_two_lines_fx63.css are identical to https://github.com/Aris-t2/CustomCSSfor ... ocationbar content.


Result achieved: https://i.imgur.com/dEZwfRy.png

Result desired (just like 62.0.3): https://i.imgur.com/9cFSgB8.png

I want all properties of my first userChrome.css posted (viewtopic.php?p=14813131#p14813131) working on 63.0+ versions, but I'm not being able to do it!

Thanks for all replies.

Aris

User avatar
 
Posts: 3246
Joined: February 27th, 2011, 10:14 am

Post Posted October 26th, 2018, 7:15 am


MarcosD2
 
Posts: 33
Joined: August 4th, 2016, 10:49 am

Post Posted October 29th, 2018, 4:41 am

Problem solved.

This is my folder structure in 63.0+ version:

Image

Thanks!!!!

Mudder

User avatar
 
Posts: 67
Joined: July 7th, 2013, 4:14 pm
Location: Ontario, Canada

Post Posted October 30th, 2018, 4:04 am

Well, I don't understand, other than slowing the browser down, v63 didn't change the appearance of my browser.
Still frustrated though that its' not as 'snappy' as it was before.

Return to Firefox Support


Who is online

Users browsing this forum: No registered users and 6 guests