Hide scrollbar shown with negative margin

This commit is contained in:
Piro / YUKI Hiroshi 2016-02-13 03:11:41 +09:00
parent 1ab934b58e
commit bc3493db26
2 changed files with 104 additions and 12 deletions

View File

@ -40,6 +40,23 @@
border-width: 1px 0 0 !important;
padding: 0 !important;
}
/* these styles are required to cover narrow scrollbars. */
.tabbrowser-tabs[treestyletab-mode="vertical"]
.scrollbox-innerbox {
background: linear-gradient(to left,
rgba(121,121,121,1) 0%,
rgba(121,121,121,1) 10%,
rgba(121,121,121,0) 11%,
rgba(121,121,121,0) 100%) !important;
}
.tabbrowser-tabs[treestyletab-tabbar-position="left"][treestyletab-invert-scrollbar="true"]
.scrollbox-innerbox {
background: linear-gradient(to right,
rgba(121,121,121,1) 0%,
rgba(121,121,121,1) 10%,
rgba(121,121,121,0) 11%,
rgba(121,121,121,0) 100%) !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"] {
appearance: none !important;
@ -51,14 +68,20 @@
.tabbrowser-tabs[treestyletab-mode="vertical"]:not([overflow="true"])
.tabbrowser-arrowscrollbox,
.tabbrowser-tabs[treestyletab-mode="vertical"][overflow="true"]
.tabbrowser-arrowscrollbox .scrollbox-innerbox {
background: url("shadow-active-l.png") repeat-y top right !important;
.tabbrowser-arrowscrollbox
scrollbox {
background-image: url("shadow-active-l.png") !important;
background-repeat: repeat-y !important;
background-position: top right !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]:not([overflow="true"])
.tabbrowser-arrowscrollbox,
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"][overflow="true"]
.tabbrowser-arrowscrollbox .scrollbox-innerbox {
background: url("shadow-active-r.png") repeat-y top left !important;
.tabbrowser-arrowscrollbox
scrollbox {
background-image: url("shadow-active-r.png") !important;
background-repeat: repeat-y !important;
background-position: top left !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
@ -100,8 +123,30 @@ tabbrowser[treestyletab-tabbar-position="right"]
background: #acacac !important;
border-color: #797979 !important;
}
/* these styles are required to cover narrow scrollbars. */
:root:-moz-window-inactive
.tabbrowser-strip[treestyletab-mode="vertical"][treestyletab-style~="aero"] {
.tabbrowser-tabs[treestyletab-mode="vertical"]
.scrollbox-innerbox {
background: linear-gradient(to left,
rgba(172,172,172,1) 0%,
rgba(172,172,172,1) 10%,
rgba(172,172,172,0) 11%,
rgba(172,172,172,0) 100%) !important;
}
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-tabbar-position="left"][treestyletab-invert-scrollbar="true"]
.scrollbox-innerbox {
background: linear-gradient(to right,
rgba(172,172,172,1) 0%,
rgba(172,172,172,1) 10%,
rgba(172,172,172,0) 11%,
rgba(172,172,172,0) 100%) !important;
}
:root:-moz-window-inactive
.tabbrowser-strip[treestyletab-mode="vertical"][treestyletab-style~="aero"],
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-style~="aero"]
.scrollbox-innerbox {
background: transparent !important;
}
@ -110,8 +155,11 @@ tabbrowser[treestyletab-tabbar-position="right"]
.tabbrowser-arrowscrollbox,
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"][overflow="true"]
.tabbrowser-arrowscrollbox .scrollbox-innerbox {
background: url("shadow-inactive-l.png") repeat-y top right !important;
.tabbrowser-arrowscrollbox
scrollbox {
background-image: url("shadow-inactive-l.png") !important;
background-repeat: repeat-y !important;
background-position: top right !important;
}
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]:not([overflow="true"])
@ -119,8 +167,10 @@ tabbrowser[treestyletab-tabbar-position="right"]
:root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"][overflow="true"]
.tabbrowser-arrowscrollbox
.scrollbox-innerbox {
background: url("shadow-inactive-r.png") repeat-y top left !important;
scrollbox {
background-image: url("shadow-inactive-r.png") !important;
background-repeat: repeat-y !important;
background-position: top left !important;
}
:root:-moz-window-inactive

View File

@ -18,12 +18,54 @@
/* Background colour for the tree sidebar (light blue when window is
active, grey otherwise) */
.tabbrowser-strip[treestyletab-mode="vertical"] {
background: transparent !important;
background-color: #d4dde5 !important;
background: #d4dde5 !important;
}
/* these styles are required to cover narrow scrollbars. */
.tabbrowser-tabs[treestyletab-mode="vertical"]
.scrollbox-innerbox {
background: linear-gradient(to left,
rgba(212,221,229,1) 0%,
rgba(212,221,229,1) 10%,
rgba(212,221,229,0) 11%,
rgba(212,221,229,0) 100%) !important;
}
.tabbrowser-tabs[treestyletab-tabbar-position="left"][treestyletab-invert-scrollbar="true"]
.scrollbox-innerbox {
background: linear-gradient(to right,
rgba(212,221,229,1) 0%,
rgba(212,221,229,1) 10%,
rgba(212,221,229,0) 11%,
rgba(212,221,229,0) 100%) !important;
}
.tabbrowser-tabs[treestyletab-mode="vertical"]
.scrollbox-innerbox {
background: linear-gradient(to left,
rgba(212,221,229,1) 0%,
rgba(212,221,229,1) 10%,
rgba(212,221,229,0) 11%,
rgba(212,221,229,0) 100%) !important;
}
.tabbrowser-tabs[treestyletab-tabbar-position="left"][treestyletab-invert-scrollbar="true"]
.scrollbox-innerbox {
background: linear-gradient(to right,
rgba(212,221,229,1) 0%,
rgba(212,221,229,1) 10%,
rgba(212,221,229,0) 11%,
rgba(212,221,229,0) 100%) !important;
}
#main-window:-moz-window-inactive
.tabbrowser-strip:not([treestyletab-style~="aero"])[treestyletab-mode="vertical"] {
background-color: #e8e8e8 !important;
background: #e8e8e8 !important;
}
#main-window:-moz-window-inactive
.tabbrowser-tabs:not([treestyletab-style~="aero"])[treestyletab-mode="vertical"]
.scrollbox-innerbox {
background: linear-gradient(to right,
rgba(232,232,232,1) 0%,
rgba(232,232,232,1) 10%,
rgba(232,232,232,0) 11%,
rgba(232,232,232,0) 100%) !important;
}
/* autohide */
.treestyletab-tabbar-toolbar[treestyletab-tabbar-autohide][treestyletab-mode="vertical"]