10 files changed, 40 insertions, 9 deletions
diff --git a/data/assets/introduction_back_button_hover.png b/data/assets/introduction_back_button_hover.png
new file mode 100644
index 0000000..418fee7
--- /dev/null
+++ b/data/assets/introduction_back_button_hover.png
diff --git a/data/assets/introduction_back_button_normal.png b/data/assets/introduction_back_button_normal.png
new file mode 100644
index 0000000..54ea015
--- /dev/null
+++ b/data/assets/introduction_back_button_normal.png
diff --git a/data/assets/introduction_back_button_pressed.png b/data/assets/introduction_back_button_pressed.png
new file mode 100644
index 0000000..a1d3bc0
--- /dev/null
+++ b/data/assets/introduction_back_button_pressed.png
diff --git a/data/assets/play.png b/data/assets/play.png
deleted file mode 100644
index d5b1279..0000000
--- a/data/assets/play.png
+++ /dev/null
diff --git a/data/css/eos-wikipedia-domain.css b/data/css/eos-wikipedia-domain.css
index c1d6199..715f20f 100644
--- a/data/css/eos-wikipedia-domain.css
+++ b/data/css/eos-wikipedia-domain.css
@@ -85,6 +85,16 @@ Gjs_CategoryButton GtkEventBox:hover {
     transition: background-color 100ms ease-in-out;
 }
 
-#side_bar_button:hover{
+#side_bar_button:hover {
     background-color: rgba(0, 0, 0, 0.2);
 }
