From 9642ae755b78697dd6bbb4bbdc8b08179ae79fba Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期四, 28 十一月 2024 15:42:37 +0800
Subject: [PATCH] 修改首页
---
src/views/homePage.vue | 35 +++++++++++++++++++++++++++++++----
1 files changed, 31 insertions(+), 4 deletions(-)
diff --git a/src/views/homePage.vue b/src/views/homePage.vue
index 480d40d..8c5d64d 100644
--- a/src/views/homePage.vue
+++ b/src/views/homePage.vue
@@ -376,19 +376,31 @@
.content{
display: flex;
min-width: 1200px;
- min-height: 600px;
+ min-height: 560px;
border-radius: 16px;
background: url("../assets/images/logbox.jpg") no-repeat center;
background-size: cover;
box-shadow: 0 10px 20px rgba(0,0,0,.1);
transform: translateY(-50px);
+ position: relative;
+}
+@keyframes float {
+ 100% {
+ transform: translateX(0);
+ opacity: 100%;
+ -webkit-opacity: 100%
+ }
}
.imgBox {
width: 50%;
- min-height: 600px;
+ min-height: 560px;
+ opacity: 0;
+ -webkit-opacity: 0;
+ transform: translateX(50px);
display: flex;
justify-content: center;
align-items: center;
+ animation: float ease 0.6s 0.6s forwards;
}
.fromRow{
width: 100%;
@@ -402,16 +414,31 @@
align-items: center;
background-repeat: no-repeat;
}
+@keyframes showForm {
+ 100% {
+ transform: translateY(0);
+ opacity: 100%;
+ -webkit-opacity: 100%
+ }
+}
.formBox{
width: 50%;
height: 100%;
- min-height: 600px;
- border-radius: 0 16px 16px 0;
+ position: absolute;
+ right: 0;
+ top: -30px;
+ transform: translateY(30px);
+ opacity: 0;
+ -webkit-opacity: 0;
+ min-height: 620px;
+ border-radius: 16px;
background: #fff;
padding: 30px;
display: flex;
flex-direction: column;
justify-content: center;
+ z-index: 999;
+ animation: showForm ease-in-out 0.6s forwards;
}
.loginTitle{
width: 100%;
--
Gitblit v1.9.2