From e452802d1322c2ef36f699613167a4f5aad36ade Mon Sep 17 00:00:00 2001
From: Vazhin Tayeb <vazhintayeb@gmail.com>
Date: Sun, 17 Jan 2021 15:08:08 +0300
Subject: [PATCH] Customizes Real Estate App

---
 React/real-estate/src/index.css                             | 2 +-
 React/real-estate/src/pages/components/Heading3.js          | 4 ++--
 .../real-estate/src/pages/components/VehicleRegisterForm.js | 6 ++++--
 React/real-estate/src/pages/components/table/ColumnName.js  | 2 +-
 React/real-estate/src/pages/components/table/Table.js       | 4 ++--
 5 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/React/real-estate/src/index.css b/React/real-estate/src/index.css
index 97b18a2..ad7ab51 100644
--- a/React/real-estate/src/index.css
+++ b/React/real-estate/src/index.css
@@ -50,7 +50,7 @@ button:hover {
     right: 0px;
     flex-direction: column;
     align-items: flex-start;
-    background-color: #dfdfdf;
+    background-color: #f3f3f3;
     width: 40vw;
     height: 100vh;
     padding: 35vh 5vw 35vh 5vw;
diff --git a/React/real-estate/src/pages/components/Heading3.js b/React/real-estate/src/pages/components/Heading3.js
index 8a32395..eca1736 100644
--- a/React/real-estate/src/pages/components/Heading3.js
+++ b/React/real-estate/src/pages/components/Heading3.js
@@ -1,10 +1,10 @@
 import React from "react";
 
-const Heading3 = ({ children, styles = {} }) => {
+const Heading3 = ({ children, classes = "", styles = {} }) => {
   return (
     <h3
       style={{ ...styles }}
-      className="font-light font-inter text-black-custom my-20 self-start"
+      className={`font-light font-inter text-black-custom my-20 self-start ${classes}`}
     >
       {children}
     </h3>
diff --git a/React/real-estate/src/pages/components/VehicleRegisterForm.js b/React/real-estate/src/pages/components/VehicleRegisterForm.js
index 63f7cc5..6095da6 100644
--- a/React/real-estate/src/pages/components/VehicleRegisterForm.js
+++ b/React/real-estate/src/pages/components/VehicleRegisterForm.js
@@ -28,9 +28,11 @@ const VehicleRegisterForm = () => {
   }
 
   return (
-    <Card styles={{ padding: "60px" }} classes="xl:w-2/5">
+    <Card styles={{ padding: "100px 90px 100px 90px" }} classes="xl:w-2/5">
       <form onSubmit={(e) => e.preventDefault()} className="m-0 flex flex-col">
-        <Heading3 styles={{ marginTop: "0" }}>Register Real Estate</Heading3>
+        <Heading3 styles={{ marginTop: "0" }} classes="font-playfair">
+          Register Real Estate
+        </Heading3>
 
         <div className="flex flex-col">
           <InputText
diff --git a/React/real-estate/src/pages/components/table/ColumnName.js b/React/real-estate/src/pages/components/table/ColumnName.js
index 4164f3c..745b17c 100644
--- a/React/real-estate/src/pages/components/table/ColumnName.js
+++ b/React/real-estate/src/pages/components/table/ColumnName.js
@@ -3,7 +3,7 @@ import React from "react";
 const ColumnName = ({ text }) => (
   <th
     scope="col"
-    className="whitespace-nowrap text-2xl font-inter text-black-custom font-semibold text-center"
+    className="whitespace-nowrap text-2xl font-inter text-white font-semibold text-center"
     style={{ padding: "10px 40px 10px 40px" }}
   >
     {text}
diff --git a/React/real-estate/src/pages/components/table/Table.js b/React/real-estate/src/pages/components/table/Table.js
index f268817..b312455 100644
--- a/React/real-estate/src/pages/components/table/Table.js
+++ b/React/real-estate/src/pages/components/table/Table.js
@@ -7,7 +7,7 @@ const Table = ({ vehicleData }) => {
   return (
     <div className="shadow overflow-x-auto border-b border-gray-200 sm:rounded w-full">
       <table className="min-w-full divide-y divide-gray-200 mb-0">
-        <thead className="bg-gray-50">
+        <thead className="bg-blue-custom">
           <tr>
             <ColumnName text={"Address"} />
             <ColumnName text={"Area"} />
@@ -19,7 +19,7 @@ const Table = ({ vehicleData }) => {
         </thead>
         <tbody className="bg-white divide-y divide-gray-200">
           {vehicleData.map((vehicle) => (
-            <tr key={vehicle.id}>
+            <tr key={vehicle.id} className="bg-gray-50">
               <TableData text={vehicle.address} />
               <TableData text={vehicle.area} />
               <TableData text={vehicle.citizen_upn} />