+
+Gjs_AssetButton {
+    font-weight: bold;
+    color: alpha(white, 0.0);
+}
+
+Gjs_AssetButton:prelight {
+    text-shadow: 0px 1px 0px alpha(#000000, 0.5), 0px 0px 12px alpha(#000000, 0.3);
+    color: alpha(white, 1.0);
+}
diff --git a/data/eos-wikipedia-domain.gresource.xml b/data/eos-wikipedia-domain.gresource.xml
index b1a7d87..19c31f4 100644
--- a/data/eos-wikipedia-domain.gresource.xml
+++ b/data/eos-wikipedia-domain.gresource.xml
@@ -13,6 +13,8 @@
     <file>assets/category_splash_separator_shadow.png</file>
     <file>assets/category_hover_arrow.png</file>
     <file>assets/image_strip_back_button.png</file>
-    <file>assets/play.png</file>
+    <file>assets/introduction_back_button_normal.png</file>
+    <file>assets/introduction_back_button_pressed.png</file>
+    <file>assets/introduction_back_button_hover.png</file>
   </gresource>
 </gresources>
diff --git a/po/POTFILES.in b/po/POTFILES.in
index 21f5350..017b1f7 100644
--- a/po/POTFILES.in
+++ b/po/POTFILES.in
@@ -1,2 +1,3 @@
 # List of source files which contain translatable strings.
 wikipedia/views/domain_wiki_view.js
+wikipedia/PrebuiltCategoryPage.js
diff --git a/wikipedia/PrebuiltCategoryPage.js b/wikipedia/PrebuiltCategoryPage.js
index 3cb298d..fad4fcd 100644
--- a/wikipedia/PrebuiltCategoryPage.js
+++ b/wikipedia/PrebuiltCategoryPage.js
@@ -1,21 +1,25 @@
-const EndlessWikipedia = imports.wikipedia.EndlessWikipedia;
+const Endless = imports.gi.Endless;
+const Gettext = imports.gettext;
+const GLib = imports.gi.GLib;
 const GObject = imports.gi.GObject;
-const GdkPixbuf = imports.gi.GdkPixbuf;
 const Gtk = imports.gi.Gtk;
 const Lang = imports.lang;
 
 const BoxWithBg = imports.wikipedia.widgets.BoxWithBg;
+const Config = imports.wikipedia.config;
 const FixedSizeTextView = imports.wikipedia.widgets.FixedSizeTextView;
 const ScaledImage = imports.wikipedia.widgets.scaled_image;
 
 const SUBMENU_SEPARATOR_A_URI = "/com/endlessm/wikipedia-domain/assets/submenu_separator_shadow_a.png";
 const SPLASH_SEPARATOR_URI = "/com/endlessm/wikipedia-domain/assets/category_splash_separator_shadow.png";
 const INTRO_TITLE_SEPARATOR_URI = "/com/endlessm/wikipedia-domain/assets/introduction_title_separator.png";
-
 const LEFT_MARGIN_FOR_TEXT = 45;
 
 GObject.ParamFlags.READWRITE = GObject.ParamFlags.READABLE | GObject.ParamFlags.WRITABLE;
 
+const _ = function(string) { return GLib.dgettext('eos-sdk', string); };
+Gettext.bindtextdomain('eos-sdk', Config.DATADIR + '/locale');
+
 function _resourceUriToPath(uri) {
     if(uri.startsWith('resource://'))
         return uri.slice('resource://'.length);
@@ -44,6 +48,10 @@ const PrebuiltCategoryPage = new Lang.Class({
             '')
     },
 
+    Signals: {
+        'go-back-home':{}
+    },
+
     _init: function(props) {
         this._shaded_box = new BoxWithBg.BoxWithBg({
             name: "category_info",
@@ -108,12 +116,19 @@ const PrebuiltCategoryPage = new Lang.Class({
         this._description_scrolled_window.set_policy(Gtk.PolicyType.NEVER,
             Gtk.PolicyType.AUTOMATIC);
 
-        this._back_button = new Gtk.Button({
+        this._back_button = new Endless.AssetButton({
             valign: Gtk.Align.CENTER,
             hexpand: true,
-            child: new Gtk.Image({ resource: '/com/endlessm/wikipedia-domain/assets/play.png'})
+            normal_image_uri: "resource://com/endlessm/wikipedia-domain/assets/introduction_back_button_normal.png",
+            active_image_uri: "resource://com/endlessm/wikipedia-domain/assets/introduction_back_button_pressed.png",
+            prelight_image_uri: "resource://com/endlessm/wikipedia-domain/assets/introduction_back_button_hover.png",
+            label: _("OTHER CATEGORIES")
         });
 
+        this._back_button.connect('clicked', Lang.bind(this, function() {
+            this.emit('go-back-home');
+        }));
+
         this.parent(props);
 
         this._shaded_box.add(this._title_label);
@@ -124,7 +139,7 @@ const PrebuiltCategoryPage = new Lang.Class({
         this._layout_grid.add(this._shaded_box);
         
         this._overlay = new Gtk.Overlay({
-            halign:Gtk.Align.END
+            halign: Gtk.Align.END
         });
         this._overlay.add(this._layout_grid);
         this._overlay.add_overlay(this._submenu_separator);
diff --git a/wikipedia/views/domain_wiki_view.js b/wikipedia/views/domain_wiki_view.js
index bddaa7b..90a29ff 100644
--- a/wikipedia/views/domain_wiki_view.js
+++ b/wikipedia/views/domain_wiki_view.js
@@ -153,6 +153,9 @@ const DomainWikiView = new Lang.Class({
 
         this._category_back_button.connect('clicked',
             Lang.bind(this, this._onCategoryBackClicked));
+
+        this._category_view.connect('go-back-home',
+            Lang.bind(this, this._onCategoryBackClicked));
     },
 
     _set_article_sidebar_uri: function(uri){
diff --git a/wikipedia/widgets/FixedSizeTextView.js b/wikipedia/widgets/FixedSizeTextView.js
index 14b82dc..f655d88 100644
--- a/wikipedia/widgets/FixedSizeTextView.js
+++ b/wikipedia/widgets/FixedSizeTextView.js
@@ -8,7 +8,7 @@ const FixedSizeTextView = new Lang.Class({
     Name: "FixedSizeTextView",
     Extends: Gtk.TextView,
 
-    vfunc_get_preferred_width:function(){
+    vfunc_get_preferred_width: function(){
         return [CATEGORY_DESCRIPTION_WIDTH, CATEGORY_DESCRIPTION_WIDTH];
     }
 });