diff --git a/gtk-3.20/scss/_global.scss b/gtk-3.20/scss/_global.scss
index 94dc3e9..7c803d7 100755
--- a/gtk-3.20/scss/_global.scss
+++ b/gtk-3.20/scss/_global.scss
@@ -113,6 +113,8 @@ $backdrop_scrollbar_slider_color: mix($backdrop_fg_color, $backdrop_bg_color, .4
$backdrop_menu_color: if($variant == 'light', $backdrop_base_color, mix($backdrop_bg_color, $backdrop_base_color, .2));
+$drop_target_color: #4e9a06;
+
// widget styles
$roundness: 2px;
$spacing: 5px;
diff --git a/gtk-3.20/scss/widgets/_base.scss b/gtk-3.20/scss/widgets/_base.scss
index 2d5b27d..76f1e8f 100755
--- a/gtk-3.20/scss/widgets/_base.scss
+++ b/gtk-3.20/scss/widgets/_base.scss
@@ -128,5 +128,5 @@ assistant {
.sidebar label { padding: 6px 12px; }
- .sidebar label.highlight { background-color: mix($bg_color, $fg_color, .8); }
+ .sidebar label.highlight { background-color: mix($fg_color, $bg_color, .8); }
}
diff --git a/gtk-3.20/scss/widgets/_button.scss b/gtk-3.20/scss/widgets/_button.scss
index bc8c35a..5de0559 100755
--- a/gtk-3.20/scss/widgets/_button.scss
+++ b/gtk-3.20/scss/widgets/_button.scss
@@ -3,6 +3,47 @@
**********/
@include exports("button_extends") {
+ // stuff for .needs-attention
+ $_dot_color: if($variant=='light', $selected_bg_color, lighten($selected_bg_color, .15));
+
+ @keyframes needs_attention {
+ from {
+ background-image: -gtk-gradient(radial, center center, 0, center center, .01, to($_dot_color), to(transparent));
+ }
+
+ to {
+ background-image: -gtk-gradient(radial, center center, 0, center center, .5, to($selected_bg_color), to(transparent));
+ }
+ }
+
+ %needs_attention {
+ animation: needs_attention 150ms ease-in;
+ $_dot_shadow: _text_shadow_color();
+ $_dot_shadow_r: if($variant=='light', .5, .45);
+ background-image: -gtk-gradient(radial, center center, 0, center center, .5, to($_dot_color), to(transparent)),
+ -gtk-gradient(radial, center center, 0, center center, $_dot_shadow_r, to($_dot_shadow), to(transparent));
+ background-size: 6px 6px, 6px 6px;
+ background-repeat: no-repeat;
+
+ @if $variant == 'light' {
+ background-position: right 3px, right 4px;
+ }
+ @else {
+ background-position: right 3px, right 2px;
+ }
+
+ &:backdrop { background-size: 6px 6px, 0 0; }
+
+ &:dir(rtl) {
+ @if $variant == 'light' {
+ background-position: left 3px, left 4px;
+ }
+ @else {
+ background-position: left 3px, left 2px;
+ }
+ }
+ }
+
%button {
padding: $spacing ($spacing + 2px);
border-width: 1px;
diff --git a/gtk-3.20/scss/widgets/_misc.scss b/gtk-3.20/scss/widgets/_misc.scss
index 36d446c..8b07598 100644
--- a/gtk-3.20/scss/widgets/_misc.scss
+++ b/gtk-3.20/scss/widgets/_misc.scss
@@ -239,7 +239,7 @@
@at-root %nobg_selected_items, & {
color: $selected_fg_color;
- @if $variant == 'light' { outline-color: transparentize($selected_fg_color, 0.7); }
+ @if $variant == 'light' { outline-color: transparentize($selected_fg_color, .7); }
&:disabled { color: mix($selected_fg_color, $selected_bg_color, .5); }
diff --git a/gtk-3.20/scss/widgets/_sidebar.scss b/gtk-3.20/scss/widgets/_sidebar.scss
index 3316b8b..c5a8651 100755
--- a/gtk-3.20/scss/widgets/_sidebar.scss
+++ b/gtk-3.20/scss/widgets/_sidebar.scss
@@ -4,78 +4,150 @@
@include exports("sidebar") {
.sidebar {
- &, &.view, .view, view, scrolledwindow {
+ border-style: none;
+
+ &, .view { // .view, nemo sidebar fix.
background-color: $bg_color;
color: mix($fg_color, $bg_color, .1);
-
- &.separator, separator {
- &, &:hover, &:focus {
- border-width: 1px;
- border-style: solid;
- border-color: shade($bg_color, .9);
- color: shade($bg_color, .9);
- }
- }
}
- row, .view row, view row {
- &:selected {
- &, &:hover, &:focus {
- border: 0;
- background-image: none;
- background-color: $selected_bg_color;
- color: $selected_fg_color;
- }
-
- &:hover {
- border: 0;
- background-image: none;
- background-color: shade($selected_bg_color, 1.05);
- color: $selected_fg_color;
- }
- }
-
- &:hover {
- border: 0;
- background-image: none;
- background-color: shade($bg_color, 1.05);
- }
+ @at-root %sidebar_left,
+ &:dir(ltr),
+ &.left,
+ &.left:dir(rtl) {
+ border-right: 1px solid $borders_color;
+ border-left-style: none;
}
- .sidebar-label {
- padding-left: $spacing;
- padding-right: $spacing;
+ @at-root %sidebar_right
+ &:dir(rtl),
+ &.right {
+ border-left: 1px solid $borders_color;
+ border-right-style: none;
+ }
+
+ &:backdrop {
+ background-color: $backdrop_sidebar_bg_color;
+ border-color: $backdrop_borders_color;
+ transition: $backdrop_transition;
}
.frame, frame { border-width: 0; }
- .sidebar-icon {
- padding-left: $spacing * 2;
- padding-right: $spacing * 2;
- }
+ list { background-color: transparent; }
- assistant & {
- padding: $spacing;
- border-width: 0 1px 0 0;
- border-style: solid;
- border-right-color: border_normal($bg_color);
- border-radius: 0;
- background-color: $bg_color;
- color: mix($fg_color, $bg_color, .1);
+ paned & { &.left, &.right, &.left:dir(rtl), &:dir(rtl), &:dir(ltr), & { border-style: none; } }
+ }
- &:dir(ltr) { border-width: 0 1px 0 0; }
-
- &:dir(rtl) { border-width: 0 0 0 1px; }
-
- label {
- padding: $spacing ($spacing * 2);
-
- &.highlight { background-color: mix($bg_color, $fg_color, .8); }
+ stacksidebar {
+ &.sidebar {
+ &:dir(ltr),
+ &.left,
+ &.left:dir(rtl) {
+ list { @extend %sidebar_left; }
}
- &.csd .sidebar { border-top-style: none; }
+ &:dir(rtl),
+ &.right {
+ list { @extend %sidebar_right; }
+ }
+ }
- .highlight { font: bold; }
+ row {
+ padding: $spacing * 2 $spacing;
+
+ > label {
+ padding-left: $spacing;
+ padding-right: $spacing;
+ }
+
+ &.needs-attention > label {
+ @extend %needs_attention;
+
+ background-size: 6px 6px, 0 0;
+ }
+ }
+ }
+
+ $_placesidebar_icons_opacity: 0.7;
+
+ placessidebar {
+ > viewport.frame { border-style: none; }
+
+ row {
+ // Needs overriding of the GtkListBoxRow padding
+ min-height: 36px;
+ padding: 0px;
+
+ // Using margins/padding directly in the SidebarRow
+ // will make the animation of the new bookmark row jump
+ > revealer { padding: 0 14px; }
+
+ &:selected { color: $selected_fg_color; }
+
+ &:disabled { color: $insensitive_fg_color; }
+
+ &:backdrop {
+ color: $backdrop_fg_color;
+
+ &:selected { color: $backdrop_selected_fg_color; }
+
+ &:disabled { color: $backdrop_insensitive_color; }
+ }
+
+ image.sidebar-icon {
+ opacity: $_placesidebar_icons_opacity; // dim the device icons
+
+ &:dir(ltr) { padding-right: 8px; }
+ &:dir(rtl) { padding-left: 8px; }
+ }
+
+ label.sidebar-label {
+ &:dir(ltr) { padding-right: 2px; }
+ &:dir(rtl) { padding-left: 2px; }
+ }
+
+ @at-root button.sidebar-button {
+ //@extend %button_basic.flat;
+
+ //@extend %button_selected.flat;
+
+ min-height: 26px;
+ min-width: 26px;
+ margin-top: 3px;
+ margin-bottom: 3px;
+ padding: 0;
+ border-radius: 100%;
+ -gtk-outline-radius: 100%;
+
+ &:not(:hover):not(:active),
+ &:backdrop {
+ > image { opacity: $_placesidebar_icons_opacity; }
+ }
+ }
+
+ // in the sidebar case it makes no sense to click the selected row
+ &:selected:active { box-shadow: none; }
+
+ &.sidebar-placeholder-row {
+ padding: 0 8px;
+ min-height: 2px;
+ background-image: image($drop_target_color);
+ background-clip: content-box;
+ }
+
+ &.sidebar-new-bookmark-row { color: $selected_bg_color; }
+
+ &:drop(active):not(:disabled) {
+ color: $drop_target_color;
+ box-shadow: inset 0 1px $drop_target_color,
+ inset 0 -1px $drop_target_color;
+
+ &:selected {
+ color: $selected_fg_color;
+ background-color: $drop_target_color;
+ }
+ }
}
}
}
diff --git a/gtk-3.20/scss/widgets/_view.scss b/gtk-3.20/scss/widgets/_view.scss
index 9ed5b16..33af742 100644
--- a/gtk-3.20/scss/widgets/_view.scss
+++ b/gtk-3.20/scss/widgets/_view.scss
@@ -27,7 +27,7 @@
text {
@extend %view;
- selection { &:focus, & { @extend %selected_items; }}
+ selection { &:focus, & { @extend %selected_items; } }
}
}
@@ -350,3 +350,30 @@
scrolledwindow viewport.frame { border: 0; }
}
+
+/***************
+ ! Places view *
+****************/
+
+@include exports("placesview") {
+ placesview {
+ .server-list-button > image {
+ transition: 200ms $ease-out-quad;
+ -gtk-icon-transform: rotate(0turn);
+ }
+
+ .server-list-button:checked > image {
+ transition: 200ms $ease-out-quad;
+ -gtk-icon-transform: rotate(-0.5turn);
+ }
+
+ row.activatable:hover { background-color: transparent; }
+
+ // this selects the "connect to server" label
+ > actionbar > revealer > box > label {
+ padding-left: 8px;
+ padding-right: 8px;
+ }
+ }
+}
+