[longomatch] Simplify theming of comboboxes. We force combos to draw a shadow that covers the whole widget, preve



commit 5c77988c6926fa3263195c2daeecd50dbcf5d301
Author: Julien Moutte <julien fluendo com>
Date:   Fri Aug 29 17:36:26 2014 +0200

    Simplify theming of comboboxes. We force combos to draw a shadow that covers the whole widget, prevent 
children from drawing any shadow and customize backgrounds for team combos. The toggle buttons have a 1x1 
background image that should match the combo background color. They can also receive a pixmap with different 
states if we want but the background colors have to match.

 .../gtk-2.0/Entry/combo-entry-border-bg-rtl.png    |  Bin 208 -> 0 bytes
 .../theme/gtk-2.0/Entry/combo-entry-button-rtl.png |  Bin 1035 -> 0 bytes
 data/theme/gtk-2.0/Entry/combo-entry-button.png    |  Bin 208 -> 0 bytes
 .../Entry/team-combo-button-blue-prelight-rtl.png  |  Bin 1578 -> 0 bytes
 .../Entry/team-combo-button-blue-prelight.png      |  Bin 825 -> 0 bytes
 .../Entry/team-combo-button-blue-pressed-rtl.png   |  Bin 2053 -> 0 bytes
 .../Entry/team-combo-button-blue-pressed.png       |  Bin 1277 -> 0 bytes
 .../gtk-2.0/Entry/team-combo-button-blue-rtl.png   |  Bin 1785 -> 0 bytes
 .../theme/gtk-2.0/Entry/team-combo-button-blue.png |  Bin 1027 -> 0 bytes
 .../Entry/team-combo-button-red-prelight-rtl.png   |  Bin 825 -> 0 bytes
 .../Entry/team-combo-button-red-prelight.png       |  Bin 1578 -> 0 bytes
 .../Entry/team-combo-button-red-pressed-rtl.png    |  Bin 1277 -> 0 bytes
 .../Entry/team-combo-button-red-pressed.png        |  Bin 2044 -> 0 bytes
 .../gtk-2.0/Entry/team-combo-button-red-rtl.png    |  Bin 1029 -> 0 bytes
 data/theme/gtk-2.0/Entry/team-combo-button-red.png |  Bin 1777 -> 0 bytes
 .../gtk-2.0/Entry/team-combo-entry-blue-rtl.png    |  Bin 1008 -> 0 bytes
 .../gtk-2.0/Entry/team-combo-entry-red-rtl.png     |  Bin 175 -> 0 bytes
 data/theme/gtk-2.0/combobox.rc                     |   95 +++++---
 data/theme/gtk-2.0/gtkrc                           |   74 +-----
 data/theme/gtk-2.0/teamcombobox.rc                 |  263 --------------------
 20 files changed, 75 insertions(+), 357 deletions(-)
---
diff --git a/data/theme/gtk-2.0/combobox.rc b/data/theme/gtk-2.0/combobox.rc
index 752a5e9..e70d7ae 100644
--- a/data/theme/gtk-2.0/combobox.rc
+++ b/data/theme/gtk-2.0/combobox.rc
@@ -1,42 +1,48 @@
+
 style "longomatch-combobox" = "longomatch-default" {
   xthickness = 2
   ythickness = 2
 
-  base[NORMAL]      = @bg_light_color
-  bg[NORMAL]        = @bg_light_color
+  # Force combobox to drow its own shadow
+  GtkComboBox::shadow-type = GTK_SHADOW_IN
+
+  base[NORMAL]        = @bg_dark_color
+  base[INSENSITIVE]   = darker (@bg_dark_color)
 
-  fg[NORMAL]        = @text_color
   text[NORMAL]      = @text_color
   text[INSENSITIVE] = darker (@text_color)
 
+  # Rounded border
   engine "pixmap"
   {
-    # LTR version
+    # This shadow gives a rounded corner rectangle in the background of the combobox
     image
     {
       function   = SHADOW
       shadow     = IN
       file       = "Entry/combo-entry-border-bg.png"
-      border     = { 4, 4, 5, 4 }
-      stretch    = TRUE
-      direction  = LTR
-    }
-    # RTL version
-    image
-    {
-      function   = SHADOW
-      shadow     = IN
-      file       = "Entry/combo-entry-border-bg-rtl.png"
-      border     = { 4, 4, 5, 4 }
+      border     = { 4, 4, 4, 4 }
       stretch    = TRUE
-      direction  = RTL
     }
   }
 }
 
