Skip to content

Instantly share code, notes, and snippets.

@TaylanTatli
Created December 29, 2015 22:50
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save TaylanTatli/72d0fe03fc9b1adf0498 to your computer and use it in GitHub Desktop.
Save TaylanTatli/72d0fe03fc9b1adf0498 to your computer and use it in GitHub Desktop.
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
/* these settings used to be in userchrome.css */
/* Define colors */
:root {
/* tabs */
--theme-bg: #1D2426;
--theme-fg: #8FA388;
--tabs-bg-selected: var(--theme-bg);
--tabs-fg-selected: #BE5E1E;
--tabs-bg-hover: rgba(72,75,77,1);
--tab-icon-size: 10px;
--tabs-font: Tamsyn;
--tabs-font-size: 12px;
/* urlbar */
--url-bg: var(--theme-bg);
--url-fg: var(--tabs-fg-selected);
--url-bg-hover: var(--theme-bg);
--url-font: Tamsyn;
--url-font-size: 12px;
}
/* prevent the ugly white 'flash' while opening tabs */
tabbrowser tabpanels {
background-color: var(--theme-bg) !important;
}
/* hide some stuff */
#private-browsing-indicator,
#alltabs-button,
.tabs-newtab-button,
#urlbar-go-button,
#urlbar-stop-button,
#urlbar-reload-button,
#identity-box,
#notification-popup-box,
.urlbar-history-dropmarker
{
display: none !important;
}
/* remove the separator beside hamburger */
#PanelUI-button {
background-image: none !important;}
/*show tab close button on hover and focus only*/
.tabbrowser-tab:not([selected]):not(:hover)
.tab-close-button {
opacity:0;
}
/* hide scrollbars */
#content browser {
margin-right: -14px !important;
/* margin-bottom: -14px !important;*/
overflow-y: scroll;
overflow-x: hidden;
}
/*Frank Reduce Toolbar Height...*/
toolbarbutton {
padding-top: 0px !important;
padding-bottom: 0px !important;
}
#nav-bar {
background: var(--theme-bg) !important;
height: 23px !important;
padding-top: 0px !important;
padding-bottom: 0px !important;
}
/* Remove the pesky black lines */
#TabsToolbar:not([collapsed="true"]) + #nav-bar {
border-top: none !important;
}
/* urlbar changes */
#urlbar {
border: none !important;
background: none !important;
color: var(--url-fg) !important;
font-family: var(--url-font) !important;
font-size: var(--url-font-size) !important;
height: 20px !important;
text-align: center !important;
}
.urlbar-textbox-container:hover,.urlbar-textbox-container[focused] {
background: var(--url-bg-hover) !important;
border-color: transparent !important;
}
/* *** Back and forward buttons*** */
/* always show forward button */
#urlbar-wrapper > #forward-button {
margin:0 !important;
}
#urlbar-wrapper {
clip-path: none !important;
}
/* Strip all decorations */
#main-window:not([customizing]) #back-button[disabled] > .toolbarbutton-icon,
#back-button > .toolbarbutton-icon,
#forward-button > .toolbarbutton-icon{
background: none !important;
background-image: none !important;
border: none !important;
box-shadow: none !important;
}
/* some adjustments */
#back-button > .toolbarbutton-icon{
-moz-image-region: rect(0,54px,18px,36px) !important;
border-radius: 0 !important;
padding: 1px 2px !important;
}
#forward-button > .toolbarbutton-icon{
padding: 3px 2px !important;
}
/* add hover */
#back-button:not([disabled]):-moz-any(:hover, [open]) > .toolbarbutton-icon,
#forward-button:not([disabled]):-moz-any(:hover, [open]) > .toolbarbutton-icon {
background-image: linear-gradient(hsla(0,0%,100%,.7), hsla(0,0%,100%,.5)) !important;
box-shadow: 0 1px hsla(0,0%,100%,.3) inset,
0 1px hsla(210,54%,20%,.03),
0 0 2px hsla(210,54%,20%,.1) !important;
}
/* *** Square Tabs *** */
#TabsToolbar {
background-color: var(--theme-bg) !important;
margin-bottom: 0 !important;
font-family: var(--tabs-font) !important;
font-size: var(--tabs-font-size) !important;
text-align: center !important;
}
#TabsToolbar .arrowscrollbox-scrollbox {
padding: 0 !important;
}
#TabsToolbar .tabbrowser-tabs {
max-height: 22px !important;
min-height: 0px !important;
margin-top: 0px !important;
background-color: var(--theme-bg) !important;
}
#TabsToolbar .tabbrowser-tab {
-moz-border-top-colors: none !important;
-moz-border-left-colors: none !important;
-moz-border-right-colors: none !important;
-moz-border-bottom-colors: none !important;
border-style: none !important;
padding: 4px 0px !important;
/* background: none !important;*/
background-color: var(--theme-bg) !important;
color: var(--theme-fg) !important;
background-clip: padding-box !important;
transition: all .1s !important;
margin-left: 1px !important;
}
#TabsToolbar .tabbrowser-tab[first-tab][last-tab],
#TabsToolbar .tabbrowser-tab[last-visible-tab] {
border-right-width: 0px !important;
}
#TabsToolbar .tabbrowser-tab[afterselected] {
border-left-color: transparent !important;
}
#TabsToolbar .tabbrowser-tab[selected] {
color: var(--tabs-fg-selected) !important;
background: var(--tabs-bg-selected) !important;
/* background-clip: padding-box !important;*/
}
#TabsToolbar .tabbrowser-tab:hover:not([selected]) {
background-color: var(--tabs-bg-hover) !important;
}
#TabsToolbar .tab-background {
margin: 0 !important;
background: transparent !important;
}
#TabsToolbar .tab-background-start,
#TabsToolbar .tab-background-end,
#TabsToolbar .tabbrowser-tab:after,
#TabsToolbar .tabbrowser-tab:before {
display: none !important;
}
#TabsToolbar .tab-background-middle {
margin: -4px -2px !important;
background: transparent !important;
}
#addon-bar,
#PersonalToolbar,
#nav-bar {
background: none !important;
background-color: var(--theme-bg) !important;
box-shadow: none !important;
background-clip: padding-box !important;
border-radius: 0 !important
}
/* *** Stretch Tabs *** */
.tabbrowser-tab[fadein]:not([pinned]) {
min-width: 50px !important;
max-width: 100% !important; /*180px*/
}
/* *** Tab icons * ***/
.tab-icon-image:not([pinned]) {
display: none !important;
}
.tab-icon-image {
width: var(--tab-icon-size) !important;
height: var(--tab-icon-size) !important;
}
/* *** Icons *** */
.tab-close-button, .tabs-closebutton, #find-closebutton {
list-style-image: url("data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%00%10%00%00%00%10%08%06%00%00%00%1F%F3%FFa%00%00%00%04sBIT%08%08%08%08%7C%08d%88%00%00%00%09pHYs%00%00%0D%D7%00%00%0D%D7%01B%28%9Bx%00%00%00%19tEXtSoftware%00www.inkscape.org%9B%EE%3C%1A%00%00%00%E3IDAT8%8D%ED%91%B1J%C3P%14%86%BF%3F%B9q%C9%24%A2T%AD%E0%E6%E4%E4%D0%CD%A1%BE%90%60%09I%5DB%C0v%F0%91%04%2B8%0A%0E.%EDj%11%17%9F%40%93%DE%E3%D0%0A5%09%88%7B%BF%ED%FC%7C%FC%E7p%2Flhe%90%15%BD%CB%E1%CD%FE%CF%9C%24%F9%C1%20%2Bzm%AE%EA%C1UZ%9C%05%D2%3D%D8%7B%A9%B0%0F%10y%3FAtP%D0%BF%1D%5D%3F%AF%FB%AE%5E%B0%257%AFX%BC%82N%23%F3O%AB5%87%C0%8B%FF%2C%E7%7F%5E%00%90e%A3%DD%CA%AAG%A4%93eb3%87%3B%1F%8F%87%1Fu7h%2B0%FB%8A%81xM%8BWY%83FA%9A%E6%C7%0B%85%0FH%5D%C4%141%05%3B%AA%E4%EE%92%24%EF%D6%FD%C6%1B%94%04%3B%01l%83%CDJ%C2%0B%80%C8%FCD%B2%8E%B9h%0Fxk%BB%E4%17%FF%F9%C6%0D%F0%0D%BA%A9F%FB%14G%C1%19%00%00%00%00IEND%AEB%60%82") !important;
-moz-image-region: rect(0,16px,16px,0) !important;
}
#main-window .tabbrowser-tabs .tabs-newtab-button {
list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAMAAAAMs7fIAAAABlBMVEUAAAD///+l2Z/dAAAAAXRSTlMAQObYZgAAABlJREFUeAFjIAEwMjJSX4QRGRAjQlv3EAYAKm8ARvyZJnUAAAAASUVORK5CYII=") !important;
background: transparent !important;
margin-left: -15px !important;
margin-bottom: 5px !important;
border: transparent !important;
border-top: transparent !important;
border-left: transparent !important;
border-right: transparent !important;
}
#main-window .tabbrowser-tabs .tabs-newtab-button:hover {
list-style-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAMAAAAMs7fIAAAABlBMVEUAAAD///+l2Z/dAAAAAXRSTlMAQObYZgAAABlJREFUeAFjIAEwMjJSX4QRGRAjQlv3EAYAKm8ARvyZJnUAAAAASUVORK5CYII=") !important;
}
#PanelUI-menu-button {
list-style-image: url('data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%00%10%00%00%00%10%08%06%00%00%00%1F%F3%FFa%00%00%00%04sBIT%08%08%08%08%7C%08d%88%00%00%00%09pHYs%00%00%0D%D7%00%00%0D%D7%01B%28%9Bx%00%00%00%19tEXtSoftware%00www.inkscape.org%9B%EE%3C%1A%00%00%009IDAT8%8Dc%60%A0%1002000TT%B4%0B%92%A3%B9%A3%A3%F2%3DciES%0A%03%23%E3l%B2%AC%FF%FF%3F%95%89%2C%8D%83%0A%8C%06"%15%C0h%20R%01%00%00%E2%86%1A%86%C2%C8%D8%A4%00%00%00%00IEND%AEB%60%82') !important;
-moz-image-region: rect(0,16px,16px,0) !important;
background: transparent !important;
border: transparent !important;
border-top: transparent !important;
border-left: transparent !important;
border-right: transparent !important;
}
#PanelUI-menu-button:hover:not([disabled="true"]) {
-moz-image-region: rect(0,16px,16px,0px) !important;
background: transparent !important;
border: transparent !important;
border-top: transparent !important;
border-left: transparent !important;
border-right: transparent !important;
}
#PanelUI-menu-button[open] {
list-style-image: url('data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%00%10%00%00%00%10%08%06%00%00%00%1F%F3%FFa%00%00%00%04sBIT%08%08%08%08%7C%08d%88%00%00%00%09pHYs%00%00%0D%D7%00%00%0D%D7%01B%28%9Bx%00%00%00%19tEXtSoftware%00www.inkscape.org%9B%EE%3C%1A%00%00%00%3AIDAT8%8Dc%60%A0%1002000444p%91%A3%B9%A1%A1%E1%1Bcyy%8B%CD%3Ff%86Xr%0C%60%FA%CB%B0%98%89%1C%8D%83%0B%8C%06"%15%C0h%20R%01%00%00l%A5%1A%17%2A%AE_%A5%00%00%00%00IEND%AEB%60%82') !important;
-moz-image-region: rect(0,16px,16px,0px) !important;
background: transparent !important;
border: transparent !important;
border-top: transparent !important;
border-left: transparent !important;
border-right: transparent !important;
}
#PanelUI-button {
list-style-image: url('data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%00%10%00%00%00%10%08%06%00%00%00%1F%F3%FFa%00%00%00%04sBIT%08%08%08%08%7C%08d%88%00%00%00%09pHYs%00%00%0D%D7%00%00%0D%D7%01B%28%9Bx%00%00%00%19tEXtSoftware%00www.inkscape.org%9B%EE%3C%1A%00%00%009IDAT8%8Dc%60%A0%1002000TT%B4%0B%92%A3%B9%A3%A3%F2%3DciES%0A%03%23%E3l%B2%AC%FF%FF%3F%95%89%2C%8D%83%0A%8C%06"%15%C0h%20R%01%00%00%E2%86%1A%86%C2%C8%D8%A4%00%00%00%00IEND%AEB%60%82') !important;
width: 0px !important;
margin-left: 0px !important;
margin-right: 0px !important;
background: none !important;
}
#downloads-button {
background: url('http://i.imgur.com/dxQDPO2.png') !important;
background-repeat: no-repeat !important;
background-position: center !important;
opacity: 1 !important;
margin-left: 0px !important;
margin-right: 15px !important;
box-shadow: none !important;
width: 10px !important;
}
#toolbarbutton-icon .Downloads,
#downloads-indicator-icon,
#downloads-indicator-progress-area,
#downloads-button .button-text {
display: none !important;
}
#downloads-indicator-anchor {opacity: 0 !important;}
#downloads-button:hover {
opacity: 1 !important;
box-shadow: none !important;
background: url('http://i.imgur.com/I8kiKbo.png') !important;
background-repeat: no-repeat !important;
background-position: center !important;
}
.toolbarbutton-icon, .toolbarbutton-text, .toolbarbutton-badge-container {
background: none !important;
border: none !important;
box-shadow: none !important;
}
#plugins-notification-icon {
display: none !important;
}
/*===============================================
HIDES TAB LOADING ICON
===============================================*/
.tab-throbber:not([pinned]) {
display: none !important;
}
/*===============================================
HIDES ANNOYING ELEMENTS ON ADDRESS BAR
===============================================*/
#addonbar-closebutton ,#feed-button,#go-button,#star-button,#identity-box,.autocomplete-history-dropmarker,.scrollbutton-up,.scrollbutton-down {
display: none!important;
}
/*===============================================
HIDES CLOSE BUTTON ON TAB
===============================================*/
#tabbrowser-tabs tab .tab-close-button {
display: none !important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment