SpaceGray Base 16 Eighties Dark theme for stylish

spacegray-stylish.css

/* * * * * * 
Adapted from:
http://noha-ra.deviantart.com/art/Melbourne-Firefox-CSS-FF-29-and-above-473887761 
* * * * * * */

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
 
 
/*remove internal border*/
 
#main-window:not([chromehidden*="toolbar"])[sizemode="normal"]
{
 margin-top:-1px!important;
 margin-left:-1px!important;
 margin-right:-1px!important;
 margin-bottom: -1px !important;
 }
 
 
/*comment these lines to have normal tab width*/
 
.tabbrowser-tabs:not([drag=detach]) > .tabbrowser-tab:not([pinned])[fadein] {
min-width: 10px !important;
max-width: 180px !important;
}
/*comment above to have normal tab width*/
 
 
/* removes ugly cloud thing */
#TabsToolbar:not(:-moz-lwtheme)::after {display: none;}
/* Remove the following line if you want the text color of unselected tabs to be black (Firefox default) */
#TabsToolbar .tabbrowser-tab:not([selected]) {color: rgba(255,255,255,0.9);}
 
#TabsToolbar {
    background:#393939 !important;
    margin-bottom: 0px !important;
}
 
 
 
#TabsToolbar .tabbrowser-tabs {
    background: rgba(240,240,240,1) !important;
    background: #2d2d2d !important;
    min-height: 30px !important;
    margin-top: 0px !important;
    margin-bottom: -1px !important;
    text-align: left !important;
    margin-left: -17px !important;
    margin-right: -16px !important;
}
 
#tabbrowser-tabs tab .tab-close-button {
    background: url(https://raw.githubusercontent.com/kkga/spacegray/master/Spacegray/close.png) !important;
    background-position: center !important;
    opacity: 0.42;
}

/*
#tabbrowser-tabs tab .tab-close-button:hover {
    background: url(https://raw.githubusercontent.com/kkga/spacegray/master/Spacegray/folder-closed.png) !important;
    background: rgba(127,127,127, 100) !important;
    background-position: center !important;
}
*/
 
.tabbrowser-tab:not([pinned]) .tab-icon-image {
   display: none !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:  solid !important;
    border-width: 0px 0px 0px 0px !important;
    text-shadow: 0 0 4px rgba(80,80,80,.2) !important;
    padding: 10px 5px !important;
    border-radius: 0px !important;
    /*background: rgba(245,245,245,1) !important;*/
    background: #2d2d2d !important;
    background-clip: padding-box !important;
    transition: all .1s !important;
    margin: 0px 0px 0 0px !important;
    color:  #605e56 !important;
    font-family: 'Terminus' !important;
    font-size: 13px !important;
    border-color: #fff !important;
}
 
#TabsToolbar .tabbrowser-tab[last-visible-tab] {
    border-top-right-radius: 2px !important;
    /*border-bottom-right-radius: 3px !important;*/
    border-right-width: 0px !important;
    margin-right: 1px !important;
    border-right-color: rgba(0,0,0,0) !important;
}
 
#TabsToolbar .tabbrowser-tab[first-visible-tab] {
    border-top-left-radius: 2px !important;
    /*border-bottom-left-radius: 3px !important;*/
    border-left-width: 0px !important;
    margin-left: 2px !important;
    border-left-color: rgba(0,0,0,0) !important;
}
 
#TabsToolbar .tabbrowser-tab[afterselected] {
}
 
/* selected tab */

#TabsToolbar .tabbrowser-tab[selected] {
    color: rgba(90,90,90,1) !important;
    background: #424242 !important;
    /*background: rgba(155,201,251,1) !important;*/
    padding: 0px 0px !important;
    color: #cad0c4 !important;
}
 
/* background tab hover color */

#TabsToolbar .tabs-newtab-button:hover,
#TabsToolbar .tabbrowser-tab:hover:not([selected]) {
    border-color: rgba(0,0,0,0) !important;
    background-color: #2d2d2d !important;
    color: #cad0c4 !important;
}
 
#TabsToolbar .tab-background {
    margin: 0 !important;
    background: transparent !important;
}
 
#TabsToolbar .tab-background-start,
#TabsToolbar .tab-background-end {
    display: none !important;
}
 
#TabsToolbar .tab-background-middle {
    margin: -4px -2px !important;
    background: transparent !important;
}
 
#TabsToolbar .tabbrowser-tab:after,
#TabsToolbar .tabbrowser-tab:before {
    display: none !important;
}
 
#TabsToolbar .tabs-newtab-button {
    display: none;
    border-width: 1px 1px 0 1px !important;
    margin: 0 !important;
    width: auto !important;
    padding: 0 5px !important;
}
 
#addon-bar,
#PersonalToolbar,
#nav-bar {
    background: #EAF2FA !important;
    box-shadow: none !important;
    background-clip: padding-box !important;
    border-color: rgba(0,0,0,.25) !important;
    border-radius: 0 !important;
}
 
.subviewbutton.panel-subview-footer {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
}
 
 
/* URL BAR */
 
/* remove back/fwd */
 
#nav-bar  #back-button > .toolbarbutton-icon {
 display: none !important;
}
 #forward-button {
 display: none !important;
}
 
/*styling*/
#searchbar > .searchbar-textbox,
 
#urlbar {
    border: 1px solid rgb(230,230,230) !important;
    text-align: left !important;;
    background: rgba(255,255,255,1) !important;
    /*background: #EFEFEF !important;*/
    margin-top: 0px !important;
    margin-left: 5px !important;
    border-radius: 0px;
    padding: 0 0 0 10px !important;
    color:  #424242 !important;
    height: 30px;
}
 
 
#nav-bar {
    height: 43px;
    background-color: rgba(251,251,251,1) !important;
    border-bottom: 0px solid #C8C8C8 !important;
    border-top: 0px solid #c8c8c8 !important;
    margin-bottom: -1px !important;
    margin-top: 1px !important;
    border-left: none !important;
    border-right: none !important;
    margin-right: 1px !important;
    margin-left: 1px !important;
}
   
  #PanelUI-button, #customization-panel-container,
  #customization-panelWrapper .panel-arrow,
  #ctr_panelui-button,
  #wrapper-ctr_panelui-button {
 
    -moz-box-ordinal-group: 0
 
  }
 
 
#PanelUI-button {
 
    background-position: 100% 0, calc(100% - 1px) 0, calc(100% - 2px) 0;
    background: url('http://i.imgur.com/NEflko3.png') !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    box-shadow: none !important;
    width: 5px !important;
    /*display: none !important; /*COMMENT THIS LINE FOR A MENU BUTTON*/
  }
#PanelUI-button .button-icon,
#PanelUI-button .button-text{
    display: none !important;
}
#PanelUI-menu-button {
    opacity: 0 !important;
    width: 5px !important;
    margin-right: -5px !important;
}
 
 
#identity-box, #dropmarker-icon, #historydropmarker, #autocomplete-history-dropmarker, #urlbar-history-dropmarker, #dropmarker {
    display: none !important;
}
 
#autocomplete-history-dropmarker, #urlbar-history-dropmarker, #urlbar-reload-button {
    display: none !important;
}
 
.autocomplete-history-dropmarker.urlbar-history-dropmarker {
    display: none !important;
}
 
#plugins-notification-icon, #notification-anchor-icon, #notification-popup-box {
    display: none !important;
   
}
 
/* remove tab scrolling */
 
.scrollbutton-up, .scrollbutton-down, #alltabs-button {
    display: none !important;
}
 
/*downloads*/
#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: 10px !important;
    margin-right: 10px !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;
}