Skip to content

Instantly share code, notes, and snippets.

@quasar098
Last active November 3, 2024 01:05
Show Gist options
  • Save quasar098/447a29ecf0ee794a8e7400e6aa9bcf79 to your computer and use it in GitHub Desktop.
Save quasar098/447a29ecf0ee794a8e7400e6aa9bcf79 to your computer and use it in GitHub Desktop.
firefox userChrome.css, chrome style stuffs
panelview,
.panel-arrowcontent{
background: #15141a !important;
color: #afafab !important;
}
#alltabs-button { display: none !important; }
/* bookmark bar */
.bookmark-item[container] {
list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAUsSURBVHhe7ZvNjhtFEMfbnt3YcRZYkhCkBcFlD/ACOXHgRkDixAtw4LEQRx6AQy5cQXBC4haUWyQUIRAfUWA3u2ubqu6u8n9qe8bTPR4SL/4p7f7XR7q7anqsRJu4HTt2/K8ZxbkTT378eBmlc6RqhpCS4AtEB02XQgw4VzKd7F3Bv6Tpi9t373/mrY5kN+ClOx9F63kQO8ClKkHPx4fur0dfLm/dvT/2jo5kJT9fmotnqslrPGU9UCavAbD34vSRc9NjnYelvfi6ziOrAeXb9KFj8TzVcrqxBa8A32oaIzqqjioMLL7WlO5kNqBsk0GB4ktOtwU3oAUovqz8bW9Az+KZvAaU7zMg/Q51RW5ApKAXW94AgSovvAhZDeh32YaivHhm+18BLb6sC9v9JWiKLzneFfgOkLLLns72vwI4X82/C6yj7MkLmQ3ot9nm6X+e/+gG8EGHGP3Ja0DRnps5aDvle2Q1IH+b+Dv4y2mIERb3v+JHNgO+AvFAetAhqBdfstVADYgnGbR4AoovZYAGpIpnPdQQUHdnww2Ih7hU/NCU75HXgNZ9tq94ZrM3oLF41kONfmygAfEQrcUPDZXB2xRsldWA5vWbCo6aJ26QHwsYc+cWMi7iODfjzLk5j2cwTsPw0JrjyUpn0uMGxM3WPXk/id/E1UzFGclBv9FqBvH4u3vvedGRzAbIbnZmEtpPDblqpuKM5KDfaDFHE7okf9KzOHfVwn0avZ3IawAe6EV58vyjsv3b7uzpQze9fof8y09ipBNlr0CteCT6/SQ5mEtazVSckRz0Gy0mFz95i75Ozt3Fkwfu4OW3XbU/O/zlmw8exoy15DfgRXryVPwFXf2nP3/lprPX3biauFdvvev29mfHXZtQdgOaqB2+4eDJOCM56DdaTRJ7N/2z+JuLnx66/elN7x+NK2rCO66qJsePv733echvprAB5mA6id/E1UzFGclBv9FqRrH3ijv94wd3/cabWryHujIaVW52cORGi/XfB1kNCFvoSVZ4l/gxTlrNVJyRHPQbraYImkf7bnn2O73zN4Lt3av4tckBz4fBbibvBuhBGNlUP2BmSKuZijOSg36j1RSxii/mJ/7Ke6B4HlV1LZhr6PcK+Ak3FkirmYozkoN+o9UUAXEqeP7sNxZeB3iOWn3tFDRANtAPmBnSaqbijOSg32g1RUCc/uATsHnR8MVroJWyG+DXTm1APnWLsHmSg36j1RQBcS7O//sg1vIhgyfUYWojvwF+UVkZdyCtZirOSA76jVZTBMRTV90Tde3JY7yZ8lfAou6mA5DtXeg3Wk0RENfiEfZFf0HxTF4Dak9AIK1mKs5IDvqNVlMExGvFoyY4liqefCYzyeZugD2AQrZ3od9oNUVAPFk8+hjjrzWknawG1JckSx0i7KaSg36j1RQB8bXFszb+jOKZghvA4AbmAArZ3pXKZSTOiIB4pyfPsC/6a8XTLLKFsldAF4bNakgO+o1WUwTE1xXvJeYQBcUz+Q3QhZt2kM0xbrSaIiC+seJNTgN5DdA1YbMaZHsX+o1WUwTEs4qnmfMbi0d/M2WvQBLy+xDGjVZTBMRzi9cZtJfoW88GvgQjurlgtJoiIF5UPEI+zVnlpTItxTdgPHnDuZOfaD5y7p8H6g8YraYIiA9UfHg9otlCVgMuryebYMRoNUVAvLh40hKTOYgw07oL/mFLB7L+k9Gv339I90o2qtPgjucKQU1pyF2tYRLArEUShv9c+U+O3v96FvWOHTt2GJz7FzeQmvQdjuzBAAAAAElFTkSuQmCC") !important; /* bookmark folder icon */
}
#PersonalToolbar {
max-height: 36px;
}
#personal-bookmarks {
height: 36px;
}
menuitem.menuitem-iconic hbox.menu-iconic-left {
margin-left: 2px;
}
menuitem hbox.menu-accel-container {
width: 3px;
}
toolbarbutton.bookmark-item:not(.subviewbutton) {
border-radius: 20px !important;
margin: 4px 2px 4px 2px !important;
padding: 4px 6px 4px 6px !important;
transition: background-color 0.27s cubic-bezier(.45,.22,.26,1);
&:not([disabled], [open]):hover {
background-color: #424348 !important;
}
&:hover:active:not([disabled]), &[open="true"] {
background-color: #505154 !important;
}
}
.toolbarbutton-text {
padding-bottom: 2px !important;
}
.openintabs-menuitem {
display: none;
}
.bookmarks-actions-menuseparator {
display: none;
}
.toolbar-menupopup {
&, & menupopup {
--panel-border-radius: 0px !important;
--panel-padding: 2px !important;
--panel-background: #292a2d !important;
--panel-border-color: #3c4043 !important;
}
}
menuitem.bookmark-item,menu.bookmark-item {
padding: 0px 3px 0px 3px !important;
margin: 0px !important;
border-radius: 0px !important;
}
/* better context menu */
#mainPopupSet menupopup {
--panel-padding: 2px !important;
--panel-border-radius: 0px !important;
--panel-background: #292a2d !important;
}
#mainPopupSet menupopup {
@media (-moz-platform: windows) {
& > menu, & > menuitem {
/* padding-block: 0.5em; */
padding: 2px;
max-height: 22px;
}
}
}
#mainPopupSet menupopup menuitem > label:nth-child(1) {
padding: 0px;
}
menu,menuitem {
&:where([_moz-menuactive]:not([disabled="true"])) {
background-color: #3f4042 !important;
}
}
/* better navbar */
.browser-toolbar {
&:not(.titlebar-color) {
background-color: #34353a !important;
}
}
#navigator-toolbox {
border-bottom: 0.01px solid #606164 !important;
}
toolbaritem#urlbar-container:not(:has([breakout-extend])) {
--toolbarbutton-border-radius: 40px !important;
}
toolbaritem#urlbar-container:has([breakout-extend]) {
--toolbarbutton-border-radius: 12px !important;
}
#urlbar[breakout] {
& > #urlbar-input-container {
padding-left: 2px !important;
padding-right: 2px !important;
}
}
[pageproxystate="invalid"] #identity-icon-box { /* search icon in navbar */
padding-left: 4px !important;
}
#tracking-protection-icon-container, .identity-box-button, .urlbar-page-action, #urlbar-go-button, .search-go-button {
border-radius: 40px !important;
padding-inline: 4px !important;
height: 24px !important;
margin: 2px !important;
transition: background-color 0.27s cubic-bezier(.45,.22,.26,1);
}
.urlbar-page-action, #urlbar-go-button, .search-go-button {
justify-content: center;
width: 24px !important;
}
#identity-icon-box:not(:has([value="Firefox"]),:hover) {
background: none !important;
}
#identity-icon {
margin-left: 1px !important;
margin-right: 1px !important;
}
#tracking-protection-icon-box {
justify-content: center;
align-items: center;
}
.urlbar-page-action {
padding-top: calc(var(--urlbar-icon-padding) - 1px) !important;
padding-bottom: calc(var(--urlbar-icon-padding) + 1px) !important;
}
.urlbar-icon,#identity-icon,#tracking-protection-icon {
width: 14px !important;
height: 14px !important;
}
#tracking-protection-icon-container {
margin-left: 1px;
}
:root {
--toolbar-field-background-color: #232428 !important;
--tab-min-height: 34px !important;
--toolbarbutton-hover-background: #454649 !important;
}
#TabsToolbar {
background-color: #242528 !important;
}
#urlbar:is([focused="true"],[open]) > #urlbar-background, #searchbar:focus-within {
background-color: rgb(48, 47, 53) !important;
}
#identity-box #identity-icon-box #identity-icon-label {
display: none;
}
#back-button {
list-style-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIgMzIiIGhlaWdodD0iIDMyIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsYXNzPSJ2ZWN0b3Itc3ZnIj48cGF0aCBmaWxsPSJ3aGl0ZSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIxcHgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc2hhcGUtcmVuZGVyaW5nPSJhdXRvIiBkPSJNIDQuMjIgMTQuMDMgQyAzLjUzIDE0LjE1IDMgMTQuNzcgMyAxNS41IEMgMyAxNi4yNSAzLjUzIDE2Ljg2IDQuMjQgMTYuOTggTCA0LjAyIDE3LjE5IEwgMTQuMzYgMjcuNTEgQyAxNC42NSAyNy44MSAxNS4wNSAyOCAxNS41IDI4IEMgMTYuMzMgMjggMTcgMjcuMzMgMTcgMjYuNSBDIDE3IDI2LjA1IDE2LjggMjUuNjUgMTYuNDkgMjUuMzggTCAxNi41NSAyNS4zMiBMIDguMjIgMTcgTCAyNy41MSAxNyBDIDI4LjMzIDE3IDI5IDE2LjMzIDI5IDE1LjUgQyAyOSAxNC42NyAyOC4zMyAxNCAyNy41MSAxNCBMIDguMiAxNCBMIDE2LjU1IDUuNjYgQyAxNi44MSA1LjM0IDE3IDQuOTQgMTcgNC41IEMgMTcgMy42OCAxNi4zMyAzIDE1LjUgMyBDIDE1LjA2IDMgMTQuNjYgMy4yIDE0LjM5IDMuNSBMIDE0LjM2IDMuNDcgTCA0IDEzLjgxIFoiLz48L3N2Zz4=") !important; /* back arrow */
stroke-width: 4;
}
.toolbarbutton-icon:is([label="Back"],[label="Forward"]) {
width: 26px !important;
height: 26px !important;
border-radius: 40px !important;
padding: calc(var(--toolbarbutton-inner-padding) - 4px) !important;
}
.toolbarbutton-icon[label="Reload"],.toolbarbutton-icon[label="Stop"] {
width: 27px !important;
height: 27px !important;
border-radius: 40px !important;
padding: calc(var(--toolbarbutton-inner-padding) - 4px) !important;
}
toolbar .toolbarbutton-1 {
&:not([disabled]) {
& > :is(.toolbarbutton-icon, .toolbarbutton-text, .toolbarbutton-badge-stack) {
transition: background-color 0.4s cubic-bezier(.4,.53,.43,1);
}
}
}
#forward-button {
list-style-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIgMzIiIGhlaWdodD0iIDMyIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsYXNzPSJ2ZWN0b3Itc3ZnIj48cGF0aCBmaWxsPSJ3aGl0ZSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIxcHgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc2hhcGUtcmVuZGVyaW5nPSJhdXRvIiBkPSJNIDI3Ljc4IDE0LjAzIEMgMjguNDcgMTQuMTUgMjkgMTQuNzcgMjkgMTUuNSBDIDI5IDE2LjI1IDI4LjQ3IDE2Ljg2IDI3Ljc2IDE2Ljk4IEwgMjcuOTggMTcuMTkgTCAxNy42NCAyNy41MSBDIDE3LjM1IDI3LjgxIDE2Ljk1IDI4IDE2LjUgMjggQyAxNS42NyAyOCAxNSAyNy4zMyAxNSAyNi41IEMgMTUgMjYuMDUgMTUuMiAyNS42NSAxNS41MSAyNS4zOCBMIDE1LjQ1IDI1LjMyIEwgMjMuNzggMTcgTCA0LjQ5IDE3IEMgMy42NyAxNyAzIDE2LjMzIDMgMTUuNSBDIDMgMTQuNjcgMy42NyAxNCA0LjQ5IDE0IEwgMjMuOCAxNCBMIDE1LjQ1IDUuNjYgQyAxNS4xOSA1LjM0IDE1IDQuOTQgMTUgNC41IEMgMTUgMy42OCAxNS42NyAzIDE2LjUgMyBDIDE2Ljk0IDMgMTcuMzQgMy4yIDE3LjYxIDMuNSBMIDE3LjY0IDMuNDcgTCAyOCAxMy44MSBaIi8+PC9zdmc+") !important; /* right arrow */
}
#reload-button {
list-style-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIgMzIiIGhlaWdodD0iIDMyIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsYXNzPSJ2ZWN0b3Itc3ZnIj48cGF0aCBmaWxsPSJ3aGl0ZSIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIwLjI1cHgiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc2hhcGUtcmVuZGVyaW5nPSJhdXRvIiB0cmFuc2Zvcm09InNjYWxlKDAuODc1IDAuODc1KSB0cmFuc2xhdGUoMiAyKSIgZD0iTSAyNS4xIDIwLjE1IEwgMjUuMDggMjAuMTQgQyAyMy41MSAyMy41OSAyMC4wNCAyNiAxNiAyNiBDIDEwLjQ4IDI2IDYgMjEuNTIgNiAxNiBDIDYgMTAuNDggMTAuNDggNiAxNiA2IEMgMTkuMDIgNiAyMS43MiA3LjM0IDIzLjU1IDkuNDUgTCAyMy41NSA5LjQ1IEwgMTkgMTQgTCAyNS44IDE0IEwgMjguODMgMTQgTCAzMCAxNCBMIDMwIDMgTCAyNS42NyA3LjMzIEMgMjMuMyA0LjY3IDE5Ljg1IDMgMTYgMyBDIDguODIgMyAzIDguODIgMyAxNiBDIDMgMjMuMTggOC44MiAyOSAxNiAyOSBDIDIxLjI3IDI5IDI1LjggMjUuODYgMjcuODQgMjEuMzQgQyAyNy45NiAyMS4xMyAyOC4wMyAyMC44OCAyOC4wMyAyMC42MSBDIDI4LjAzIDE5Ljc4IDI3LjM2IDE5LjExIDI2LjUzIDE5LjExIEMgMjUuODcgMTkuMTEgMjUuMyAxOS41NSAyNS4xIDIwLjE1IFoiLz48L3N2Zz4=") !important; /* reload arrow */
}
#reload-button .toolbarbutton-animatable-box {
display: none !important;
}
vbox.tab-label-container .tab-text {
margin-bottom: 3px !important;
}
.tab-background {
--tab-border-radius: 8px 8px 0px 0px;
--tab-min-height: 34px;
margin-block: 0px !important;
}
tab.tabbrowser-tab {
padding-left: 0px !important;
padding-right: 0px !important;
overflow: visible !important; /* might break stuff idk */
}
tab.tabbrowser-tab[selected="true"] {
z-index: 10000;
}
arrowscrollbox#tabbrowser-arrowscrollbox > .tabbrowser-tab {
margin-left: 8px !important;
}
arrowscrollbox#tabbrowser-arrowscrollbox > .tabbrowser-tab ~ .tabbrowser-tab {
margin-left: 0px !important;
}
vbox.tab-background {
box-shadow: none !important;
transition: background-color 0.2s cubic-bezier(.15,.68,.43,1);
}
vbox.tab-background:is([selected], [multiselected]) {
background-color: #34353a !important;
transition: none;
}
#TabsToolbar #firefox-view-button:hover:not([open]) > .toolbarbutton-icon, .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected], [multiselected]) {
background-color: #292a2d !important;
}
:root[tabsintitlebar] #titlebar {
#TabsToolbar:-moz-window-inactive {
background-color: #3c4043 !important;
}
&:-moz-window-inactive {
opacity: 1 !important;
}
}
#tabs-newtab-button {
margin-left: 7px !important;
}
#tabs-newtab-button .toolbarbutton-icon {
border-radius: 200px !important;
margin: 3px 0px 3px 0px;
height: 28px !important;
width: 28px !important;
padding: 6px !important;
}
.tab-icon-image {
margin-left: 3px;
}
#urlbar-background,#TabsToolbar {
background-color: rgb(32, 33, 36) !important;
}
#stop-button .toolbarbutton-animatable-image {
animation-duration: 0s !important;
}
.tab-content .tab-close-button {
border-radius: 200px !important;
margin-right: -2px !important;
}
.tab-content[selected]::after { /* bottom curve left part of rounded tabs (https://i.ibb.co/NnVTNrT/image.png) */
width: 8px;
height: 8px;
content: ' ';
position: absolute;
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2aWV3Qm94PSIwIDAgNTAwIDUwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZGVmcy8+CiAgPHBhdGggc3R5bGU9ImZpbGw6IHJnYig1MiwgNTMsIDU4KTsgc3Ryb2tlOiByZ2IoNTIsIDUzLCA1OCk7IHRyYW5zZm9ybS1ib3g6IGZpbGwtYm94OyB0cmFuc2Zvcm0tb3JpZ2luOiA1MCUgNTAlOyIgZD0iTSAwIDAgQyAyNTAgMCA1MDAgMjEwIDUwMCA1MDAgTCA1MDAgMCBMIDAgMCBaIiB0cmFuc2Zvcm09Im1hdHJpeCgtMSwgMCwgMCwgLTEsIDAuMDAwMDI2LCAtMC4wMDAwMDUpIi8+Cjwvc3ZnPg==");
right: -8px;
bottom: 0px;
}
.tab-content[selected]::before { /* bottom curve right part of rounded tabs (other side from https://i.ibb.co/NnVTNrT/image.png) */
width: 8px;
height: 8px;
content: ' ';
position: absolute;
background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2aWV3Qm94PSIwIDAgNTAwIDUwMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZGVmcy8+CiAgPHBhdGggc3R5bGU9ImZpbGw6IHJnYig1MiwgNTMsIDU4KTsgc3Ryb2tlOiByZ2IoNTIsIDUzLCA1OCk7IHRyYW5zZm9ybS1ib3g6IGZpbGwtYm94OyB0cmFuc2Zvcm0tb3JpZ2luOiA1MCUgNTAlOyIgZD0iTSAwIDAgQyAyNTAgMCA1MDAgMjEwIDUwMCA1MDAgTCA1MDAgMCBMIDAgMCBaIiB0cmFuc2Zvcm09Im1hdHJpeCgwLCAxLCAtMSwgMCwgMC4wMDAwMSwgLTAuMDAwMDE1KSIvPgo8L3N2Zz4=");
left: -8px;
bottom: 0px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment