From f04f7d03b2bc0b848df79f927a8047f3ebf47fa2 Mon Sep 17 00:00:00 2001
From: Khalim Conn-Kowlessar <kconnkowlessar@gmail.com>
Date: Tue, 30 May 2023 15:24:46 +0100
Subject: [PATCH] added empty files for part card and modal

---
 src/app/components/property/PartModal.tsx     |  0
 src/app/components/property/partCard.tsx      | 17 ++++++++++++++++
 .../[slug]/property/[lmkKey]/page.tsx         | 20 +++++++++++++++++--
 3 files changed, 35 insertions(+), 2 deletions(-)
 create mode 100644 src/app/components/property/PartModal.tsx
 create mode 100644 src/app/components/property/partCard.tsx

diff --git a/src/app/components/property/PartModal.tsx b/src/app/components/property/PartModal.tsx
new file mode 100644
index 0000000..e69de29
diff --git a/src/app/components/property/partCard.tsx b/src/app/components/property/partCard.tsx
new file mode 100644
index 0000000..1ed4da7
--- /dev/null
+++ b/src/app/components/property/partCard.tsx
@@ -0,0 +1,17 @@
+export default function PartCard({ title, handleDetailClick }) {
+  return (
+    <div className="mt-6">
+      <div className="flex items-center justify-between">
+        <h2 className="text-xl font-bold">{title}</h2>
+        <button
+          className="flex items-center text-blue-500"
+          onClick={handleDetailClick}
+        >
+          <div>PENCIL ICON</div>
+          Edit
+        </button>
+      </div>
+      <p className="text-gray-600">Short description of the card</p>
+    </div>
+  );
+}
diff --git a/src/app/portfolio/[slug]/property/[lmkKey]/page.tsx b/src/app/portfolio/[slug]/property/[lmkKey]/page.tsx
index 6c12b91..ce4c384 100644
--- a/src/app/portfolio/[slug]/property/[lmkKey]/page.tsx
+++ b/src/app/portfolio/[slug]/property/[lmkKey]/page.tsx
@@ -109,8 +109,24 @@ export default function PropertyPage({
             className="flex-1 border p-4 rounded-lg bg-brandblue text-white hover:bg-hoverblue transition-colors duration-200 cursor-pointer"
             onClick={handleEditClick}
           >
-            <h2 className="text-lg font-bold mb-2">Target EPC rating</h2>
-            <p>Rating: {targetEpcRating}</p>
+            <h2 className="text-lg font-bold mb-2 flex">Target EPC rating</h2>
+            <div className="flex">
+              <p className="flex-col">Rating: {targetEpcRating}</p>
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                fill="none"
+                viewBox="0 0 24 24"
+                strokeWidth={1.5}
+                stroke="currentColor"
+                className="w-6 h-6 ml-2"
+              >
+                <path
+                  strokeLinecap="round"
+                  strokeLinejoin="round"
+                  d="M16.862 4.487l1.687-1.688a1.875 1.875 0 112.652 2.652L10.582 16.07a4.5 4.5 0 01-1.897 1.13L6 18l.8-2.685a4.5 4.5 0 011.13-1.897l8.932-8.931zm0 0L19.5 7.125M18 14v4.75A2.25 2.25 0 0115.75 21H5.25A2.25 2.25 0 013 18.75V8.25A2.25 2.25 0 015.25 6H10"
+                />
+              </svg>
+            </div>
           </div>
         </div>