From 0a378a897bdcbd633ca094af5ea289b889c45d28 Mon Sep 17 00:00:00 2001
From: Luis Ramos <luisramos0@gmail.com>
Date: Thu, 23 Apr 2020 16:46:37 +0100
Subject: [PATCH] Add close button to mobile product modal, this can be reused
 in other modals later

---
 .../javascripts/templates/product_modal.html.haml   |  5 ++++-
 app/assets/stylesheets/darkswarm/modals.css.scss    | 13 +++++++++++++
 config/locales/en.yml                               |  4 ++++
 3 files changed, 21 insertions(+), 1 deletion(-)

diff --git a/app/assets/javascripts/templates/product_modal.html.haml b/app/assets/javascripts/templates/product_modal.html.haml
index 47d57c2ea2..e6f591a9ab 100644
--- a/app/assets/javascripts/templates/product_modal.html.haml
+++ b/app/assets/javascripts/templates/product_modal.html.haml
@@ -1,5 +1,4 @@
 .row
-
   .columns.small-12.large-6.product-header
     %h3{"ng-bind" => "::product.name"}
     %span
@@ -19,3 +18,7 @@
     %img.product-img.placeholder{ src: "/assets/noimage/large.png", "ng-if" => "::!product.largeImage"}
 
 %ng-include{src: "'partials/close.html'"}
+
+.buttons
+  .button.bottom-close-button{"ng-click" => "$close()"}
+    = t('js.shop.products.product_modal.close')
diff --git a/app/assets/stylesheets/darkswarm/modals.css.scss b/app/assets/stylesheets/darkswarm/modals.css.scss
index e4048808f8..9c80e13007 100644
--- a/app/assets/stylesheets/darkswarm/modals.css.scss
+++ b/app/assets/stylesheets/darkswarm/modals.css.scss
@@ -72,6 +72,19 @@ dialog .mobile-close-reveal-modal
   }
 }
 
+.reveal-modal .buttons {
+  margin: 0 auto;
+  text-align: center;
+
+  .bottom-close-button {
+    background-color: $orange-500;
+
+    @media only screen and (min-width: 640px) {
+      display: none;
+    }
+  }
+}
+
 // Prevent body from scrolling when a modal is open
 body.modal-open {
   overflow: hidden;
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 01ba7cebd2..7692ef1531 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -2736,6 +2736,10 @@ See the %{link} to find out more about %{sitename}'s features and to start using
       signup_or_login: "Start By Signing Up (or logging in)"
       have_an_account: "Already have an account?"
       action_login: "Log in now."
+    shop:
+      products:
+        product_modal:
+          close: "Close"
 
   # Singular and plural forms of commonly used words.
   # We use these entries to pluralize unit names in every language.