-style "longomatch-combobox-arrow"
+style "longomatch-teams-combobox" = "longomatch-combobox" {
+  xthickness   = 0
+  ythickness   = 4
+
+  # Used for the Cell View background
+  base[NORMAL]      = @bg_light_color
+}
+
+style "longomatch-combobox-children"
 {
-  # Arrows
+  # We don't want our children drawing a shadow
+  xthickness   = 0
+  ythickness   = 0
+
+  GtkFrame::shadow-type = GTK_SHADOW_NONE
+  GtkEntry::shadow-type = GTK_SHADOW_NONE
 
   engine "pixmap"
   {
@@ -48,35 +54,62 @@ style "longomatch-combobox-arrow"
       overlay_stretch  = FALSE
       arrow_direction  = DOWN
     }
+    # Default background for the ToggleButtons, same color than the combo bg
+    image
+    {
+      function         = BOX
+      file             = "Buttons/null_bg.png"
+      border           = { 0, 0, 0, 0 }
+      stretch          = TRUE
+    }
   }
 }
 
-style "longomatch-combobox-button" = "longomatch-combo
-"
+style "longomatch-teams-combobox-children" = "longomatch-combobox-children"
 {
-  fg[ACTIVE] = @text_color
-
   engine "pixmap"
   {
+    # Specific bg for the teams combo which has a lighter background
+    image
+    {
+      function         = BOX
+      file             = "Buttons/null_bg_light.png"
+      border           = { 0, 0, 0, 0 }
+      stretch          = TRUE
+    }
+  }
+}
 
-    # LTR version
+style "longomatch-home-teams-combobox" = "longomatch-teams-combobox"
+{
+  engine "pixmap"
+  {
+    # Customize background image
     image
     {
-      function    = BOX
-      file        = "Entry/combo-entry-button.png"
+      function    = SHADOW
+      shadow      = IN
+      detail      = "combobox"
+      file        = "Entry/team-combo-entry-blue.png"
       border      = { 4, 4, 4, 4 }
       stretch     = TRUE
-      direction   = LTR
     }
+  }
+}
 
-    # RTL version
+style "longomatch-away-teams-combobox" = "longomatch-teams-combobox"
+{
+  engine "pixmap"
+  {
     image
     {
-      function    = BOX
-      file        = "Entry/combo-entry-button-rtl.png"
-      border      = { 4, 4, 5, 4 }
+      function    = SHADOW
+      shadow      = IN
+      detail      = "combobox"
+      file        = "Entry/team-combo-entry-red.png"
+      border      = { 4, 4, 4, 4 }
       stretch     = TRUE
-      direction   = RTL
     }
   }
 }
+
diff --git a/data/theme/gtk-2.0/gtkrc b/data/theme/gtk-2.0/gtkrc
index 38b1775..72570a0 100644
--- a/data/theme/gtk-2.0/gtkrc
+++ b/data/theme/gtk-2.0/gtkrc
@@ -208,52 +208,6 @@ style "longomatch-filechooser-button"
    }
 }
 
