Merge pull request #92 from tech-chieftain/Home

feat: add Images of our partners
tech-chieftain · Nov 19, 2020 · a98ec65 · a98ec65
2 parents 13e6387 + 9230879
commit a98ec65
Show file tree

Hide file tree

Showing 11 changed files with 152 additions and 45 deletions.
diff --git a/public/locales/ar/translation.json b/public/locales/ar/translation.json
@@ -57,8 +57,8 @@
     "CardThreeTitle": "أنا خائف من أن أفقد الوعي",
     "CardThreeDecs": "إذا شعرت بالإغماء أو الإرهاق ، استلقِ ببساطة حتى تشعر بتحسن. لاتقلق انت تمتلك حوالي خمسة لتر من الدم في جسمك. يتم إعطاء ما يقرب من نصف لترفقط.",
     "Partners": "شركاؤنا",
-    "PartnerOne": "مستشفى الثورة",
-    "PartnerTwo": "مستشفى الجمهوري",
+    "PartnerOne": " المستشفى السعودي الألماني‎",
+    "PartnerTwo": "مستشفى آزال",
     "PartnerThree": "بنك الدم"
   },
   "dontDonate": {

diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json
@@ -57,8 +57,8 @@
     "CardThreeTitle": "I'm Afraid I'll Faint",
     "CardThreeDecs": "If you do feel faint or fatigued,simply lie down until you feel better. think that you have about 10 pints of blood in your body. Roughly 1 pint is given.",
     "Partners": "Our Trusted Partner",
-    "PartnerOne": "Al-Thawra Hosital",
-    "PartnerTwo": "Al-Gomhori Hospital",
+    "PartnerOne": "Saudi German Hospital",
+    "PartnerTwo": "Azal Hospital",
     "PartnerThree": "Blood Bank"
   },
   "dontDonate": {
@@ -213,4 +213,4 @@
     "testingTitle": "Testing",
     "testingDesc": "Your blood is tested and sent to a patient in need."
   }
