Merge pull request #94 from tech-chieftain/task/firebaseupdate

enhance: update firebase and edit some styles
tech-chieftain · Nov 21, 2020 · 58e9403 · 58e9403
2 parents 5e508a7 + 8daec51
commit 58e9403
Show file tree

Hide file tree

Showing 22 changed files with 67 additions and 58 deletions.
diff --git a/src/Firebase/Firebase.js b/src/Firebase/Firebase.js
@@ -4,14 +4,14 @@ import 'firebase/firestore';
 // Your web app's Firebase configuration
 // For Firebase JS SDK v7.20.0 and later, measurementId is optional
 const firebaseConfig = {
-  apiKey: 'AIzaSyCmmGbub9jlAGiG-cR8zuu9jp5gHN_AiB0',
-  authDomain: 'blood-donars-63da7.firebaseapp.com',
-  databaseURL: 'https://blood-donars-63da7.firebaseio.com',
-  projectId: 'blood-donars-63da7',
-  storageBucket: 'blood-donars-63da7.appspot.com',
-  messagingSenderId: '563577097714',
-  appId: '1:563577097714:web:785bb6ea8e3a2a8025af6b',
-  measurementId: 'G-CDGZNX7PH3',
+  apiKey: 'AIzaSyBv7nM7ZuaZ6VZWNVngISqTpjbXXOti2-0',
+  authDomain: 'lifevessels.firebaseapp.com',
+  databaseURL: 'https://lifevessels.firebaseio.com',
+  projectId: 'lifevessels',
+  storageBucket: 'lifevessels.appspot.com',
+  messagingSenderId: '1001070360554',
+  appId: '1:1001070360554:web:dd31de001186f9d3eca493',
+  measurementId: 'G-Y7EZT4BTCX',
 };
 // Initialize Firebase
 Firebase.initializeApp(firebaseConfig);

