From 332b49c9512445c99eaa3b354a09703049b71ca7 Mon Sep 17 00:00:00 2001
From: zxa666 <zxadeguge@gmail.com>
Date: Thu, 19 Sep 2024 21:34:53 +0800
Subject: [PATCH] adjust footer animation
---
src/containers/App/App.css | 18 +++++++++---------
1 file changed, 9 insertions(+), 9 deletions(-)
diff --git a/src/containers/App/App.css b/src/containers/App/App.css
index cd6c064..5d80a6b 100644
--- a/src/containers/App/App.css
+++ b/src/containers/App/App.css
@@ -504,10 +504,10 @@ footer a:hover {
.wave1 {
position: absolute;
- bottom: -25px;
+ bottom: -50px;
left: 0;
width: 200%; /* Ensure the wave extends beyond the viewport */
- height: 50px; /* Height of the wave */
+ height: 100px; /* Height of the wave */
background: linear-gradient(90deg, rgba(114, 47, 55, 1) 0%, rgba(114, 47, 55, 0.4) 100%);
border-radius: 100%;
transform: rotate(180deg);
@@ -525,10 +525,10 @@ footer a:hover {
.wave2 {
position: absolute;
- bottom: -25px;
+ bottom: -50px;
left: 0;
width: 200%; /* Ensure the wave extends beyond the viewport */
- height: 50px; /* Height of the wave */
+ height: 100px; /* Height of the wave */
background: linear-gradient(90deg, rgba(114, 47, 55, 1) 0%, rgba(114, 47, 55, 0.4) 100%);
border-radius: 100%;
transform: rotate(180deg);
@@ -546,10 +546,10 @@ footer a:hover {
.wave3 {
position: absolute;
- bottom: -25px;
+ bottom: -50px;
left: 0;
width: 200%; /* Ensure the wave extends beyond the viewport */
- height: 50px; /* Height of the wave */
+ height: 100px; /* Height of the wave */
background: linear-gradient(90deg, rgba(114, 47, 55, 0.8) 0%, rgba(114, 47, 55, 0.4) 100%);
border-radius: 100%;
transform: rotate(180deg);
@@ -567,10 +567,10 @@ footer a:hover {
.wave4 {
position: absolute;
- bottom: -25px;
+ bottom: -50px;
left: 0;
width: 200%; /* Ensure the wave extends beyond the viewport */
- height: 50px; /* Height of the wave */
+ height: 100px; /* Height of the wave */
background: linear-gradient(90deg, rgba(114, 47, 55, 0.5) 0%, rgba(114, 47, 55, 0.5) 100%);
border-radius: 100%;
transform: rotate(180deg);
@@ -601,7 +601,7 @@ footer a:hover {
}
.section {
- padding-top: 20px;
+ padding-top: 200px;
height: 100vh;
/* display: flex;
justify-content: center;
--
GitLab