Предлагаю делиться внешним видом своего ФФ для поиска удачных решений в этом бесконечном процессе. Приветствуется отсылка (под спойлер) к уже установленным расширениям (стилям и etc.), что бы была возможность не просто перенять какой-либо элемент, но и понять, в результате сочетания чего с чем получилась такая красота.
скриншот:
1) с боковой панелью (+ панель инструментов)
2) без боковой панели
Mozilla Firefox 28.0 (build 20140314220517)
User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:28.0) Gecko/20100101 Firefox/28.0
*** Плагины
Shockwave Flash 15.0.0.223
*** Стили
}
/* hide tab close button */
.tabbrowser-tab .tab-close-button {
visibility: collapse !important;
}
.tabbrowser-tab:not([pinned]):hover .tab-close-button.always-right {
display: none !important;
}
/* display close tab button on tab hover */
.tabbrowser-tab:not([pinned]):hover .tab-close-button {
visibility: visible !important; margin-right:3px !important;
}
.tabbrowser-tab:not([pinned]):hover .tab-close-button {
display: -moz-box !important; margin-right:3px !important;
}
.tabbrowser-tab:not([pinned]):hover .tab-close-button.always-left {
display: -moz-box !important; margin-right:3px !important;
}
/* Move close tab button on left */
.tabbrowser-tab:not([pinned]) .tab-throbber { -moz-box-ordinal-group: 3 !important; margin-left:2px !important;}
.tabbrowser-tab:not([pinned]) .tab-icon-image { -moz-box-ordinal-group: 2 !important; margin-left:2px !important;}
.tabbrowser-tab:not([pinned]) .tab-text { -moz-box-ordinal-group: 4 !important; margin-left:2px !important; margin-right:-1px !important;}
.tabbrowser-tab:not([pinned]) .tab-close-button { -moz-box-ordinal-group: 1 !important; margin-left:2px !important;}
.tabbrowser-tab:not([pinned]) .tab-close-button[selected="true"] { -moz-user-focus: normal !important;}
/* hide tab icon on tab hover */
.tabbrowser-tab:not([pinned]):hover .tab-icon-image {
display: none !important;
}
/* hide tab throbber, TMP Lock and Reload icons on tab hover */
.tabbrowser-tab:not([pinned]):hover .tab-throbber,
.tabbrowser-tab:not([pinned]):hover .tab-lock-icon,
.tabbrowser-tab:not([pinned]):hover .tab-reload-icon {
display: none !important;
}
/* TMP-Lock-Protect-Auto Reload Icons */
.tabbrowser-tab:not([pinned]) .tab-reload-icon,
.tabbrowser-tab:not([pinned]) .tab-protect-icon,
.tabbrowser-tab:not([pinned]) .tab-lock-icon {
-moz-box-ordinal-group: 2 !important;
}
.tabbrowser-tab:not([pinned]):hover .tab-protect-icon {
margin-left:-19px !important;
}
#TabsToolbar #new-tab-button
{
-moz-appearance: none !important;
background: -moz-linear-gradient(bottom, rgba(10%,10%,10%,.4) 1px, transparent 1px),
-moz-linear-gradient(transparent, hsla(0,0%,45%,.1) 1px, hsla(0,0%,32%,.2) 80%, hsla(0,0%,0%,.2)),
-moz-linear-gradient(-moz-dialog, -moz-dialog) !important;
background-origin: border-box !important;
background-position: 1px 2px !important;
background-size: -moz-calc(100% - 2px) -moz-calc(100% - 2px) !important;
background-repeat: no-repeat !important;
margin: 0 !important;
padding: 0 !important;
-moz-border-image: url(chrome://browser/skin/tabbrowser/tab.png) 6 3 4 / 6px 3px 4px repeat stretch !important;
border-radius: 7px 7px 0 0 !important;
}
#TabsToolbar #new-tab-button:hover
{
background-image: -moz-linear-gradient(bottom, rgba(10%,10%,10%,.4) 1px, transparent 1px),
-moz-linear-gradient(hsla(0,0%,100%,.3) 1px, hsla(0,0%,75%,.2) 80%, hsla(0,0%,60%,.2)),
-moz-linear-gradient(-moz-dialog, -moz-dialog) !important;
}
#TabsToolbar #new-tab-button:-moz-lwtheme-brighttext
{
background-image: -moz-linear-gradient(hsla(0,0%,40%,.6), hsla(0,0%,30%,.6) 80%) !important;
}
#TabsToolbar #new-tab-button:-moz-lwtheme-brighttext:hover
{
background-image: -moz-linear-gradient(hsla(0,0%,60%,.6), hsla(0,0%,45%,.6) 80%) !important;
}
#TabsToolbar #new-tab-button:-moz-lwtheme-darktext
{
background-image: -moz-linear-gradient(hsla(0,0%,60%,.5), hsla(0,0%,45%,.5) 80%) !important;
}
#TabsToolbar #new-tab-button:-moz-lwtheme-darktext:hover
{
background-image: -moz-linear-gradient(hsla(0,0%,80%,.5), hsla(0,0%,60%,.5) 80%) !important;
}
@media all and (-moz-touch-enabled)
{
#TabsToolbar #new-tab-button
{
min-width: 10mozmm !important;
}
}
#TabsToolbar #new-tab-button > .toolbarbutton-icon
{
margin-top: -1px !important;
margin-bottom: -1px !important;
}
#TabsToolbar #new-tab-button
{
width: 30px !important;
}
@media all and (-moz-windows-default-theme)
{
#TabsToolbar #new-tab-button:not(:-moz-lwtheme)
{
background-image: -moz-linear-gradient(bottom, rgba(10%,10%,10%,.4) 1px, transparent 1px),
-moz-linear-gradient(transparent, hsla(0,0%,45%,.1) 1px, hsla(0,0%,32%,.2) 80%, hsla(0,0%,0%,.2)),
-moz-linear-gradient(hsl(214,44%,87%), hsl(214,44%,87%)) !important;
}
#TabsToolbar #new-tab-button:not(:-moz-lwtheme):hover
{
background-image: -moz-linear-gradient(bottom, rgba(10%,10%,10%,.4) 1px, transparent 1px),
-moz-linear-gradient(hsla(0,0%,100%,.3) 1px, hsla(0,0%,75%,.2) 80%, hsla(0,0%,60%,.2)),
-moz-linear-gradient(hsl(214,44%,87%), hsl(214,44%,87%)) !important;
}
}
/*background*/
#bg{display:none}
#content, body {
background-color: #222;
background-image: url(http://cs540104.vk.me/c7008/v7008516/fc83/XhG9bTlCOwU.jpg) !important;
padding-left: 1px !important;
background-position: bottom right !important;
background-repeat: repeat !important;
z-index:-3000!important;}
/*group background*/
.groupItem{
background-image: none !important;
background-color: #eee !important;
box-shadow: 0 0 0 1px #333, 0 0 0 6px rgba(0, 0, 0, 0.3) !important;
border: 0 solid rgba(0, 0, 0, 0.1) !important;
border-radius: 1px !important;
cursor: default !important;}
/*site border*/
.tab {background-color: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: 0 0 !important;}
/*current site*/
.tab.focus, .tab:active {background-color: #525252 !important; border-radius: 3px !important; box-shadow: 0 0 !important;}
.tab.focus .favicon, .tab:active .favicon { background-color: #525252 !important; border-color: #333 !important; box-shadow: 0 0 !important;}
/*site title*/
.tab-title { color: #777 !important; text-transform: uppercase !important; font-size: 10px; font-weight: bold;}
/*favicon(+its background)*/
.favicon { background-color: #eee !important; border-color: #bbb !important; padding: 7px !important; box-shadow: 0 0 !important;}
/*grouptitle*/
input.name { padding: 0 0 0 35px !important; color: #333 !important;}
/*permanent tabs sidebar*/
.appTabTrayContainer {border: 0 !important;
padding: 2px 5px 0 0 !important;}
/*Undo*/
.undo {
background-color: #999 !important;
box-shadow: 0 0 !important;
}
.undo:hover {
background-color: #777 !important;
}
}
#toolbar-menubar {
margin-bottom: -1px !important;
margin-top: 5px !important;
}
#urlbar, #searchbar {
margin-bottom: -1px !important;
margin-top: -1px !important;
}
scrollbar {
-moz-appearance: none !important;
background: #E8E8E8 !important;
min-height: 10px !important;
min-width: 10px !important;
}
scrollbarbutton {
display: none !important;
}
thumb {
-moz-appearance: none !important;
border: 2px solid #E8E8E8 !important;
background-color: #9C9C9C !important;
box-shadow: inset 0 0 0 1px #A8A8A8 !important;
}
thumb:hover {
background-color: #AAAAAA !important;
box-shadow: inset 0 0 0 1px #9A9A9A !important;
}
thumb:active {
background-color: #8D8D8D !important;
box-shadow: inset 0 0 0 1px #787878 !important;
}
/*
By banthaz
Version 0.9.2 (Apr 22 2012)
*/
#search-container .searchbar-textbox {
min-width:26px!important; /* ← Collapsed width */
overflow:hidden!important;
-moz-transition-property:min-width!important;
-moz-transition-duration:150ms!important; /* ← Animation duration */
}
#search-container:hover .searchbar-textbox {
-moz-transition-delay:300ms!important; /* ← Delay before expanding when hovering */
}
#search-container:hover .searchbar-textbox,
#search-container .searchbar-textbox[focused] {
min-width:200px!important; /* ← Expanded width */
}
:-moz-any(#navigator-toolbox, #addon-bar):not([customizing]) #search-container {
max-width:0!important;
}
#urlbar-search-splitter {
display:none!important;
}
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
.tabbrowser-tab[selected="true"]{
color: rgb(70,102,163) !important;
text-shadow: 0px 0px 5px rgba(70,102,163,1) !important;
/*font-weight: normal !important;*/
}
/* tabbrowser-tab focus ring */
.tabbrowser-tab:focus > .tab-stack {
color: rgb(255,255,255) !important;
text-shadow: 0 0 3px rgb(255,255,255) !important;
transition: .2s ease-in !important;
}
.tabbrowser-tabs[closebuttons="hidden"] > * > * > * > .tab-close-button:not([pinned]) {
display: -moz-box !important;
visibility: hidden !important;
}
/* hides the tabbrowser tabs favicons + close buttons when the tabs bar is not hovered */
/*.tabbrowser-tabs .tab-icon-image:not([pinned]),
.tabbrowser-tabs .tab-close-button{
opacity: 0;
}
.tabbrowser-tabs:hover .tab-close-button,
.tabbrowser-tabs:hover .tab-icon-image{
opacity: 1;
}
.tabbrowser-tabs:hover .tab-icon-image{
transition: .15s ease-in;
}*/
/* avoids newtab "+" icon to display */
/*.tabs-newtab-button{
list-style: none !important;
}*/
/* centered text position */
/*.tabbrowser-tab,
.tabs-newtab-button{
text-align: center !important;
}*/
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
#stop-button[disabled="true"],
#stop-button:not([disabled]) + #reload-button {
display: none !important;
}
toolbargrippy {
display: none !important;
}
.toolbar-holder {
border-left: none !important;
}
@-moz-document url(chrome://browser/content/browser.xul){
.tabbrowser-tab:not(:-moz-lwtheme):hover > .tab-stack > .tab-background:not([selected=true]),
.tabbrowser-tab:not(:-moz-lwtheme):not(:hover) > .tab-stack > .tab-background:not([selected=true]),
.tabs-newtab-button:not(:-moz-lwtheme) {
background-position: left bottom, 30px bottom, right bottom !important;
background-repeat: no-repeat !important;
background-size: 30px 100%, calc(100% - (2 * 30px)) 100%, 30px 100% !important;
}
.tabbrowser-tab:not(:-moz-lwtheme):hover > .tab-stack > .tab-background:not([selected=true]),
.tabbrowser-tab:not(:-moz-lwtheme):not(:hover) > .tab-stack > .tab-background:not([selected=true]){
background-image: url(chrome://browser/skin/tabbrowser/tab-background-start.png),
url(chrome://browser/skin/tabbrowser/tab-background-middle.png),
url(chrome://browser/skin/tabbrowser/tab-background-end.png) !important;
}
.tabs-newtab-button:not(:-moz-lwtheme){
background-image: url(chrome://browser/skin/tabbrowser/tab-background-start.png),
url(chrome://browser/skin/tabbrowser/tab-background-middle.png),
url(chrome://browser/skin/tabbrowser/tab-background-end.png) !important;
}
.tabs-newtab-button:not(:-moz-lwtheme):hover{
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAfCAMAAADHso01AAAAqFBMVEUAAAD////////+/v////////8uO1ITIz/////////+/v7////+//////8TIz4SIj7///8sO1QTIj7+/v/+/v7+/v4SIj4TIz4TIz4SIj4TIj/+/v7////////5+voSIj5CUWff4+YaKkT7+/waKkX///8TIz/y9Pb///+aorD7/Pz19ve0u8T9/f2Ik6LEytETIj7m6ezd4eVLWW95hpdRYXSGkaETIj7+SCl4AAAAOHRSTlMAWlxiV1UCSk1QX0tmRQMIUlMFZGFnCw4lNj5tSkl1E1NtVX8ZXy1qU2N3bmKFX2kceXZaWjlIBt+oZfAAAAEISURBVHheddHZcoMgFIBhFdfEStUqINY9MW5tki6+/5tVJ7YV0O/2H86BQdqg644zwjBECG3VuVWYRIZhbB2FIY6y/p6UwyDWEV6jz9tQtpTSQKzh2b2XSfAg7IXnrG0DeyFU7JZ0qWIeUXSjtv9HGN0kPvjHHzaYCvjNbxS8rLA5jHL/sMbOTt3ksJvn2YHCYGeTd7CfvWn1SWYwGRmdvJ9hldkqi7vZicvczRSNxa6u1d3swOsH0C6s9bNIrz5zVt+RFvXF4vzWaTNpFIu3RMcLsVtbJu8x2IMIF7lmCqboQYhSUuSyeRRIEkwrTIqmU4+xSHLS6uu774AVb5F0UwmAHD8JXmc/F4onfPeBZQUAAAAASUVORK5CYII=),
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAfBAMAAAA2O6EoAAAAKlBMVEX+/v7////////+/v7////+/v7///////////8TIz7+/v4TIz8TIz4TIj4Bz4lmAAAADnRSTlNiSlFnW15XVU0OhktLSwFavtEAAAAwSURBVAhbY5zJwMB4hv8B4yogbYyGGdBwKBJ2QcJpUFwOxUpgHAClGRg7oFgQFQMAw4wJm2VcHX0AAAAASUVORK5CYII=),
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAfCAMAAADHso01AAAAk1BMVEUAAAD+//////////////////8TIj4TIz/////////+/v7+/v8SIj7///////////8TIz7///////8sO1QTIj4TIz4TIz4SIj709fcSIj7+/v7////////+/v4TIj8ZKEOEkJ////9EU2nf4+adprP7+/waKkS9xMwTIz/z9PX9/f3m6ezd4eVRYXT+//+GkaHEytGvZV9jAAAAMXRSTlMAZlpfVVwCSlBXYWMITUtFA05SUwUMJTdsFG1KSXM/G15TVW1kf1VpLXuFeXY5WkhaD/QZywAAAPlJREFUeF590+lygyAUBWBxiQuY2ipriiRuiSZd3v/pOk7HDFxsv79HDpcRAroiTVUdDsGONE1bzuT6xV6+LOP8GLqWUbJXgJRSelzuZ25I4+folx4f9Y36OdroubuRyo83aqyZl+MnpO4tbWBs0YNXX1jwnMLlhU2d4e6RDfctBbFD19JtTxxobf87Lq7cbQ8dUQ+OHroEOFruQp0h/8QRmC12JWA2EOdg84srxp2x29+A/Mrt5RlwEZO0fksGJQO37twrlIma0Wa71KUn7if2fBVHTxn2E5eUkHXCk++Yi2HizEiyxUCGxffXh5FV8L568Zw+MUrK4Af9JCQp6SLTAAAAAABJRU5ErkJggg= !important;
}
.tabbrowser-tab:not(:-moz-lwtheme):not([selected=true]):not(:hover) .tab-background-start:-moz-locale-dir(ltr),
.tabbrowser-tab:not(:-moz-lwtheme):not([selected=true]):hover .tab-background-start:-moz-locale-dir(ltr),
.tabbrowser-tab:not(:-moz-lwtheme):not([selected=true]):not(:hover) .tab-background-end:-moz-locale-dir(rtl),
.tabbrowser-tab:not(:-moz-lwtheme):not([selected=true]):hover .tab-background-end:-moz-locale-dir(rtl) {
clip-path: url(chrome://browser/content/browser.xul#tab-curve-clip-path-start) !important;
}
.tabbrowser-tab:not(:-moz-lwtheme):not([selected=true]):not(:hover) .tab-background-end:-moz-locale-dir(ltr),
.tabbrowser-tab:not(:-moz-lwtheme):not([selected=true]):hover .tab-background-end:-moz-locale-dir(ltr),
.tabbrowser-tab:not(:-moz-lwtheme):not([selected=true]):not(:hover) .tab-background-start:-moz-locale-dir(rtl),
.tabbrowser-tab:not(:-moz-lwtheme):not([selected=true]):hover .tab-background-start:-moz-locale-dir(rtl) {
clip-path: url(chrome://browser/content/browser.xul#tab-curve-clip-path-end) !important;
}
#tabbrowser-tabs[movingtab] > .tabbrowser-tab[beforeselected]:not([last-visible-tab])::after,
.tabbrowser-tab:not([selected]):not([afterselected-visible]):not([afterhovered]):not([first-visible-tab]):not(:hover)::before,
#tabbrowser-tabs:not([overflow]) > .tabbrowser-tab[last-visible-tab]:not([selected]):not([beforehovered]):not(:hover)::after {
background-image: none !important;
}
#main-window[tabsintitlebar][sizemode="maximized"] .tab-background-middle:not([selected=true]),
#main-window[tabsintitlebar]:not([sizemode="maximized"]):not([inFullscreen]) #toolbar-menubar:-moz-any([autohide="true"][inactive], :not([autohide])) + #TabsToolbar .tab-background-middle:not([selected=true]) {
clip-path: none !important;
}
#tabbrowser-tab-tooltip {
display: none !important;
}
.tabbrowser-tab:not([pinned]):not([selected='true'])[fadein] {
min-width: 40px !important;
max-width: 40px !important;
}
.tabbrowser-tab:not([pinned])[fadein]:hover ,
.tabbrowser-tab[selected]:not([pinned])[fadein]:hover {
min-width: 200px !important;
width: 200px !important;
}
.tabbrowser-tab:not([pinned]):not(:hover):not([selected='true']) .tab-icon-image, .tabbrowser-tab:not([pinned]):not(:hover):not([selected='true']) .tab-throbber{
margin-left: 10px !important;
margin-right: 5px !important;
}
.tabbrowser-tab .tab-close-button {
display: none !important;
}
.tabbrowser-tab:not([pinned]):hover .tab-close-button.always-right {
display: none !important;
}
.tabbrowser-tab:not([pinned]):hover .tab-close-button {
visibility: visible !important;
margin-left: 0px !important;
margin-right:4px !important;
}
.tabbrowser-tab:not([pinned]):hover .tab-close-button {
display: -moz-box !important;
margin-left: 0px !important;
margin-right:4px !important;
}
.tabbrowser-tab:not([pinned]):hover .tab-close-button.always-left {
display: -moz-box !important;
margin-left: 0px !important;
margin-right:4px !important;
}
.tabbrowser-tab:not([pinned]) .tab-throbber {
-moz-box-ordinal-group: 3 !important;
margin-left: 0px !important;
margin-right:4px !important;
}
.tabbrowser-tab:not([pinned]) .tab-icon-image {
-moz-box-ordinal-group: 2 !important;
margin-left: 0px !important;
margin-right:4px !important;
}
.tabbrowser-tab:not([pinned]) .tab-text {
-moz-box-ordinal-group: 4 !important;
margin-left: 0px !important;
margin-right:0px !important;
}
.tabbrowser-tab:not([pinned]) .tab-close-button {
-moz-box-ordinal-group: 1 !important;
margin-left: 0px !important;
margin-right:4px !important;
}
.tabbrowser-tab:not([pinned]):hover .tab-icon-image {
display: none !important;
visibility: collapse !important;
}
.tabbrowser-tab:not([pinned]):hover .tab-throbber,
.tabbrowser-tab:not([pinned]):hover .tab-lock-icon,
.tabbrowser-tab:not([pinned]):hover .tab-reload-icon {
display: none !important;
}
.tabbrowser-tab:not([pinned]) .tab-reload-icon,
.tabbrowser-tab:not([pinned]) .tab-protect-icon,
.tabbrowser-tab:not([pinned]) .tab-lock-icon {
-moz-box-ordinal-group: 2 !important;
}
.tabbrowser-tab:not([pinned]):hover .tab-protect-icon {
margin-left:-19px !important;
}
}
Отсутствует
поиск.
http://forum.mozilla-russia.org/viewtopic.php?id=35232
Через сомнения приходим к истине. Цицерон
Отсутствует