From 13a248ba2b93c64a8a2678022fc4fba119a54151 Mon Sep 17 00:00:00 2001
From: Ahmad Abdolsaheb <ahmad.abdolsaheb@gmail.com>
Date: Tue, 2 Feb 2021 22:19:27 +0300
Subject: [PATCH] fix(client): landing and donate page night mode friendly
 (#40883)

---
 .../src/components/Donation/DonateFormChildViewForHOC.js  | 1 -
 client/src/components/Donation/Donation.css               | 4 +++-
 client/src/components/landing/landing.css                 | 8 +++++++-
 client/src/components/layouts/global.css                  | 1 +
 client/utils/gatsby/layoutSelector.js                     | 8 +-------
 5 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/client/src/components/Donation/DonateFormChildViewForHOC.js b/client/src/components/Donation/DonateFormChildViewForHOC.js
index 087d556d2e..877a84da4f 100644
--- a/client/src/components/Donation/DonateFormChildViewForHOC.js
+++ b/client/src/components/Donation/DonateFormChildViewForHOC.js
@@ -183,7 +183,6 @@ class DonateFormChildViewForHOC extends Component {
         <Button
           block={true}
           bsStyle='primary'
-          className='btn-cta'
           id='confirm-donation-btn'
           type='submit'
         >
diff --git a/client/src/components/Donation/Donation.css b/client/src/components/Donation/Donation.css
index 2ef90e9529..b119f2ce79 100644
--- a/client/src/components/Donation/Donation.css
+++ b/client/src/components/Donation/Donation.css
@@ -366,11 +366,13 @@ button#confirm-donation-btn {
   border-radius: 5px;
   background-color: var(--yellow-light);
   border-color: var(--yellow-light);
+  color: black;
+  font-weight: bold;
 }
 button#confirm-donation-btn:active,
 button#confirm-donation-btn:active:focus,
 button#confirm-donation-btn:hover {
-  color: var(--secondary-color);
+  color: black;
   background-color: #f2ba38;
   border-color: #f2ba38;
 }
diff --git a/client/src/components/landing/landing.css b/client/src/components/landing/landing.css
index 9fc74d4d8e..ac5e4b0e41 100644
--- a/client/src/components/landing/landing.css
+++ b/client/src/components/landing/landing.css
@@ -118,7 +118,7 @@ p.caption {
   font-family: 'Lato', sans-serif;
   font-size: 1.1rem;
   margin: 0;
-  color: var(--gray-75);
+  color: var(--quaternary-color);
 }
 .testimonial-meta p:last-child {
   margin-top: 15px;
@@ -157,6 +157,7 @@ p.caption {
   height: 100%;
   padding-bottom: 100%;
   position: relative;
+  background-color: var(--primary-background);
 }
 
 .testimonial-image {
@@ -173,6 +174,7 @@ p.caption {
   padding: 25px;
   text-align: justify;
   justify-content: center;
+  background-color: var(--primary-background);
 }
 .landing-top,
 .as-seen-in,
@@ -181,6 +183,10 @@ p.caption {
   padding: 4vw 0;
 }
 
+.map-ui .btn {
+  min-height: 80px;
+}
+
 @media (min-width: 500px) {
   .landing-top p {
     font-size: 1.25rem;
diff --git a/client/src/components/layouts/global.css b/client/src/components/layouts/global.css
index 75ce69ff3e..5dbdb8dab5 100644
--- a/client/src/components/layouts/global.css
+++ b/client/src/components/layouts/global.css
@@ -304,6 +304,7 @@ fieldset[disabled] .btn-primary.focus {
   color: var(--secondary-background);
 }
 
+.link-btn.btn-lg svg,
 .map-icon,
 .cert-header-icon {
   flex-shrink: 0;
diff --git a/client/utils/gatsby/layoutSelector.js b/client/utils/gatsby/layoutSelector.js
index c3a61387d6..94979433ec 100644
--- a/client/utils/gatsby/layoutSelector.js
+++ b/client/utils/gatsby/layoutSelector.js
@@ -37,13 +37,7 @@ export default function layoutSelector({ element, props }) {
       </DefaultLayout>
     );
   }
-  if (/^\/donation(\/.*)*|^\/$|^\/donate(\/.*)*/.test(pathname)) {
-    return (
-      <DefaultLayout pathname={pathname} useTheme={false}>
-        {element}
-      </DefaultLayout>
-    );
-  }
+
   return <DefaultLayout pathname={pathname}>{element}</DefaultLayout>;
 }