stonewareslord/treestyletab
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Hide scrollbar shown with negative margin

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

68
skin/classic/treestyletab/metal/base.css
View File

@ -40,6 +40,23 @@
border-width: 1px 0 0 !important; border-width: 1px 0 0 !important;
padding: 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"] { .tabbrowser-tabs[treestyletab-mode="vertical"] {
appearance: none !important; appearance: none !important;
@ -51,14 +68,20 @@
.tabbrowser-tabs[treestyletab-mode="vertical"]:not([overflow="true"]) .tabbrowser-tabs[treestyletab-mode="vertical"]:not([overflow="true"])
.tabbrowser-arrowscrollbox, .tabbrowser-arrowscrollbox,
.tabbrowser-tabs[treestyletab-mode="vertical"][overflow="true"] .tabbrowser-tabs[treestyletab-mode="vertical"][overflow="true"]
.tabbrowser-arrowscrollbox .scrollbox-innerbox { .tabbrowser-arrowscrollbox
background: url("shadow-active-l.png") repeat-y top right !important; 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-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]:not([overflow="true"])
.tabbrowser-arrowscrollbox, .tabbrowser-arrowscrollbox,
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"][overflow="true"] .tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"][overflow="true"]
.tabbrowser-arrowscrollbox .scrollbox-innerbox { .tabbrowser-arrowscrollbox
background: url("shadow-active-r.png") repeat-y top left !important; scrollbox {
background-image: url("shadow-active-r.png") !important;
background-repeat: repeat-y !important;
background-position: top left !important;
} }
.tabbrowser-tabs[treestyletab-mode="vertical"] .tabbrowser-tabs[treestyletab-mode="vertical"]
@ -100,8 +123,30 @@ tabbrowser[treestyletab-tabbar-position="right"]
background: #acacac !important; background: #acacac !important;
border-color: #797979 !important; border-color: #797979 !important;
} }
/* these styles are required to cover narrow scrollbars. */
:root:-moz-window-inactive :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; background: transparent !important;
} }
@ -110,8 +155,11 @@ tabbrowser[treestyletab-tabbar-position="right"]
.tabbrowser-arrowscrollbox, .tabbrowser-arrowscrollbox,
:root:-moz-window-inactive :root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"][overflow="true"] .tabbrowser-tabs[treestyletab-mode="vertical"][overflow="true"]
.tabbrowser-arrowscrollbox .scrollbox-innerbox { .tabbrowser-arrowscrollbox
background: url("shadow-inactive-l.png") repeat-y top right !important; scrollbox {
background-image: url("shadow-inactive-l.png") !important;
background-repeat: repeat-y !important;
background-position: top right !important;
} }
:root:-moz-window-inactive :root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"]:not([overflow="true"]) .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 :root:-moz-window-inactive
.tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"][overflow="true"] .tabbrowser-tabs[treestyletab-mode="vertical"][treestyletab-tab-inverted="true"][overflow="true"]
.tabbrowser-arrowscrollbox .tabbrowser-arrowscrollbox
.scrollbox-innerbox { scrollbox {
background: url("shadow-inactive-r.png") repeat-y top left !important; background-image: url("shadow-inactive-r.png") !important;
background-repeat: repeat-y !important;
background-position: top left !important;
} }
:root:-moz-window-inactive :root:-moz-window-inactive

48
skin/classic/treestyletab/sidebar/sidebar.css
View File

@ -18,12 +18,54 @@
/* Background colour for the tree sidebar (light blue when window is /* Background colour for the tree sidebar (light blue when window is
active, grey otherwise) */ active, grey otherwise) */
.tabbrowser-strip[treestyletab-mode="vertical"] { .tabbrowser-strip[treestyletab-mode="vertical"] {
background: transparent !important; background: #d4dde5 !important;
background-color: #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 #main-window:-moz-window-inactive
.tabbrowser-strip:not([treestyletab-style~="aero"])[treestyletab-mode="vertical"] { .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 */ /* autohide */
.treestyletab-tabbar-toolbar[treestyletab-tabbar-autohide][treestyletab-mode="vertical"] .treestyletab-tabbar-toolbar[treestyletab-tabbar-autohide][treestyletab-mode="vertical"]