diff --git a/src/__snapshots__/App.test.js.snap b/src/__snapshots__/App.test.js.snap
@@ -567,7 +567,7 @@ Array [
           target="_blank"
         >
           <svg
-            className="mr-4 "
+            className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
             fill="none"
             height="32.74"
             viewBox="0 0 18 22"
@@ -602,7 +602,7 @@ Array [
           target="_blank"
         >
           <svg
-            className="mr-4"
+            className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
             fill="none"
             height="32.74"
             viewBox="0 0 17 22"
@@ -637,7 +637,7 @@ Array [
           target="_blank"
         >
           <svg
-            className="mr-4"
+            className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
             fill="none"
             height="32.74"
             viewBox="0 0 18 22"
@@ -672,7 +672,7 @@ Array [
           target="_blank"
         >
           <svg
-            className="mr-4"
+            className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
             fill="none"
             height="32.74"
             viewBox="0 0 17 22"
@@ -707,7 +707,7 @@ Array [
           target="_blank"
         >
           <svg
-            className="mr-4"
+            className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
             fill="none"
             height="32.74"
             viewBox="0 0 17 22"

diff --git a/src/components/ContactForm/ContactForm.jsx b/src/components/ContactForm/ContactForm.jsx
@@ -42,7 +42,7 @@ const ContactForm = () => {
         />
       </div>
       <textarea
-        className=" flex-1 mr-4 p-2 text-base tracking-normal  placeholder-gray-500 border-2 border-gray-300 focus:outline-none "
+        className=" flex-1 mr-4 p-2 text-base tracking-normal  placeholder-gray-500 border-2 border-gray-300 focus:outline-none focus:placeholder-transparent hover:border-primary-100 transition duration-500  "
         rows="6"
         placeholder={t('AboutPage.ContectMessage')}
         value={form.massege}

diff --git a/src/components/ContactForm/__test__/__snapshots__/ContactForm.test.jsx.snap b/src/components/ContactForm/__test__/__snapshots__/ContactForm.test.jsx.snap
@@ -15,7 +15,8 @@ exports[`renders correctly 1`] = `
         htmlFor="name"
       />
       <input
-        className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none  bg-white placeholder-gray-500"
+        autoComplete="off"
+        className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none hover:border-primary-100 transition duration-500 focus:placeholder-transparent  bg-white placeholder-gray-500"
         id="name"
         name="name"
         onChange={[Function]}
@@ -32,7 +33,8 @@ exports[`renders correctly 1`] = `
         htmlFor="email"
       />
       <input
-        className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none  bg-white placeholder-gray-500"
+        autoComplete="off"
+        className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none hover:border-primary-100 transition duration-500 focus:placeholder-transparent  bg-white placeholder-gray-500"
         id="email"
         name="email"
         onChange={[Function]}
@@ -43,7 +45,7 @@ exports[`renders correctly 1`] = `
     </div>
   </div>
   <textarea
-    className=" flex-1 mr-4 p-2 text-base tracking-normal  placeholder-gray-500 border-2 border-gray-300 focus:outline-none "
+    className=" flex-1 mr-4 p-2 text-base tracking-normal  placeholder-gray-500 border-2 border-gray-300 focus:outline-none focus:placeholder-transparent hover:border-primary-100 transition duration-500  "
     name="massege"
     onChange={[Function]}
     placeholder="AboutPage.ContectMessage"

diff --git a/src/components/Footer/SocialIcons/__test__/__snapshots__/SocialIcons.test.jsx.snap b/src/components/Footer/SocialIcons/__test__/__snapshots__/SocialIcons.test.jsx.snap
@@ -10,7 +10,7 @@ exports[`renders correctly 1`] = `
     target="_blank"
   >
     <svg
-      className="mr-4 "
+      className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
       fill="none"
       height="32.74"
       viewBox="0 0 18 22"
@@ -45,7 +45,7 @@ exports[`renders correctly 1`] = `
     target="_blank"
   >
     <svg
-      className="mr-4"
+      className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
       fill="none"
       height="32.74"
       viewBox="0 0 17 22"
@@ -80,7 +80,7 @@ exports[`renders correctly 1`] = `
     target="_blank"
   >
     <svg
-      className="mr-4"
+      className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
       fill="none"
       height="32.74"
       viewBox="0 0 18 22"
@@ -115,7 +115,7 @@ exports[`renders correctly 1`] = `
     target="_blank"
   >
     <svg
-      className="mr-4"
+      className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
       fill="none"
       height="32.74"
       viewBox="0 0 17 22"
@@ -150,7 +150,7 @@ exports[`renders correctly 1`] = `
     target="_blank"
   >
     <svg
-      className="mr-4"
+      className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
       fill="none"
       height="32.74"
       viewBox="0 0 17 22"

diff --git a/src/components/Footer/__test__/__snapshots__/Footer.test.jsx.snap b/src/components/Footer/__test__/__snapshots__/Footer.test.jsx.snap
@@ -123,7 +123,7 @@ exports[`renders correctly 1`] = `
         target="_blank"
       >
         <svg
-          className="mr-4 "
+          className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
           fill="none"
           height="32.74"
           viewBox="0 0 18 22"
@@ -158,7 +158,7 @@ exports[`renders correctly 1`] = `
         target="_blank"
       >
         <svg
-          className="mr-4"
+          className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
           fill="none"
           height="32.74"
           viewBox="0 0 17 22"
@@ -193,7 +193,7 @@ exports[`renders correctly 1`] = `
         target="_blank"
       >
         <svg
-          className="mr-4"
+          className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
           fill="none"
           height="32.74"
           viewBox="0 0 18 22"
@@ -228,7 +228,7 @@ exports[`renders correctly 1`] = `
         target="_blank"
       >
         <svg
-          className="mr-4"
+          className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
           fill="none"
           height="32.74"
           viewBox="0 0 17 22"
@@ -263,7 +263,7 @@ exports[`renders correctly 1`] = `
         target="_blank"
       >
         <svg
-          className="mr-4"
+          className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
           fill="none"
           height="32.74"
           viewBox="0 0 17 22"

diff --git a/src/components/InputField/InputField.jsx b/src/components/InputField/InputField.jsx
@@ -8,13 +8,14 @@ function InputForm({ labelText, placeholder, onChange, inputValue, Inputtype, in
         {labelText}
       </label>
       <input
-        className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none  bg-white placeholder-gray-500"
+        className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none hover:border-primary-100 transition duration-500 focus:placeholder-transparent  bg-white placeholder-gray-500"
         placeholder={placeholder}
         type={Inputtype}
         name={inputName}
         value={inputValue}
         onChange={onChange}
         id={inputName}
+        autoComplete="off"
       />
     </div>
   );

diff --git a/src/components/InputField/__test__/__snapshots__/InputField.test.jsx.snap b/src/components/InputField/__test__/__snapshots__/InputField.test.jsx.snap
@@ -9,7 +9,8 @@ exports[`renders correctly 1`] = `
     htmlFor="name"
   />
   <input
-    className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none  bg-white placeholder-gray-500"
+    autoComplete="off"
+    className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none hover:border-primary-100 transition duration-500 focus:placeholder-transparent  bg-white placeholder-gray-500"
     id="name"
     name="name"
     onChange={[Function]}

diff --git a/src/components/InputSelect/InputSelect.jsx b/src/components/InputSelect/InputSelect.jsx
@@ -13,7 +13,7 @@ function InputSelect({ city, text, onChange, name, options, classflag }) {
           {text}
         </div>
         <select
-          className="form-select block w-full border-gray-300 border-2 py-2 px-4 text-sm sm:text-base md:text-lg "
+          className="form-select block w-full border-gray-300 border-2 py-2 px-4 text-sm sm:text-base md:text-lg focus:outline-none "
           value={city}
           name={name}
           onChange={onChange}

diff --git a/src/components/InputSelect/__test__/__snapshots__/InputSelect.test.jsx.snap b/src/components/InputSelect/__test__/__snapshots__/InputSelect.test.jsx.snap
@@ -14,7 +14,7 @@ exports[`renders correctly 1`] = `
       3. Please select your city ?*
     </div>
     <select
-      className="form-select block w-full border-gray-300 border-2 py-2 px-4 text-sm sm:text-base md:text-lg "
+      className="form-select block w-full border-gray-300 border-2 py-2 px-4 text-sm sm:text-base md:text-lg focus:outline-none "
       name="city"
       onBlur={[Function]}
       onChange={[Function]}

diff --git a/src/components/SecondStep/__test__/__snapshots__/SecondStep.test.jsx.snap b/src/components/SecondStep/__test__/__snapshots__/SecondStep.test.jsx.snap
@@ -216,7 +216,7 @@ exports[`renders correctly 1`] = `
             donate_second_page.city
           </div>
           <select
-            className="form-select block w-full border-gray-300 border-2 py-2 px-4 text-sm sm:text-base md:text-lg "
+            className="form-select block w-full border-gray-300 border-2 py-2 px-4 text-sm sm:text-base md:text-lg focus:outline-none "
             name="city"
             onBlur={[Function]}
             onChange={[Function]}

diff --git a/src/components/Table/DonorRow/DonorRow.jsx b/src/components/Table/DonorRow/DonorRow.jsx
@@ -5,7 +5,7 @@ function DonorRow({ donor }) {
   const StylesClass = {
     // grayColor: 'w-full bg-gray-200',
     // whiteColor: 'we-full bg-red',
-    rowStyle: 'bg-white odd:bg-gray-200',
+    rowStyle: 'bg-white odd:bg-gray-200 hover:bg-primary-100 hover:text-white ',
     ceilClass:
       'border px-4 py-2 text-center lg:px-6 mt-4 md:mt-0  whitespace-no-wrap border-b bg-gray',
     headerStyle:

diff --git a/src/components/ThirdStep/ThirdStep.jsx b/src/components/ThirdStep/ThirdStep.jsx
@@ -62,7 +62,7 @@ function ThirdStep({ donor, onChange, setStep, onRegister }) {
             <div>
               <InputField
                 labelText={t('donate_third_page.name')}
-                placeholder={t('donate_third_page.name_placeholder')}
+                placeholder=""
                 onChange={onChange}
                 inputValue={donor.name}
                 inputName="name"
@@ -75,7 +75,7 @@ function ThirdStep({ donor, onChange, setStep, onRegister }) {
             <div>
               <InputField
                 labelText={t('donate_third_page.phone')}
-                placeholder={t('donate_third_page.phone_placeholder')}
+                placeholder=""
                 onChange={onChange}
                 inputValue={donor.phone}
                 inputName="phone"
@@ -88,7 +88,7 @@ function ThirdStep({ donor, onChange, setStep, onRegister }) {
             <div>
               <InputField
                 labelText={t('donate_third_page.email')}
-                placeholder={t('donate_third_page.email_placeholder')}
+                placeholder=""
                 onChange={onChange}
                 inputValue={donor.email}
                 inputName="email"

diff --git a/src/components/ThirdStep/__test__/__snapshots__/ThirdStep.test.jsx.snap b/src/components/ThirdStep/__test__/__snapshots__/ThirdStep.test.jsx.snap
@@ -74,11 +74,12 @@ exports[`renders correctly 1`] = `
               donate_third_page.name
             </label>
             <input
-              className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none  bg-white placeholder-gray-500"
+              autoComplete="off"
+              className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none hover:border-primary-100 transition duration-500 focus:placeholder-transparent  bg-white placeholder-gray-500"
               id="name"
               name="name"
               onChange={[Function]}
-              placeholder="donate_third_page.name_placeholder"
+              placeholder=""
               type="text"
               value=""
             />
@@ -100,11 +101,12 @@ exports[`renders correctly 1`] = `
               donate_third_page.phone
             </label>
             <input
-              className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none  bg-white placeholder-gray-500"
+              autoComplete="off"
+              className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none hover:border-primary-100 transition duration-500 focus:placeholder-transparent  bg-white placeholder-gray-500"
               id="phone"
               name="phone"
               onChange={[Function]}
-              placeholder="donate_third_page.phone_placeholder"
+              placeholder=""
               type="text"
               value=""
             />
@@ -126,11 +128,12 @@ exports[`renders correctly 1`] = `
               donate_third_page.email
             </label>
             <input
-              className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none  bg-white placeholder-gray-500"
+              autoComplete="off"
+              className="flex-1  mr-4 p-2 text-sm sm:text-base tracking-normal  border-2 border-gray-300 focus:outline-none hover:border-primary-100 transition duration-500 focus:placeholder-transparent  bg-white placeholder-gray-500"
               id="email"
               name="email"
               onChange={[Function]}
-              placeholder="donate_third_page.email_placeholder"
+              placeholder=""
               type="email"
               value=""
             />

diff --git a/src/components/images/SocialIcons/FBIcon.jsx b/src/components/images/SocialIcons/FBIcon.jsx
@@ -8,7 +8,7 @@ function FBIcon() {
       height="32.74"
       fill="none"
       viewBox="0 0 18 22"
-      className="mr-4 "
+      className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
     >
       <path
         fill="#fff"

diff --git a/src/components/images/SocialIcons/InstaIcon.jsx b/src/components/images/SocialIcons/InstaIcon.jsx
@@ -8,7 +8,7 @@ function InstaIcon() {
       height="32.74"
       fill="none"
       viewBox="0 0 17 22"
-      className="mr-4"
+      className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
     >
       <path
         fill="#fff"

diff --git a/src/components/images/SocialIcons/LinkedInIcon.jsx b/src/components/images/SocialIcons/LinkedInIcon.jsx
@@ -8,7 +8,7 @@ function LinkedInIcon() {
       height="32.74"
       fill="none"
       viewBox="0 0 18 22"
-      className="mr-4"
+      className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
     >
       <path
         fill="#fff"

diff --git a/src/components/images/SocialIcons/TwitterIcon.jsx b/src/components/images/SocialIcons/TwitterIcon.jsx
@@ -8,7 +8,7 @@ function TwitterIcon() {
       height="32.74"
       fill="none"
       viewBox="0 0 17 22"
-      className="mr-4"
+      className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
     >
       <path
         fill="#fff"

diff --git a/src/components/images/SocialIcons/UtupeIcon.jsx b/src/components/images/SocialIcons/UtupeIcon.jsx
@@ -8,7 +8,7 @@ function UtupeIcon() {
       height="32.74"
       fill="none"
       viewBox="0 0 17 22"
-      className="mr-4"
+      className="mr-4 h-6 w-6 transform hover:scale-125 transition duration-500 ease-out"
     >
       <path
         fill="#fff"