feat: added style for 'change image'

Frontend/src/Components/UploadForm.tsx

@@ -123,15 +123,25 @@ export default function UploadForm({ image, onPress }: Props) {
                 hover:outline-1
                 transition-all
                 overflow-hidden
+                relative
+                hover-text-overlay
             `}
         >
           {image && image.data
             ? (
-              <img
-                src={image.data}
-                alt="Uploaded"
-                className="object-fit h-full custom-scale"
-              />
+              <>
+                <img
+                  src={image.data}
+                  alt="Uploaded"
+                  className="object-fit h-full custom-scale"
+                  title="Change Image"
+                />
+                <div className="absolute inset-0 bg-gray-900 bg-opacity-50 flex items-center justify-center opacity-0 hover-text transition-opacity duration-300 ">
+                  <h1 className="text-white text-[41px] font-[900]">
+                    Change Image
+                  </h1>
+                </div>
+              </>
             )
             : (
               <>

Frontend/src/styles/index.css

@@ -1,27 +1,31 @@
 .container-full {
-    height: calc(100vh - 16px - 56px);
+  height: calc(100vh - 16px - 56px);
 }
 
 .transition-outline {
-    transition: 200ms outline linear;
+  transition: 200ms outline linear;
 }
 
 .transite-width {
-    transition: 200ms width linear;
+  transition: 200ms width linear;
 }
 
 .custom-scale {
-    transition: 200ms scale linear;
-    object-fit: cover;
-    &:hover {
-        scale: 1.1;
-    }
+  transition: 200ms scale linear;
+  object-fit: cover;
+  &:hover {
+    scale: 1.1;
+  }
 }
 
 .shadow-card {
-    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.31);
+  box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.31);
 }
 
 ::-webkit-scrollbar {
-    width: 0;
-}
+  width: 0;
+}
+
+.hover-text-overlay:hover .hover-text {
+  opacity: 1;
+}

Makefile

@@ -1,8 +1,7 @@
 client:
 	cd Frontend && npm run dev
 
-
 server:
 	python3 Backend/main.py
 
-.PHONY: client
+.PHONY: client server