diff --git a/assets/contact/contact.css b/assets/contact/contact.css index a8fc5d0..b897467 100644 --- a/assets/contact/contact.css +++ b/assets/contact/contact.css @@ -44,7 +44,7 @@ input[type="text"]:focus, input[type="email"]:focus, textarea:focus { outline: none; - border-color: #4a90e2; + border-color: var(--primary-color); } textarea { @@ -53,7 +53,7 @@ textarea { } .submit-button { - background-color: #4a90e2; + background-color: var(--primary-color); color: #ffffff; border: none; padding: 12px 24px; @@ -61,9 +61,31 @@ textarea { font-weight: 600; border-radius: 4px; cursor: pointer; - transition: background-color 0.3s ease; + transition: + background-color 0.3s ease-in-out, + opacity 0.3s ease-in-out, + transform 0.3s ease-in-out, + box-shadow 0.3s ease-in-out; } .submit-button:hover { - background-color: #3a7bc8; + background-color: var(--primary-color); + opacity: 0.9; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); + transform: translateY(-2px); +} + +.submit-button:active { + transform: translateY(0); + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); + transition: all 0.1s ease-in-out; +} + +.submit-button:focus { + outline: none; + box-shadow: 0 0 0 3px rgba(var(--primary-rgb), 0.3); +} + +.submit-button:focus:not(:active) { + transition: box-shadow 0.3s ease-in-out; } \ No newline at end of file