Enhanced the contact form (#1394)

Rakesh9100 · Dec 10, 2024 · 62e767a · 62e767a
1 parent 80f5c03
commit 62e767a
Showing 1 changed file with 22 additions and 5 deletions.
diff --git a/assets/css_files/contact.css b/assets/css_files/contact.css
@@ -46,10 +46,17 @@ body {
 }
 
 .info-title {
-    text-align: left;
+    text-align: center;
     font-size: 28px;
-    letter-spacing: 0.5px;
-    text-shadow: 1px 2px 2px black;
+    color: #fff9f9;
+    transition: all 0.3s ease-in-out;
+    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
+}
+
+.info-title:hover {
+    color: #00d5ff; /* Change text color on hover */
+    transform: scale(1.1); /* Slightly increase size on hover */
+    text-shadow: 4px 4px 10px rgba(0, 0, 0, 0.5); /* Enhance shadow on hover */
 }
 
 .info-sub-title {
@@ -74,13 +81,21 @@ body {
 }
 
 .info-details li i {
+    display: inline-block;
     background: #49025f;
     padding: 9px;
     border-radius: 50%;
     font-size: 14px;
     margin-right: 5px;
     text-shadow: 1px 2px 2px black;
     box-shadow: 1px 1px 2px black;
+    transition: all 0.4s ease-in-out;
+    cursor: pointer;
+}
+
+.info-details li i:hover {
+    transform: translateY(-5px) rotate(10deg);
+    box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.5), -5px -5px 15px rgba(255, 255, 255, 0.6);
 }
 
 .info-details li a {
@@ -112,13 +127,15 @@ body {
     border-radius: 22%;
     margin: 0px 5px;
     cursor: pointer;
-    transition: all 0.5s;
-    box-shadow: 1px 1px 2px black;
+    transition: all 0.5s ease-in-out;
+    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5);
 }
 
 .social-icons li i:hover {
     background: #fff;
     color: #49025f;
+    box-shadow: 0 4px 15px rgba(73, 2, 95, 0.8), 0 0 10px rgba(73, 2, 95, 0.5);
+    transform: scale(1.1);
 }
 
 .form-wrap {