-style "longomatch-combobox" {
-
-  font = "Ubuntu 12"
-  xthickness = 2
-  ythickness = 2
-
-  base[NORMAL]        = @bg_dark_color
-  base[INSENSITIVE]   = darker (@bg_dark_color)
-
-  text[NORMAL]      = @text_color
-  text[INSENSITIVE] = darker (@text_color)
-
-  engine "clearlooks"
-  {
-    radius = 1.0
-  }
-   base[NORMAL] = @bg_color
-   base[INSENSITIVE] = @bg_color
-
-   xthickness = 15
-   ythickness = 4
-
-   engine "pixmap"
-   {
-     image
-     {
-       function  = SHADOW
-       detail    = "entry"
-       state     = NORMAL
-       shadow    = IN
-       file      = "Entry/file-input-left.png"
-       border    = { 15, 4, 15, 15 }
-       stretch   = TRUE
-     }
-     image
-     {
-       function        = FLAT_BOX
-       detail          = "entry_bg"
-       state           = NORMAL
-       overlay_file    = "Entry/filechooser-entry-fill.png"
-       overlay_border  = { 0, 0, 0, 0 }
-       overlay_stretch = TRUE
-     }
-   }
-}
-
 style "longomatch-aspect-frame"
 {
   xthickness = 0
@@ -262,41 +216,35 @@ style "longomatch-aspect-frame"
 
 include "buttons.rc"
 include "notebook.rc"
-include "teamcombobox.rc"
 include "combobox.rc"
 include "checkbox.rc"
 include "handles.rc"
 include "radiobutton.rc"
 
-
 class "GtkWidget"                                style "longomatch-default"
 class "GtkEntry"                                 style "longomatch-entry"
 class "GtkButton"                                style "longomatch-square-button"
-class "GtkPaned"                                style "longomatch-handles"
+class "GtkPaned"                                 style "longomatch-handles"
 #Remove borders completely
 class "GtkAspectFrame"                           style "longomatch-aspect-frame"
-# Background for the menubar
-class "GtkMenuBar"                               style "longomatch-menubar"
-
 class "GtkCheckButton"                           style "longomatch-checkbox"
 class "GtkCheckMenuItem"                         style "longomatch-checkbox"
 class "GtkRadioButton"                           style "longomatch-radiobutton"
 class "GtkTreeView"                              style "longomatch-treeview"
 
+# Background for the menubar
+class "GtkMenuBar"                               style "longomatch-menubar"
 # Text color for the menu items in the bar and the menus
 widget_class "*.GtkMenu.*"                       style "longomatch-menuitem"
 widget_class "*.GtkMenuBar.*"                    style "longomatch-menuitem"
-widget_class "*<GtkComboBox>*"                    style "longomatch-combobox"
-#widget_class "*<GtkComboBox>*<GtkButton>"        style "longomatch-combobox-button"
-#widget_class "*<GtkComboBox>*<GtkEntry>"         style "longomatch-combobox-entry"
-widget_class "*<GtkComboBox>*<GtkButton>"  style "longomatch-combobox-button"
-widget_class "*<GtkComboBox>*<GtkArrow>" style "longomatch-combobox-arrow"
-
-widget_class "*HomeTeamsComboBox*" style "longomatch-home-teams-combobox"
-widget_class "*HomeTeamsComboBox*<GtkButton>" style "longomatch-home-teams-combobox-button"
-widget_class "*AwayTeamsComboBox*" style "longomatch-away-teams-combobox"
-widget_class "*AwayTeamsComboBox*<GtkButton>" style "longomatch-away-teams-combobox-button"
-widget_class "*TeamsComboBox*<GtkArrow>" style "longomatch-teams-combobox-arrow"
+# Comboboxes get a nice rounded border with green arrows
+widget_class "*<GtkComboBox>"                    style "longomatch-combobox"
+# Custom combos for team vs team
+widget_class "*HomeTeamsComboBox*"               style "longomatch-home-teams-combobox"
+widget_class "*AwayTeamsComboBox*"               style "longomatch-away-teams-combobox"
+# Order matters here
+widget_class "*<GtkComboBox>.*"                  style "longomatch-combobox-children"
+widget_class "*TeamsComboBox*.*"                 style "longomatch-teams-combobox-children"
 
 class "GtkNotebook"                              style "longomatch-notebook"
 widget_class "*<GtkNotebook>*<GtkLabel>"                style "longomatch-notebook-tab-label"


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