From c7017a5d75e86c5aeb1ecf51367c0f5d5e353915 Mon Sep 17 00:00:00 2001
From: SuhainaFathimaM <suhainafathimam@gmail.com>
Date: Wed, 5 Jun 2024 13:36:46 +0530
Subject: [PATCH 1/3] Added animations to the home page

---
 index.css | 27 ++++++++++++++++++++++++---
 1 file changed, 24 insertions(+), 3 deletions(-)

diff --git a/index.css b/index.css
index ab95e097..6b4b8d02 100644
--- a/index.css
+++ b/index.css
@@ -6,6 +6,7 @@ body {
     color: #000;
     margin: 0;
     padding: 0;
+    transition: background-color 0.3s ease-in-out;
 }
 
 .info>div {
@@ -19,6 +20,7 @@ body {
     background-color: #e7eefb;
 
     margin-right: 15px;
+    transition: background-color 0.3s ease-in-out;
 }
 
 .dropdown-item {
@@ -37,6 +39,7 @@ body {
     padding: 6px;
     border: none;
     background-color: transparent;
+    transition: border 0.3s ease-in-out;
 }
 
 #input_data:focus {
@@ -113,7 +116,7 @@ body {
     margin-bottom: 20px;
     margin-left: 0px;
     margin-right: 20px;
-
+    animation: fade-in 1s ease-in-out;
 }
 
 #category-grid .card {
@@ -138,6 +141,7 @@ body {
     width: 330px;
     border-radius: 20px;
     object-fit: fill;
+    transition: transform 0.3s ease-in-out;
 }
 
 #category-grid .cartbtn {
@@ -155,6 +159,7 @@ body {
     background-color: #f1dede;
     margin-left: 5px;
     margin-bottom: 8px;
+    transition: background-color 0.3s ease-in-out;
 
 }
 
@@ -170,8 +175,7 @@ body {
     height: 100%;
     object-fit: cover;
     transition: transform 0.3s ease 0.1s, width 2s, height 2.5s;
-
-
+    animation: zoomIn 1s ease-in-out;
 }
 
 
@@ -679,3 +683,20 @@ html {
 
 }
 
+@keyframes fade-in {
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
+}
+
+@keyframes zoomIn {
+    from {
+        transform: scale(0.8);
+    }
+    to {
+        transform: scale(1);
+    }
+}
\ No newline at end of file

From 6e04cd87f908c0657e5f3213d019c31eaa9a7e52 Mon Sep 17 00:00:00 2001
From: Suhaina Fathima M <153417476+SuhainaFathimaM@users.noreply.github.com>
Date: Wed, 5 Jun 2024 13:57:07 +0530
Subject: [PATCH 2/3] Added animation function

---
 index.css | 37 +++++++++++++++++++------------------
 1 file changed, 19 insertions(+), 18 deletions(-)

diff --git a/index.css b/index.css
index 6b4b8d02..74f42a1e 100644
--- a/index.css
+++ b/index.css
@@ -448,6 +448,25 @@ footer {
     }
 }
 
+
+@keyframes fade-in {
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
+}
+
+@keyframes zoomIn {
+    from {
+        transform: scale(0.8);
+    }
+    to {
+        transform: scale(1);
+    }
+}
+
 /* Footer styles
 /* footer {
     background-color: black;
@@ -682,21 +701,3 @@ html {
 
 
 }
-
-@keyframes fade-in {
-    from {
-        opacity: 0;
-    }
-    to {
-        opacity: 1;
-    }
-}
-
-@keyframes zoomIn {
-    from {
-        transform: scale(0.8);
-    }
-    to {
-        transform: scale(1);
-    }
-}
\ No newline at end of file

From 19f946e274e93c80591e966d0ff6bb38e8d3dac3 Mon Sep 17 00:00:00 2001
From: Suhaina Fathima M <153417476+SuhainaFathimaM@users.noreply.github.com>
Date: Wed, 5 Jun 2024 14:02:16 +0530
Subject: [PATCH 3/3] Added transitions

---
 index.css | 9 +++++++++
 1 file changed, 9 insertions(+)

diff --git a/index.css b/index.css
index 74f42a1e..91a34acc 100644
--- a/index.css
+++ b/index.css
@@ -6,6 +6,7 @@ body {
     color: #000;
     margin: 0;
     padding: 0;
+    
     transition: background-color 0.3s ease-in-out;
 }
 
@@ -20,6 +21,7 @@ body {
     background-color: #e7eefb;
 
     margin-right: 15px;
+    
     transition: background-color 0.3s ease-in-out;
 }
 
@@ -39,6 +41,7 @@ body {
     padding: 6px;
     border: none;
     background-color: transparent;
+    
     transition: border 0.3s ease-in-out;
 }
 
@@ -116,6 +119,7 @@ body {
     margin-bottom: 20px;
     margin-left: 0px;
     margin-right: 20px;
+    
     animation: fade-in 1s ease-in-out;
 }
 
@@ -141,6 +145,7 @@ body {
     width: 330px;
     border-radius: 20px;
     object-fit: fill;
+    
     transition: transform 0.3s ease-in-out;
 }
 
@@ -159,6 +164,8 @@ body {
     background-color: #f1dede;
     margin-left: 5px;
     margin-bottom: 8px;
+
+    
     transition: background-color 0.3s ease-in-out;
 
 }
@@ -175,6 +182,7 @@ body {
     height: 100%;
     object-fit: cover;
     transition: transform 0.3s ease 0.1s, width 2s, height 2.5s;
+    
     animation: zoomIn 1s ease-in-out;
 }
 
@@ -190,6 +198,7 @@ body {
 
 /*adding transition property to the images of the cateogory-grid section*/
 #category-grid img {
+    
     transition: transform 0.3s ease-in-out;
 }