[gnome-boxes] Fix up themeing of selection bar

[Alexander Larsson <alexl src gnome org>]

commit 92459c02700ec67381fdf45cca67485ad2afbd4a
Author: Alexander Larsson <alexl redhat com>
Date:   Thu Jun 21 20:12:18 2012 +0200

    Fix up themeing of selection bar
    
    This makes the selection bar render properly.
    It was not getting a transparent background for the rounded
    corners, and it was having weird sizing errors when the favorite
    button was on and you hovered the remove button.
    
    https://bugzilla.gnome.org/show_bug.cgi?id=678569

 data/gtk-style.css    |   47 +++++++++++++++++++----------------------------
 src/selectionbar.vala |    8 ++++++--
 2 files changed, 25 insertions(+), 30 deletions(-)
---
diff --git a/data/gtk-style.css b/data/gtk-style.css
index d64ab27..fb4d2ac 100644
--- a/data/gtk-style.css
+++ b/data/gtk-style.css
@@ -99,13 +99,7 @@ GtkClutterOffscreen,
     font-family: monospace;
 }
 
-.osd {
-    background-image: none;
-    background-color: alpha(#000, 0.0);
-    color: #ffffff;
-}
-
-.osd .toolbar {
+.selectionbar {
     padding: 6px 6px;
     border-style: none;
     border-radius: 5px;
@@ -118,46 +112,43 @@ GtkClutterOffscreen,
     icon-shadow: 1px 1px black;
 }
 
-.osd .toolbar .favorite {
-    color: shade(@theme_selected_bg_color, 1.20);
+.selectionbar .toolbar {
+    background-color: transparent;
 }
 
-.osd .toolbar .separator {
-    color: alpha(@theme_tooltip_fg_color, 0.30);
+.selectionbar .button * {
+    color: #bdbdbd;
 }
 
-.osd .toolbar .button:hover {
-    background-image: -gtk-gradient(linear, left top, left bottom,
-                                    from(alpha(@theme_tooltip_fg_color, 0.00)),
-                                    color-stop(0.50, alpha(@theme_tooltip_fg_color, 0.15)),
-                                    to(alpha(@theme_tooltip_fg_color, 0.00)));
+.selectionbar .button *:active {
+    color: #ffffff;
+}
 
+.selectionbar .button {
     border-image: none;
     border-style: none;
     border-radius: 2px;
     border-width: 0;
 }
 
-.osd .toolbar .button:active {
+.selectionbar .button:hover {
+    background-image: -gtk-gradient(linear, left top, left bottom,
+                                    from(alpha(@theme_tooltip_fg_color, 0.00)),
+                                    color-stop(0.50, alpha(@theme_tooltip_fg_color, 0.15)),
+                                    to(alpha(@theme_tooltip_fg_color, 0.00)));
+}
+
+
+.selectionbar .button:active {
     background-image: none;
     background-color: alpha(@theme_tooltip_fg_color, 0.15);
-
-    border-image: none;
-    border-style: none;
-    border-radius: 2px;
-    border-width: 0;
 }
 
-.osd .toolbar .button:active:hover {
+.selectionbar .button:active:hover {
     background-image: -gtk-gradient(linear, left top, left bottom,
                                     from(alpha(@theme_tooltip_fg_color, 0.15)),
                                     color-stop(0.50, alpha(@theme_tooltip_fg_color, 0.30)),
                                     to(alpha(@theme_tooltip_fg_color, 0.15)));
-
-    border-style: none;
-    border-image: none;
-    border-radius: 2px;
-    border-width: 0;
 }
 
 GtkInfoBar {
diff --git a/src/selectionbar.vala b/src/selectionbar.vala
index bfce685..eadceb3 100644
--- a/src/selectionbar.vala
+++ b/src/selectionbar.vala
@@ -16,9 +16,13 @@ private class Boxes.Selectionbar: GLib.Object {
         toolbar.show_arrow = false;
         toolbar.icon_size = Gtk.IconSize.LARGE_TOOLBAR;
 
-        gtk_actor = new GtkClutter.Actor.with_contents (toolbar);
+        var bin = new Gtk.Alignment (0,0,1,1);
+        draw_as_css_box (bin);
+        bin.add (toolbar);
+        bin.get_style_context ().add_class ("selectionbar");
+
+        gtk_actor = new GtkClutter.Actor.with_contents (bin);
         gtk_actor.opacity = 0;
-        gtk_actor.get_widget ().get_style_context ().add_class ("osd");
 
         favorite_btn = new Gtk.ToggleToolButton ();
         toolbar.insert (favorite_btn, 0);