-}
+}
diff --git a/src/__snapshots__/App.test.js.snap b/src/__snapshots__/App.test.js.snap
@@ -218,7 +218,7 @@ Array [
             >
               <img
                 alt="icon"
-                className="w-16 sm:w-20"
+                className="w-16 h-12 sm:w-20 sm:h-16"
                 src="syringe-needle.svg"
               />
             </div>
@@ -253,7 +253,7 @@ Array [
             >
               <img
                 alt="icon"
-                className="w-16 sm:w-20"
+                className="w-16 h-12 sm:w-20 sm:h-16"
                 src="face-mask.svg"
               />
             </div>
@@ -288,7 +288,7 @@ Array [
             >
               <img
                 alt="icon"
-                className="w-16 sm:w-20"
+                className="w-16 h-12 sm:w-20 sm:h-16"
                 src="dizziness.svg"
               />
             </div>
@@ -367,8 +367,8 @@ Array [
           >
             <img
               alt="icon"
-              className="w-16 sm:w-20"
-              src="Bg.svg"
+              className="w-16 h-12 sm:w-20 sm:h-16"
+              src="hospital1.svg"
             />
           </div>
           <div
@@ -396,8 +396,8 @@ Array [
           >
             <img
               alt="icon"
-              className="w-16 sm:w-20"
-              src="Bg.svg"
+              className="w-16 h-12 sm:w-20 sm:h-16"
+              src="hospital2.svg"
             />
           </div>
           <div
@@ -425,8 +425,8 @@ Array [
           >
             <img
               alt="icon"
-              className="w-16 sm:w-20"
-              src="Bg.svg"
+              className="w-16 h-12 sm:w-20 sm:h-16"
+              src="bloodbank.svg"
             />
           </div>
           <div

diff --git a/src/components/Card/Card.jsx b/src/components/Card/Card.jsx
@@ -9,7 +9,7 @@ function Card({ cardImage, cardTitle, cardDesc, orientationText }) {
   return (
     <div className="rounded">
       <div className="flex justify-center">
-        <img className="w-16 sm:w-20" src={cardImage} alt="icon" />
+        <img className="w-16 h-12 sm:w-20 sm:h-16" src={cardImage} alt="icon" />
       </div>
 
       <div className="px-6 py-0 pb-6 my-5">

diff --git a/src/components/Card/__test__/__snapshots__/card.test.js.snap b/src/components/Card/__test__/__snapshots__/card.test.js.snap
@@ -9,7 +9,7 @@ exports[`renders correctly 1`] = `
   >
     <img
       alt="icon"
-      className="w-16 sm:w-20"
+      className="w-16 h-12 sm:w-20 sm:h-16"
       src="https://apifortress.com/doc/wp-content/uploads/2019/04/ForgeIcon_Black.svg"
     />
   </div>

diff --git a/src/containers/About/__test__/__snapshots__/About.test.jsx.snap b/src/containers/About/__test__/__snapshots__/About.test.jsx.snap
@@ -35,7 +35,7 @@ exports[`renders correctly 1`] = `
           >
             <img
               alt="icon"
-              className="w-16 sm:w-20"
+              className="w-16 h-12 sm:w-20 sm:h-16"
               src="bloodplus.svg"
             />
           </div>
@@ -70,7 +70,7 @@ exports[`renders correctly 1`] = `
           >
             <img
               alt="icon"
-              className="w-16 sm:w-20"
+              className="w-16 h-12 sm:w-20 sm:h-16"
               src="globalhealth.svg"
             />
           </div>
@@ -105,7 +105,7 @@ exports[`renders correctly 1`] = `
           >
             <img
               alt="icon"
-              className="w-16 sm:w-20"
+              className="w-16 h-12 sm:w-20 sm:h-16"
               src="free.svg"
             />
           </div>
@@ -140,7 +140,7 @@ exports[`renders correctly 1`] = `
           >
             <img
               alt="icon"
-              className="w-16 sm:w-20"
+              className="w-16 h-12 sm:w-20 sm:h-16"
               src="save.svg"
             />
           </div>

diff --git a/src/containers/Home/Home.jsx b/src/containers/Home/Home.jsx
@@ -11,7 +11,9 @@ import HeroImage from './images/HeroImage.png';
 import Icon1 from './images/syringe-needle.svg';
 import Icon2 from './images/face-mask.svg';
 import Icon3 from './images/dizziness.svg';
-import Image from './images/Bg.svg';
+import Image1 from './images/hospital1.svg';
+import Image2 from './images/hospital2.svg';
+import Image3 from './images/bloodbank.svg';
 
 function Home() {
   window.scrollTo(0, 0);
@@ -105,25 +107,13 @@ function Home() {
       </div>
       <div className=" flex justify-center flex-wrap ">
         <div className="flex-auto w-full md:w-2/6 lg:w-1/4 p-2 m-2">
-          <Card
-            cardImage={Image}
-            cardDesc={t('HomePage.PartnerOne')}
-            orientationText="center"
-          />
+          <Card cardImage={Image1} cardDesc={t('HomePage.PartnerOne')} orientationText="center" />
         </div>
         <div className="flex-auto w-full md:w-2/6 lg:w-1/4 p-2 m-2">
-          <Card
-            cardImage={Image}
-            cardDesc={t('HomePage.PartnerTwo')}
-            orientationText="center"
-          />
+          <Card cardImage={Image2} cardDesc={t('HomePage.PartnerTwo')} orientationText="center" />
         </div>
         <div className="flex-auto w-full md:w-2/6 lg:w-1/4 p-2 m-2">
-          <Card
-            cardImage={Image}
-            cardDesc={t('HomePage.PartnerThree')}
-            orientationText="center"
-          />
+          <Card cardImage={Image3} cardDesc={t('HomePage.PartnerThree')} orientationText="center" />
         </div>
       </div>
     </div>

diff --git a/src/containers/Home/__test__/__snapshots__/Home.test.jsx.snap b/src/containers/Home/__test__/__snapshots__/Home.test.jsx.snap
@@ -101,7 +101,7 @@ exports[`renders correctly 1`] = `
           >
             <img
               alt="icon"
-              className="w-16 sm:w-20"
+              className="w-16 h-12 sm:w-20 sm:h-16"
               src="syringe-needle.svg"
             />
           </div>
@@ -136,7 +136,7 @@ exports[`renders correctly 1`] = `
           >
             <img
               alt="icon"
-              className="w-16 sm:w-20"
+              className="w-16 h-12 sm:w-20 sm:h-16"
               src="face-mask.svg"
             />
           </div>
@@ -171,7 +171,7 @@ exports[`renders correctly 1`] = `
           >
             <img
               alt="icon"
-              className="w-16 sm:w-20"
+              className="w-16 h-12 sm:w-20 sm:h-16"
               src="dizziness.svg"
             />
           </div>
@@ -250,8 +250,8 @@ exports[`renders correctly 1`] = `
         >
           <img
             alt="icon"
-            className="w-16 sm:w-20"
-            src="Bg.svg"
+            className="w-16 h-12 sm:w-20 sm:h-16"
+            src="hospital1.svg"
           />
         </div>
         <div
@@ -279,8 +279,8 @@ exports[`renders correctly 1`] = `
         >
           <img
             alt="icon"
-            className="w-16 sm:w-20"
-            src="Bg.svg"
+            className="w-16 h-12 sm:w-20 sm:h-16"
+            src="hospital2.svg"
           />
         </div>
         <div
@@ -308,8 +308,8 @@ exports[`renders correctly 1`] = `
         >
           <img
             alt="icon"
-            className="w-16 sm:w-20"
-            src="Bg.svg"
+            className="w-16 h-12 sm:w-20 sm:h-16"
+            src="bloodbank.svg"
           />
         </div>
         <div

diff --git a/src/containers/Home/images/bloodbank.svg b/src/containers/Home/images/bloodbank.svg
diff --git a/src/containers/Home/images/hospital1.svg b/src/containers/Home/images/hospital1.svg