From 0ebb0261fc37f402b0fb12f696b0bec0512ff43e Mon Sep 17 00:00:00 2001 From: RitikaTholia <143015510+RitikaTholia@users.noreply.github.com> Date: Wed, 6 Nov 2024 13:13:03 +0530 Subject: [PATCH] made changes in feedback form css added subtle shadows and hover effect to text boxes. changed background color of send box to be more cohesive with color scheme and still stand out a bit (one color less in gradient without hover) . added hover effects to send button (adds 4th gradient color while hover and matches exactly as others colors). Didn't add color anywhere else to keep the footer consistent. --- style.css | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/style.css b/style.css index e7a1df4..28ac08a 100644 --- a/style.css +++ b/style.css @@ -1000,6 +1000,12 @@ button { border: none; width: 100%; border-radius: 5px; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); + transition: all 0.3s; +} + +.contact-form .text-input:hover { + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); } .contact-form textarea.text-input { @@ -1011,17 +1017,19 @@ button { float: right; font-size: 1.1em; font-family: "Arial", sans-serif; - background: #4caf50; + background: linear-gradient(45deg, #c7c400, #ff3c76, #f5f100b9); color: white; border: none; padding: 12px 20px; border-radius: 5px; cursor: pointer; transition: all 0.3s; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); } .contact-form .contact-btn:hover { - background: #45a049; + background: linear-gradient(135deg, #c7c400, #ff393d ,#ff3c76, #f5f100b9); + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.3); } #contact {