public marks

PUBLIC MARKS from decembre with tags ui & userChrome.css

15 December 2017

FIR 57 - MY CustomCSS (userChrome.css ) - General discussions, feedback, questions belong here (v3) · Issue #88 · Aris-t2/CustomCSSforFx · GitHub

/* * Edit this file and copy it as userChrome.css into your ff profile */ /* Show TAB favicon only on selected tab */ #feed-button { display: none !important } #urlbar[level] .autocomplete-textbox-container >* { background-color: #FFFFB7 !important; } .autocomplete-history-dropmarker { display: none !important; } /* Hide Tabbar close Button */ /* tabbrowser .tabs-closebutton-box { display: none; } */ /* PERSONAL TOOLBAR */ /* * Note: Rules affecting icons on the PT do not apply to folder contents. * Those are governed by "Bookmarks menu" rules. * Taken from: http://www.mozilla.org/unix/customizing.html#usercss */ /* Kill FOLDER / bookmark icons in the Personal Toolbar */ toolbarbutton.bookmark-item > .toolbarbutton-icon { display: none; } /* BOOKMARKS MENU */ /* OK - kill icons for bookmark groups in Bookmarks menu */ menuitem.bookmark-group > .menu-iconic-left { display: none; } /*hide noscript icon in contextual menu*/ .menu-iconic[id*="noscript-"] > .menu-iconic-left .menu-iconic[class*="noscript-"] > .menu-iconic-left .menuitem-iconic[class*="noscript-"] > .menu-iconic-left { visibility: hidden !important; } /* TABS */ .tabbrowser-tab[selected="true"] { border: none !important; font-family: "pragmata" !important; border-radius: 0 !important; padding-left: 5px !important; padding-right: 5px !important; background: red !important; } .tabbrowser-tab:not([selected="true"]) { border: none !important; font-family: "pragmata" !important; background: #222 !important; border-radius: 0 !important; padding-left: 5px !important; padding-right: 5px !important; } { -moz-appearance: none !important; } #content browser{margin-right:-16px!important;overflow-y:scroll;overflow-x:hidden;} .appmenu-button-container { background: #303030 !important; } #navigator-toolbox #TabsToolbar, { background: #303030 !important; } #appmenu-toolbar-button, .tabbrowser-tab { font: 10pt "pragmata" !important; background-color: #303030 !important; text-shadow: none !important; color: #676767 !important; } #urlbar { height: 22px; } .appmenu-toolbar-button { background: #303030 !important; color: #676767 !important; text-align: left !important; margin: 0 3px 0 0px !important; padding: 0 0 0 0 !important; } .toolbarbutton-menu-dropmarker { display: none !important; } #navigator-toolbox #TabsToolbar { background: #303030 !important; padding: 0px 0px !important; height: 20px !important; } .tabbrowser-tab { text-align: center !important; color: #676767 !important; background: #303030 !important; margin: -2px 0px 0px 0px !important; padding: 0px 2px 0px 4px !important; border: 0 !important; border-left: 0px solid #676767 !important; border-right: 0px solid #676767 !important; border-radius: 0px !important; } .tabbrowser-tab[selected="true"] { /*background: #202020 !important;*/ background: red !important; border-left: 0px solid #676767 !important; border-right: 0px solid #676767 !important; padding: 0px 2px 0px 3px !important; color: #ababab !important; }

29 October 2017

FIR 57>+ - userChrome.css / userContent.css - WebExtensions can not modify browsers appearance in Firefox 57+

The only way to modify UI is adding custom CSS code to userChrome.css and userContent.css files inside browsers profile folder. Keep in mind CSS code can not create entirely new items, buttons or toolbars. It only can modify already present ui items. 1. Find your profile folder ('profile names are different for everyone'). All OS: about:support > Profile Folder > Open Folder 2. User styles belong into "chrome" subolder. Create it, if there is none yet. PROFILENAME chrome 3. Copy userChrome.css, userContent.css and subfolders into chrome subfolder. How to use custom user styles? The userChrome.css and userContent.css files works like an optionsconfigurations file. All main "features" can be enabled and disabled there.