[gnome-software/wip/kalev/smaller-arrows] app row: Make version arrows smaller

[Kalev Lember <klember src gnome org>]

commit 937bfd332707b454abd830d5aa9b04713f0dca75
Author: Kalev Lember <klember redhat com>
Date:   Fri Sep 28 10:26:39 2018 +0100

    app row: Make version arrows smaller
    
    Break up the labels that form the version strong (1.2.3 -> 1.2.4) so
    that the arrow is in a separate label. This makes it possible to control
    the arrow size separately, so that it's not humongous with new
    Cantarell.

 src/gs-app-row.c  | 83 +++++++++++++++++++++++++++----------------------------
 src/gs-app-row.ui | 35 ++++++++++++++++++++---
 src/gtk-style.css |  4 +++
 3 files changed, 76 insertions(+), 46 deletions(-)
---
diff --git a/src/gs-app-row.c b/src/gs-app-row.c
index 6cc091c8..1a3af912 100644
--- a/src/gs-app-row.c
+++ b/src/gs-app-row.c
@@ -37,7 +37,10 @@ typedef struct
        GtkWidget       *image;
        GtkWidget       *name_box;
        GtkWidget       *name_label;
-       GtkWidget       *version_label;
+       GtkWidget       *version_box;
+       GtkWidget       *version_current_label;
+       GtkWidget       *version_arrow_label;
+       GtkWidget       *version_update_label;
        GtkWidget       *star;
        GtkWidget       *folder_label;
        GtkWidget       *description_box;
@@ -115,39 +118,6 @@ gs_app_row_get_description (GsAppRow *app_row)
        return g_string_new (tmp);
 }
 
-static gchar *
-gs_app_row_format_version_update (GsApp *app)
-{
-       const gchar *tmp;
-       const gchar *version_current = NULL;
-       const gchar *version_update = NULL;
-
-       /* current version */
-       tmp = gs_app_get_version_ui (app);
-       if (tmp != NULL && tmp[0] != '\0')
-               version_current = tmp;
-
-       /* update version */
-       tmp = gs_app_get_update_version_ui (app);
-       if (tmp != NULL && tmp[0] != '\0')
-               version_update = tmp;
-
-       /* have both */
-       if (version_current != NULL && version_update != NULL &&
-           g_strcmp0 (version_current, version_update) != 0) {
-               return g_strdup_printf ("%s ▶ %s",
-                                       version_current,
-                                       version_update);
-       }
-
-       /* just update */
-       if (version_update)
-               return g_strdup (version_update);
-
-       /* we have nothing, nada, zilch */
-       return NULL;
-}
-
 static void
 gs_app_row_refresh_button (GsAppRow *app_row, gboolean missing_search_result)
 {
@@ -369,13 +339,41 @@ gs_app_row_refresh (GsAppRow *app_row)
                                     gs_app_get_name (priv->app));
        }
        if (priv->show_update) {
-               g_autofree gchar *verstr = NULL;
-               verstr = gs_app_row_format_version_update (priv->app);
-               gtk_label_set_label (GTK_LABEL (priv->version_label), verstr);
-               gtk_widget_set_visible (priv->version_label, verstr != NULL);
+               const gchar *version_current = NULL;
+               const gchar *version_update = NULL;
+
+               /* current version */
+               tmp = gs_app_get_version_ui (priv->app);
+               if (tmp != NULL && tmp[0] != '\0') {
+                       version_current = tmp;
+                       gtk_label_set_label (GTK_LABEL (priv->version_current_label),
+                                            version_current);
+                       gtk_widget_show (priv->version_current_label);
+               }
+
+               /* update version */
+               tmp = gs_app_get_update_version_ui (priv->app);
+               if (tmp != NULL && tmp[0] != '\0') {
+                       version_update = tmp;
+                       gtk_label_set_label (GTK_LABEL (priv->version_update_label),
+                                            version_update);
+                       gtk_widget_show (priv->version_update_label);
+               }
+
+               /* have both: show arrow */
+               if (version_current != NULL && version_update != NULL &&
+                   g_strcmp0 (version_current, version_update) != 0) {
+                       gtk_widget_show (priv->version_arrow_label);
+               }
+
+               /* show the box if we have either of the versions */
+               if (version_current != NULL || version_update != NULL)
+                       gtk_widget_show (priv->version_box);
+               else
+                       gtk_widget_hide (priv->version_box);
                gtk_widget_hide (priv->star);
        } else {
-               gtk_widget_hide (priv->version_label);
+               gtk_widget_hide (priv->version_box);
                if (missing_search_result || gs_app_get_rating (priv->app) <= 0) {
                        gtk_widget_hide (priv->star);
                } else {
@@ -384,8 +382,6 @@ gs_app_row_refresh (GsAppRow *app_row)
                        gs_star_widget_set_rating (GS_STAR_WIDGET (priv->star),
                                                   gs_app_get_rating (priv->app));
                }
-               gtk_label_set_label (GTK_LABEL (priv->version_label),
-                                    gs_app_get_version_ui (priv->app));
        }
 
        /* folders */
