[gtk+/wip/csoriano/bookmarks] experiment style



commit 5a8db51149c842dc311b448cb8dedb7c11037af9
Author: Carlos Soriano <csoriano gnome org>
Date:   Wed Jun 3 19:42:44 2015 +0200

    experiment style

 gtk/gtkplacessidebar.c                   |    9 ++++++++
 gtk/theme/Adwaita/_colors.scss           |    4 +-
 gtk/theme/Adwaita/_common.scss           |   33 ++++++++++++++++++++++++++---
 gtk/theme/Adwaita/gtk-contained-dark.css |   26 +++++++++++++++++++----
 gtk/theme/Adwaita/gtk-contained.css      |   26 +++++++++++++++++++----
 5 files changed, 82 insertions(+), 16 deletions(-)
---
diff --git a/gtk/gtkplacessidebar.c b/gtk/gtkplacessidebar.c
index 2a065d2..cc1cdc7 100644
--- a/gtk/gtkplacessidebar.c
+++ b/gtk/gtkplacessidebar.c
@@ -1349,6 +1349,7 @@ update_places (GtkPlacesSidebar *sidebar)
   gchar *tooltip;
   GList *network_mounts, *network_volumes;
   GIcon *new_bookmark_icon;
+  GtkStyleContext *context;
 
   g_print ("update places \n");
   /* save original selection */
@@ -1703,6 +1704,8 @@ update_places (GtkPlacesSidebar *sidebar)
                                          _("New bookmark"), new_bookmark_icon, NULL,
                                          NULL, NULL, NULL, 0,
                                          _("Add a new bookmark"));
+  context = gtk_widget_get_style_context (sidebar->new_bookmark_row);
+  gtk_style_context_add_class (context, "sidebar-new-bookmark-row");
   g_object_unref (new_bookmark_icon);
 
   /* network */
