[gnome-shell] theme: Replace calendar arrow images with symbolic icons and CSS

[Florian Müllner <fmuellner src gnome org>]

commit 3217c10ff272f44d50afc881ce2a2dbb911dc1e8
Author: daniruiz <daniruizdealegria gmail com>
Date:   Tue Nov 20 17:55:31 2018 +0100

    theme: Replace calendar arrow images with symbolic icons and CSS
    
    https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/301

 data/gnome-shell-theme.gresource.xml     |  2 -
 data/theme/calendar-arrow-left.svg       | 82 --------------------------------
 data/theme/calendar-arrow-right.svg      | 82 --------------------------------
 data/theme/gnome-shell-sass/_common.scss | 10 +---
 js/ui/calendar.js                        |  2 +
 5 files changed, 4 insertions(+), 174 deletions(-)
---
diff --git a/data/gnome-shell-theme.gresource.xml b/data/gnome-shell-theme.gresource.xml
index 4a4a0edfc..b77825414 100644
--- a/data/gnome-shell-theme.gresource.xml
+++ b/data/gnome-shell-theme.gresource.xml
@@ -1,8 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <gresources>
   <gresource prefix="/org/gnome/shell/theme">
-    <file>calendar-arrow-left.svg</file>
-    <file>calendar-arrow-right.svg</file>
     <file>calendar-today.svg</file>
     <file>checkbox-focused.svg</file>
     <file>checkbox-off-focused.svg</file>
diff --git a/data/theme/gnome-shell-sass/_common.scss b/data/theme/gnome-shell-sass/_common.scss
index 528202161..22f9e826e 100644
--- a/data/theme/gnome-shell-sass/_common.scss
+++ b/data/theme/gnome-shell-sass/_common.scss
@@ -938,7 +938,6 @@ StScrollBar {
     }
 
     .pager-button {
-      color: white;
       background-color: transparent;
       width: 32px;
       border-radius: 4px;
@@ -946,13 +945,8 @@ StScrollBar {
       &:active { background-color: transparentize($bg_color,0.95); }
     }
 
-      .calendar-change-month-back { //arrow back
-        background-image: url("resource:///org/gnome/shell/theme/calendar-arrow-left.svg");
-        &:rtl { background-image: url("resource:///org/gnome/shell/theme/calendar-arrow-right.svg"); }
-      }
-      .calendar-change-month-forward { //arrow foreward
-        background-image: url("resource:///org/gnome/shell/theme/calendar-arrow-right.svg");
-        &:rtl { background-image: url("resource:///org/gnome/shell/theme/calendar-arrow-left.svg"); }
+      .calendar-change-month-back StIcon, .calendar-change-month-forward StIcon { // arrows
+        icon-size: 1.09em;
       }
 
     .calendar-day-base {
diff --git a/js/ui/calendar.js b/js/ui/calendar.js
index 432986391..c4d362537 100644
--- a/js/ui/calendar.js
+++ b/js/ui/calendar.js
@@ -446,6 +446,7 @@ var Calendar = new Lang.Class({
         this._backButton = new St.Button({ style_class: 'calendar-change-month-back pager-button',
                                            accessible_name: _("Previous month"),
                                            can_focus: true });
+        this._backButton.add_actor(new St.Icon({ icon_name: 'pan-start-symbolic' }));
         this._topBox.add(this._backButton);
         this._backButton.connect('clicked', this._onPrevMonthButtonClicked.bind(this));
 
@@ -456,6 +457,7 @@ var Calendar = new Lang.Class({
         this._forwardButton = new St.Button({ style_class: 'calendar-change-month-forward pager-button',
                                               accessible_name: _("Next month"),
                                               can_focus: true });
+        this._forwardButton.add_actor(new St.Icon({ icon_name: 'pan-end-symbolic' }));
         this._topBox.add(this._forwardButton);
         this._forwardButton.connect('clicked', this._onNextMonthButtonClicked.bind(this));