@@ -659,7 +655,10 @@ gs_app_row_class_init (GsAppRowClass *klass)
        gtk_widget_class_bind_template_child_private (widget_class, GsAppRow, image);
        gtk_widget_class_bind_template_child_private (widget_class, GsAppRow, name_box);
        gtk_widget_class_bind_template_child_private (widget_class, GsAppRow, name_label);
-       gtk_widget_class_bind_template_child_private (widget_class, GsAppRow, version_label);
+       gtk_widget_class_bind_template_child_private (widget_class, GsAppRow, version_box);
+       gtk_widget_class_bind_template_child_private (widget_class, GsAppRow, version_current_label);
+       gtk_widget_class_bind_template_child_private (widget_class, GsAppRow, version_arrow_label);
+       gtk_widget_class_bind_template_child_private (widget_class, GsAppRow, version_update_label);
        gtk_widget_class_bind_template_child_private (widget_class, GsAppRow, star);
        gtk_widget_class_bind_template_child_private (widget_class, GsAppRow, folder_label);
        gtk_widget_class_bind_template_child_private (widget_class, GsAppRow, description_box);
diff --git a/src/gs-app-row.ui b/src/gs-app-row.ui
index 40cf62d5..83e5a0a5 100644
--- a/src/gs-app-row.ui
+++ b/src/gs-app-row.ui
@@ -49,11 +49,38 @@
               </object>
             </child>
             <child>
-              <object class="GtkLabel" id="version_label">
+              <object class="GtkBox" id="version_box">
                 <property name="visible">True</property>
-                <property name="xalign">0.0</property>
-                <property name="yalign">0.5</property>
-                <property name="ellipsize">end</property>
+                <property name="orientation">horizontal</property>
+                <property name="spacing">4</property>
+                <child>
+                  <object class="GtkLabel" id="version_current_label">
+                    <property name="visible">True</property>
+                    <property name="xalign">0.0</property>
+                    <property name="yalign">0.5</property>
+                    <property name="ellipsize">end</property>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkLabel" id="version_arrow_label">
+                    <property name="visible">True</property>
+                    <property name="xalign">0.0</property>
+                    <property name="yalign">0.5</property>
+                    <property name="ellipsize">end</property>
+                    <property name="label" translatable="yes">▶</property>
+                    <style>
+                      <class name="version-arrow-label"/>
+                    </style>
+                  </object>
+                </child>
+                <child>
+                  <object class="GtkLabel" id="version_update_label">
+                    <property name="visible">True</property>
+                    <property name="xalign">0.0</property>
+                    <property name="yalign">0.5</property>
+                    <property name="ellipsize">end</property>
+                  </object>
+                </child>
               </object>
             </child>
             <child>
diff --git a/src/gtk-style.css b/src/gtk-style.css
index 9f111278..c805b35a 100644
--- a/src/gtk-style.css
+++ b/src/gtk-style.css
@@ -356,6 +356,10 @@
        color: white;
 }
 
+.version-arrow-label {
+       font-size: smaller;
+}
+
 .overview-more-button {
        font-size: smaller;
        padding: 0px 15px;