@@ -4173,6 +4176,7 @@ gtk_places_sidebar_init (GtkPlacesSidebar *sidebar)
 {
   GtkTargetList     *target_list;
   gboolean           b;
+  GtkStyleContext *context;
 
   gtk_style_context_add_class (gtk_widget_get_style_context (GTK_WIDGET (sidebar)), GTK_STYLE_CLASS_SIDEBAR);
 
@@ -4202,6 +4206,9 @@ gtk_places_sidebar_init (GtkPlacesSidebar *sidebar)
 
   /* list box */
   sidebar->list_box = gtk_list_box_new ();
+  context = gtk_widget_get_style_context (sidebar->list_box);
+  gtk_style_context_add_class (context, "sidebar");
+
   gtk_list_box_set_header_func (GTK_LIST_BOX (sidebar->list_box),
                                 list_box_header_func, sidebar, NULL);
   gtk_list_box_set_sort_func (GTK_LIST_BOX (sidebar->list_box),
@@ -4282,6 +4289,8 @@ gtk_places_sidebar_init (GtkPlacesSidebar *sidebar)
   g_object_get (sidebar->gtk_settings, "gtk-shell-shows-desktop", &b, NULL);
   sidebar->show_desktop = b;
 
+  gtk_widget_get_style_context (GTK_WIDGET (sidebar));
+
   /* populate the sidebar */
   update_places (sidebar);
 }
diff --git a/gtk/theme/Adwaita/_colors.scss b/gtk/theme/Adwaita/_colors.scss
index 4590c1e..1479064 100644
--- a/gtk/theme/Adwaita/_colors.scss
+++ b/gtk/theme/Adwaita/_colors.scss
@@ -30,7 +30,7 @@ $osd_insensitive_bg_color: transparentize(mix($osd_fg_color, opacify($osd_bg_col
 $osd_insensitive_fg_color: mix($osd_fg_color, opacify($osd_bg_color, 1), 50%);
 $osd_borders_color: transparentize(black, 0.3);
 
-$sidebar_bg_color: lighten($bg_color,5%);
+$sidebar_bg_color: lighten($bg_color, 2%);
 
 $tooltip_borders_color: transparentize(white, 0.9);
 
@@ -48,6 +48,6 @@ $backdrop_insensitive_color: if($variant == 'light', darken($backdrop_bg_color,
 $backdrop_selected_fg_color: $selected_fg_color;
 $backdrop_borders_color: mix($borders_color, $bg_color, 90%);
 $backdrop_dark_fill: mix($backdrop_borders_color, $backdrop_bg_color, 35%);
-$backdrop_sidebar_bg_color: lighten($backdrop_bg_color,5%);
+$backdrop_sidebar_bg_color: lighten($backdrop_bg_color, 2%);
 
 $backdrop_scrollbar_bg_color: darken($backdrop_bg_color, 3%);
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index d6bf082..95649c2 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -2650,7 +2650,7 @@ GtkScrolledWindow {
 
 // transition
 .list-row, list-row.button {
-  transition: all 300ms $ease-out-quad;
+  transition: all 150ms $ease-out-quad;
   &:hover { transition: none; }
 }
 
@@ -2869,7 +2869,8 @@ GtkFileChooserDialog {
 
 .sidebar {
   border: none;
-  background-color: $sidebar_bg_color;
+  // Popover background color
+  background-color: mix($bg_color, $base_color, 50%);
 
   &:backdrop {
     background-color: $backdrop_sidebar_bg_color;
@@ -2886,6 +2887,24 @@ GtkPlacesSidebar.sidebar {
 
   SidebarRow { padding: 0px 8px; }
 
+  .list-row.button {
+// Popover menuitem color
+  &:hover {
+        background-color: mix($fg_color, $bg_color, 10%);
+  }
+  &:active {
+    box-shadow: inset 0 2px 2px -2px transparentize(black, 0.8);
+  }
+  &:backdrop:hover { background-color: transparent; }
+  &:selected {
+    &:active { box-shadow: inset 0 2px 3px -1px transparentize(black, 0.5); }
+    &:hover {
+      background-color: mix($fg_color, $selected_bg_color, 10%);
+    }
+    &:backdrop { background-color: $selected_bg_color; }
+  }
+}
+
   .dnd {
     box-shadow: inset 0px 0px 0px 1px mix($fg_color, $selected_bg_color, 50%);
   }
@@ -2893,7 +2912,11 @@ GtkPlacesSidebar.sidebar {
   // Using margins/padding directly in the SidebarRow
   // will make the animation of the new bookmark row jump
   .sidebar-revealer {
-    padding: 3px 0px;
+    padding: 2px 8px 2px 4px;
+  }
+
+  .sidebar-new-bookmark-row {
+    background-color: darken($sidebar_bg_color, 10%);
   }
 
   .sidebar-icon {
@@ -2906,8 +2929,10 @@ GtkPlacesSidebar.sidebar {
                                     // so istead of "GtkPlacesSidebar.sidebar .sidebar-button.button" 
[specificity 0,0,3,1]
                                     // the extended selector ".sidebar-button.button" [specificity 0,0,2,0]
 
-    &.image-button { padding: 4px; }
+    &.image-button { padding: 5px; }
 
+    margin-end: 8px;
+    margin-start: 4px;
     @extend .button.flat;
     border-radius: 100%;
     outline-radius: 100%;
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index 0e07882..e297a02 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -3663,7 +3663,7 @@ GtkScrolledWindow GtkViewport.frame {
 
 .list-row, list-row.button, .header-bar list-row.button.titlebutton,
 .titlebar list-row.button.titlebutton {
-  transition: all 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
+  transition: all 150ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
   .list-row:hover, list-row.button:hover, .header-bar list-row.button.titlebutton:hover,
   .titlebar list-row.button.titlebutton:hover {
     transition: none; }
@@ -3984,22 +3984,38 @@ GtkFileChooserDialog .dialog-action-box {
  ***********/
 .sidebar {
   border: none;
-  background-color: #454c4c; }
+  background-color: #313434; }
   .sidebar:backdrop {
-    background-color: #454c4c; }
+    background-color: #3e4444; }
 
 GtkPlacesSidebar.sidebar SidebarRow {
   padding: 0px 8px; }
+GtkPlacesSidebar.sidebar .list-row.button:hover {
+  background-color: #4b5150; }
+GtkPlacesSidebar.sidebar .list-row.button:active {
+  box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); }
+GtkPlacesSidebar.sidebar .list-row.button:backdrop:hover {
+  background-color: transparent; }
+GtkPlacesSidebar.sidebar .list-row.button:selected:active {
+  box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.5); }
+GtkPlacesSidebar.sidebar .list-row.button:selected:hover {
+  background-color: #356ca4; }
+GtkPlacesSidebar.sidebar .list-row.button:selected:backdrop {
+  background-color: #215d9c; }
 GtkPlacesSidebar.sidebar .dnd {
   box-shadow: inset 0px 0px 0px 1px #88a6c4; }
 GtkPlacesSidebar.sidebar .sidebar-revealer {
-  padding: 3px 0px; }
+  padding: 2px 8px 2px 6px; }
+GtkPlacesSidebar.sidebar .sidebar-new-bookmark-row {
+  background-color: #262a2a; }
 GtkPlacesSidebar.sidebar .sidebar-icon {
   padding-left: 8px;
   padding-right: 8px;
   opacity: 0.7; }
 .sidebar-button.button, .header-bar .sidebar-button.button.titlebutton,
 .titlebar .sidebar-button.button.titlebutton {
+  margin-end: 8px;
+  margin-start: 4px;
   border-radius: 100%;
   outline-radius: 100%;
   /*    &:hover:not(:active):not(:backdrop) {
@@ -4011,7 +4027,7 @@ GtkPlacesSidebar.sidebar .sidebar-icon {
       } */ }
   .sidebar-button.button.image-button, .header-bar .sidebar-button.titlebutton.button,
   .titlebar .sidebar-button.titlebutton.button {
-    padding: 4px; }
+    padding: 5px; }
   .sidebar-button.button:not(:hover):not(:active) > GtkImage, .header-bar 
.sidebar-button.button.titlebutton:not(:hover):not(:active) > GtkImage,
   .titlebar .sidebar-button.button.titlebutton:not(:hover):not(:active) > GtkImage, 
.sidebar-button.button:backdrop > GtkImage, .header-bar .sidebar-button.button.titlebutton:backdrop > 
GtkImage,
   .titlebar .sidebar-button.button.titlebutton:backdrop > GtkImage {
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index acc47a7..7be6533 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -3833,7 +3833,7 @@ GtkScrolledWindow GtkViewport.frame {
 
 .list-row, list-row.button, .header-bar list-row.button.titlebutton,
 .titlebar list-row.button.titlebutton {
-  transition: all 300ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
+  transition: all 150ms cubic-bezier(0.25, 0.46, 0.45, 0.94); }
   .list-row:hover, list-row.button:hover, .header-bar list-row.button.titlebutton:hover,
   .titlebar list-row.button.titlebutton:hover {
     transition: none; }
@@ -4156,22 +4156,38 @@ GtkFileChooserDialog .dialog-action-box {
  ***********/
 .sidebar {
   border: none;
-  background-color: #fafafa; }
+  background-color: #f6f6f6; }
   .sidebar:backdrop {
-    background-color: #fafafa; }
+    background-color: #f2f2f2; }
 
 GtkPlacesSidebar.sidebar SidebarRow {
   padding: 0px 8px; }
+GtkPlacesSidebar.sidebar .list-row.button:hover {
+  background-color: #dadbdb; }
+GtkPlacesSidebar.sidebar .list-row.button:active {
+  box-shadow: inset 0 2px 2px -2px rgba(0, 0, 0, 0.2); }
+GtkPlacesSidebar.sidebar .list-row.button:backdrop:hover {
+  background-color: transparent; }
+GtkPlacesSidebar.sidebar .list-row.button:selected:active {
+  box-shadow: inset 0 2px 3px -1px rgba(0, 0, 0, 0.5); }
+GtkPlacesSidebar.sidebar .list-row.button:selected:hover {
+  background-color: #4787c9; }
+GtkPlacesSidebar.sidebar .list-row.button:selected:backdrop {
+  background-color: #4a90d9; }
 GtkPlacesSidebar.sidebar .dnd {
   box-shadow: inset 0px 0px 0px 1px #3c6288; }
 GtkPlacesSidebar.sidebar .sidebar-revealer {
-  padding: 3px 0px; }
+  padding: 2px 8px 2px 6px; }
+GtkPlacesSidebar.sidebar .sidebar-new-bookmark-row {
+  background-color: #d9d9d9; }
 GtkPlacesSidebar.sidebar .sidebar-icon {
   padding-left: 8px;
   padding-right: 8px;
   opacity: 0.7; }
 .sidebar-button.button, .header-bar .sidebar-button.button.titlebutton,
 .titlebar .sidebar-button.button.titlebutton {
+  margin-end: 8px;
+  margin-start: 4px;
   border-radius: 100%;
   outline-radius: 100%;
   /*    &:hover:not(:active):not(:backdrop) {
@@ -4183,7 +4199,7 @@ GtkPlacesSidebar.sidebar .sidebar-icon {
       } */ }
   .sidebar-button.button.image-button, .header-bar .sidebar-button.titlebutton.button,
   .titlebar .sidebar-button.titlebutton.button {
-    padding: 4px; }
+    padding: 5px; }
   .sidebar-button.button:not(:hover):not(:active) > GtkImage, .header-bar 
.sidebar-button.button.titlebutton:not(:hover):not(:active) > GtkImage,
   .titlebar .sidebar-button.button.titlebutton:not(:hover):not(:active) > GtkImage, 
.sidebar-button.button:backdrop > GtkImage, .header-bar .sidebar-button.button.titlebutton:backdrop > 
GtkImage,
   .titlebar .sidebar-button.button.titlebutton:backdrop > GtkImage {


[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]