Adwaita: Update places sidebar styling

Use the new element name.
This commit is contained in:
Matthias Clasen 2015-11-05 10:38:01 -05:00
parent de3ad3781c
commit 35eaca27e4
3 changed files with 48 additions and 27 deletions

View File

@ -2503,6 +2503,7 @@ actionbar frame {
border-width: 1px 0 0;
}
placessidebar,
scrolledwindow {
viewport.frame { // avoid double borders when viewport inside scrolled window
border-style: none;
@ -2530,21 +2531,10 @@ scrolledwindow {
// Overflow indication, works similarly to the overshoot, the size if fixed tho.
undershoot {
&.top {
@include undershoot(top);
}
&.bottom {
@include undershoot(bottom);
}
&.left {
@include undershoot(left);
}
&.right {
@include undershoot(right);
}
&.top { @include undershoot(top); }
&.bottom { @include undershoot(bottom); }
&.left { @include undershoot(left); }
&.right { @include undershoot(right); }
}
junction { // the small square between two scrollbars
@ -2560,7 +2550,6 @@ scrolledwindow {
background-color: $backdrop_scrollbar_bg_color;
}
}
}
//vbox and hbox separators
@ -2911,7 +2900,7 @@ GtkSidebarRow {
}
}
GtkPlacesSidebar.sidebar {
placessidebar {
// in the sidebar case it makes no sense to click the selected row
.list-row:selected:active { box-shadow: none; }

View File

@ -3512,8 +3512,10 @@ actionbar frame {
padding: 6px;
border-width: 1px 0 0; }
placessidebar viewport.frame,
scrolledwindow viewport.frame {
border-style: none; }
placessidebar overshoot.top,
scrolledwindow overshoot.top {
background-image: -gtk-gradient(radial, center top, 0, center top, 0.5, to(#040404), to(rgba(4, 4, 4, 0))), -gtk-gradient(radial, center top, 0, center top, 0.6, from(rgba(238, 238, 236, 0.07)), to(rgba(238, 238, 236, 0)));
background-size: 100% 5%, 100% 100%;
@ -3522,6 +3524,7 @@ scrolledwindow overshoot.top {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.top:backdrop,
scrolledwindow overshoot.top:backdrop {
background-image: -gtk-gradient(radial, center top, 0, center top, 0.5, to(#1f2222), to(rgba(31, 34, 34, 0)));
background-size: 100% 5%;
@ -3530,6 +3533,7 @@ scrolledwindow overshoot.top {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.bottom,
scrolledwindow overshoot.bottom {
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.5, to(#040404), to(rgba(4, 4, 4, 0))), -gtk-gradient(radial, center bottom, 0, center bottom, 0.6, from(rgba(238, 238, 236, 0.07)), to(rgba(238, 238, 236, 0)));
background-size: 100% 5%, 100% 100%;
@ -3538,6 +3542,7 @@ scrolledwindow overshoot.bottom {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.bottom:backdrop,
scrolledwindow overshoot.bottom:backdrop {
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.5, to(#1f2222), to(rgba(31, 34, 34, 0)));
background-size: 100% 5%;
@ -3546,6 +3551,7 @@ scrolledwindow overshoot.bottom {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.left,
scrolledwindow overshoot.left {
background-image: -gtk-gradient(radial, left center, 0, left center, 0.5, to(#040404), to(rgba(4, 4, 4, 0))), -gtk-gradient(radial, left center, 0, left center, 0.6, from(rgba(238, 238, 236, 0.07)), to(rgba(238, 238, 236, 0)));
background-size: 5% 100%, 100% 100%;
@ -3554,6 +3560,7 @@ scrolledwindow overshoot.left {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.left:backdrop,
scrolledwindow overshoot.left:backdrop {
background-image: -gtk-gradient(radial, left center, 0, left center, 0.5, to(#1f2222), to(rgba(31, 34, 34, 0)));
background-size: 5% 100%;
@ -3562,6 +3569,7 @@ scrolledwindow overshoot.left {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.right,
scrolledwindow overshoot.right {
background-image: -gtk-gradient(radial, right center, 0, right center, 0.5, to(#040404), to(rgba(4, 4, 4, 0))), -gtk-gradient(radial, right center, 0, right center, 0.6, from(rgba(238, 238, 236, 0.07)), to(rgba(238, 238, 236, 0)));
background-size: 5% 100%, 100% 100%;
@ -3570,6 +3578,7 @@ scrolledwindow overshoot.right {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.right:backdrop,
scrolledwindow overshoot.right:backdrop {
background-image: -gtk-gradient(radial, right center, 0, right center, 0.5, to(#1f2222), to(rgba(31, 34, 34, 0)));
background-size: 5% 100%;
@ -3578,6 +3587,7 @@ scrolledwindow overshoot.right {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar undershoot.top,
scrolledwindow undershoot.top {
background-color: transparent;
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%);
@ -3588,6 +3598,7 @@ scrolledwindow undershoot.top {
background-position: center top;
border: none;
box-shadow: none; }
placessidebar undershoot.bottom,
scrolledwindow undershoot.bottom {
background-color: transparent;
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%);
@ -3598,6 +3609,7 @@ scrolledwindow undershoot.bottom {
background-position: center bottom;
border: none;
box-shadow: none; }
placessidebar undershoot.left,
scrolledwindow undershoot.left {
background-color: transparent;
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%);
@ -3608,6 +3620,7 @@ scrolledwindow undershoot.left {
background-position: left center;
border: none;
box-shadow: none; }
placessidebar undershoot.right,
scrolledwindow undershoot.right {
background-color: transparent;
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%);
@ -3618,12 +3631,15 @@ scrolledwindow undershoot.right {
background-position: right center;
border: none;
box-shadow: none; }
placessidebar junction,
scrolledwindow junction {
border-color: transparent;
border-image: linear-gradient(to bottom, #1c1f1f 1px, transparent 1px) 0 0 0 1/0 1px stretch;
background-color: #282c2c; }
placessidebar junction:dir(rtl),
scrolledwindow junction:dir(rtl) {
border-image-slice: 0 1 0 0; }
placessidebar junction:backdrop,
scrolledwindow junction:backdrop {
border-image-source: linear-gradient(to bottom, #1f2222 1px, transparent 1px);
background-color: #323737; }
@ -4108,11 +4124,11 @@ GtkSidebarRow .sidebar-label:dir(ltr) {
GtkSidebarRow .sidebar-label:dir(rtl) {
padding-left: 2px; }
GtkPlacesSidebar.sidebar .list-row:selected:active {
placessidebar .list-row:selected:active {
box-shadow: none; }
GtkPlacesSidebar.sidebar .sidebar-placeholder-row {
placessidebar .sidebar-placeholder-row {
border: solid 1px #215d9c; }
GtkPlacesSidebar.sidebar .sidebar-new-bookmark-row {
placessidebar .sidebar-new-bookmark-row {
color: #215d9c; }
.sidebar-button.button {
border-radius: 100%;
@ -4504,7 +4520,7 @@ calendar:selected, label:selected, label:selected:focus, label:selected:hover, .
textview text:insensitive:selected,
.view:insensitive:selected,
calendar:insensitive:selected, label:insensitive:selected, .grid-child:insensitive:selected, entry:insensitive:selected, spinbutton:insensitive:selected, modelbutton.flat:insensitive:selected,
.menuitem.button.flat:insensitive:selected, .list-row:insensitive:selected, .sidebar:insensitive:selected, GtkPlacesSidebar.sidebar .list-row:selected:insensitive label {
.menuitem.button.flat:insensitive:selected, .list-row:insensitive:selected, .sidebar:insensitive:selected, placessidebar .list-row:selected:insensitive label {
color: #90aece; }
textview text:backdrop:selected,
.view:backdrop:selected,
@ -4514,7 +4530,7 @@ calendar:selected, label:selected, label:selected:focus, label:selected:hover, .
textview text:backdrop:insensitive:selected,
.view:backdrop:insensitive:selected,
calendar:backdrop:insensitive:selected, label:backdrop:insensitive:selected, .grid-child:backdrop:insensitive:selected, entry:backdrop:insensitive:selected, spinbutton:backdrop:insensitive:selected, modelbutton.flat:backdrop:insensitive:selected,
.menuitem.button.flat:backdrop:insensitive:selected, .list-row:backdrop:insensitive:selected, .sidebar:backdrop:insensitive:selected, GtkPlacesSidebar.sidebar .list-row:selected:insensitive label:backdrop, GtkPlacesSidebar.sidebar .list-row:selected:backdrop:insensitive label {
.menuitem.button.flat:backdrop:insensitive:selected, .list-row:backdrop:insensitive:selected, .sidebar:backdrop:insensitive:selected, placessidebar .list-row:selected:insensitive label:backdrop, placessidebar .list-row:selected:backdrop:insensitive label {
color: #648eba; }
.monospace {

View File

@ -3674,8 +3674,10 @@ actionbar frame {
padding: 6px;
border-width: 1px 0 0; }
placessidebar viewport.frame,
scrolledwindow viewport.frame {
border-style: none; }
placessidebar overshoot.top,
scrolledwindow overshoot.top {
background-image: -gtk-gradient(radial, center top, 0, center top, 0.5, to(#878787), to(rgba(135, 135, 135, 0))), -gtk-gradient(radial, center top, 0, center top, 0.6, from(rgba(46, 52, 54, 0.07)), to(rgba(46, 52, 54, 0)));
background-size: 100% 5%, 100% 100%;
@ -3684,6 +3686,7 @@ scrolledwindow overshoot.top {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.top:backdrop,
scrolledwindow overshoot.top:backdrop {
background-image: -gtk-gradient(radial, center top, 0, center top, 0.5, to(darkgray), to(rgba(169, 169, 169, 0)));
background-size: 100% 5%;
@ -3692,6 +3695,7 @@ scrolledwindow overshoot.top {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.bottom,
scrolledwindow overshoot.bottom {
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.5, to(#878787), to(rgba(135, 135, 135, 0))), -gtk-gradient(radial, center bottom, 0, center bottom, 0.6, from(rgba(46, 52, 54, 0.07)), to(rgba(46, 52, 54, 0)));
background-size: 100% 5%, 100% 100%;
@ -3700,6 +3704,7 @@ scrolledwindow overshoot.bottom {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.bottom:backdrop,
scrolledwindow overshoot.bottom:backdrop {
background-image: -gtk-gradient(radial, center bottom, 0, center bottom, 0.5, to(darkgray), to(rgba(169, 169, 169, 0)));
background-size: 100% 5%;
@ -3708,6 +3713,7 @@ scrolledwindow overshoot.bottom {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.left,
scrolledwindow overshoot.left {
background-image: -gtk-gradient(radial, left center, 0, left center, 0.5, to(#878787), to(rgba(135, 135, 135, 0))), -gtk-gradient(radial, left center, 0, left center, 0.6, from(rgba(46, 52, 54, 0.07)), to(rgba(46, 52, 54, 0)));
background-size: 5% 100%, 100% 100%;
@ -3716,6 +3722,7 @@ scrolledwindow overshoot.left {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.left:backdrop,
scrolledwindow overshoot.left:backdrop {
background-image: -gtk-gradient(radial, left center, 0, left center, 0.5, to(darkgray), to(rgba(169, 169, 169, 0)));
background-size: 5% 100%;
@ -3724,6 +3731,7 @@ scrolledwindow overshoot.left {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.right,
scrolledwindow overshoot.right {
background-image: -gtk-gradient(radial, right center, 0, right center, 0.5, to(#878787), to(rgba(135, 135, 135, 0))), -gtk-gradient(radial, right center, 0, right center, 0.6, from(rgba(46, 52, 54, 0.07)), to(rgba(46, 52, 54, 0)));
background-size: 5% 100%, 100% 100%;
@ -3732,6 +3740,7 @@ scrolledwindow overshoot.right {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar overshoot.right:backdrop,
scrolledwindow overshoot.right:backdrop {
background-image: -gtk-gradient(radial, right center, 0, right center, 0.5, to(darkgray), to(rgba(169, 169, 169, 0)));
background-size: 5% 100%;
@ -3740,6 +3749,7 @@ scrolledwindow overshoot.right {
background-color: transparent;
border: none;
box-shadow: none; }
placessidebar undershoot.top,
scrolledwindow undershoot.top {
background-color: transparent;
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%);
@ -3750,6 +3760,7 @@ scrolledwindow undershoot.top {
background-position: center top;
border: none;
box-shadow: none; }
placessidebar undershoot.bottom,
scrolledwindow undershoot.bottom {
background-color: transparent;
background-image: linear-gradient(to left, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%);
@ -3760,6 +3771,7 @@ scrolledwindow undershoot.bottom {
background-position: center bottom;
border: none;
box-shadow: none; }
placessidebar undershoot.left,
scrolledwindow undershoot.left {
background-color: transparent;
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%);
@ -3770,6 +3782,7 @@ scrolledwindow undershoot.left {
background-position: left center;
border: none;
box-shadow: none; }
placessidebar undershoot.right,
scrolledwindow undershoot.right {
background-color: transparent;
background-image: linear-gradient(to top, rgba(255, 255, 255, 0.2) 50%, rgba(0, 0, 0, 0.2) 50%);
@ -3780,12 +3793,15 @@ scrolledwindow undershoot.right {
background-position: right center;
border: none;
box-shadow: none; }
placessidebar junction,
scrolledwindow junction {
border-color: transparent;
border-image: linear-gradient(to bottom, #a1a1a1 1px, transparent 1px) 0 0 0 1/0 1px stretch;
background-color: #dbdbdb; }
placessidebar junction:dir(rtl),
scrolledwindow junction:dir(rtl) {
border-image-slice: 0 1 0 0; }
placessidebar junction:backdrop,
scrolledwindow junction:backdrop {
border-image-source: linear-gradient(to bottom, darkgray 1px, transparent 1px);
background-color: #e5e5e5; }
@ -4280,11 +4296,11 @@ GtkSidebarRow .sidebar-label:dir(ltr) {
GtkSidebarRow .sidebar-label:dir(rtl) {
padding-left: 2px; }
GtkPlacesSidebar.sidebar .list-row:selected:active {
placessidebar .list-row:selected:active {
box-shadow: none; }
GtkPlacesSidebar.sidebar .sidebar-placeholder-row {
placessidebar .sidebar-placeholder-row {
border: solid 1px #4a90d9; }
GtkPlacesSidebar.sidebar .sidebar-new-bookmark-row {
placessidebar .sidebar-new-bookmark-row {
color: #4a90d9; }
.sidebar-button.button {
border-radius: 100%;
@ -4677,7 +4693,7 @@ calendar:selected, label:selected, label:selected:focus, label:selected:hover, .
textview text:insensitive:selected,
.view:insensitive:selected,
calendar:insensitive:selected, label:insensitive:selected, .grid-child:insensitive:selected, entry:insensitive:selected, spinbutton:insensitive:selected, modelbutton.flat:insensitive:selected,
.menuitem.button.flat:insensitive:selected, .list-row:insensitive:selected, .sidebar:insensitive:selected, GtkPlacesSidebar.sidebar .list-row:selected:insensitive label {
.menuitem.button.flat:insensitive:selected, .list-row:insensitive:selected, .sidebar:insensitive:selected, placessidebar .list-row:selected:insensitive label {
color: #a5c8ec; }
textview text:backdrop:selected,
.view:backdrop:selected,
@ -4687,7 +4703,7 @@ calendar:selected, label:selected, label:selected:focus, label:selected:hover, .
textview text:backdrop:insensitive:selected,
.view:backdrop:insensitive:selected,
calendar:backdrop:insensitive:selected, label:backdrop:insensitive:selected, .grid-child:backdrop:insensitive:selected, entry:backdrop:insensitive:selected, spinbutton:backdrop:insensitive:selected, modelbutton.flat:backdrop:insensitive:selected,
.menuitem.button.flat:backdrop:insensitive:selected, .list-row:backdrop:insensitive:selected, .sidebar:backdrop:insensitive:selected, GtkPlacesSidebar.sidebar .list-row:selected:insensitive label:backdrop, GtkPlacesSidebar.sidebar .list-row:selected:backdrop:insensitive label {
.menuitem.button.flat:backdrop:insensitive:selected, .list-row:backdrop:insensitive:selected, .sidebar:backdrop:insensitive:selected, placessidebar .list-row:selected:insensitive label:backdrop, placessidebar .list-row:selected:backdrop:insensitive label {
color: #80b1e4; }
.monospace {