From 821db426f187b6a0e2c38effff6c63aa3ac673ed Mon Sep 17 00:00:00 2001
From: Admin <978517621@qq.com>
Date: 星期五, 05 八月 2022 15:55:22 +0800
Subject: [PATCH] 登录页面调整
---
src/views/loginPage/loginPage.vue | 20 +++++++++++++-------
src/views/loginPage/component/accountLogin.vue | 2 +-
2 files changed, 14 insertions(+), 8 deletions(-)
diff --git a/src/views/loginPage/component/accountLogin.vue b/src/views/loginPage/component/accountLogin.vue
index 9abfc1b..3385ed5 100644
--- a/src/views/loginPage/component/accountLogin.vue
+++ b/src/views/loginPage/component/accountLogin.vue
@@ -157,7 +157,7 @@
<style scoped lang="scss">
.login-content-form {
margin-top: 40px;
- width: 420px;
+ width: 100%;
.el-input::v-deep .el-input__wrapper {
height: 56px;
diff --git a/src/views/loginPage/loginPage.vue b/src/views/loginPage/loginPage.vue
index 5346db8..ab061f4 100644
--- a/src/views/loginPage/loginPage.vue
+++ b/src/views/loginPage/loginPage.vue
@@ -3,12 +3,15 @@
<div id="particles-js" style="display: flex;align-items: center;justify-content: center">
<canvas class="particles-js-canvas-el" style="width: 100%; height: 100%;" width="472" height="625"></canvas>
</div>
- <div class="loginContent">
+ <el-row class="loginContent">
+ <el-col :sm="24" :md="12">
<div class="loginContL">
<div class="apTitleT">新疆国泰新华</div>
<div class="apTitleB">安全风险预警监测系统</div>
<span></span>
</div>
+ </el-col>
+ <el-col :sm="24" :md="12">
<div class="loginPanel">
<div class="welc">WELCOME！</div>
<div class="welcc">欢迎登录</div>
@@ -21,7 +24,8 @@
</el-tabs>
</div>
</div>
- </div>
+ </el-col>
+ </el-row>
</div>
</template>
@@ -106,16 +110,16 @@
.loginContent{
width: 100%;
- padding: 0 300px;
+ padding: 0 150px;
display: flex;
- align-items: flex-start;
- justify-content: space-between;
+ align-items: center;
+ justify-content: space-around;
.loginContL{
+ width: 100%;
font-size: 48px;
font-weight: bold;
- padding-top: 80px;
- margin-right: 30px;
+ margin-bottom: 100px;
.apTitleT{
color: #fff;
@@ -135,8 +139,10 @@
}
}
.loginPanel{
+ width: 80%;
padding: 85px 70px;
background: #fff;
+ min-width: 450px;
border-radius: 15px;
box-shadow: 0 8px 40px rgba(0,0,0,.15);
--
Gitblit v1.9.2