github
/
ConsulManager
mirror of https://github.com/starsliao/ConsulManager
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

add login png

pull/24/head
StarsL.cn 2022-04-10 22:44:57 +08:00
parent eeb4922bc4
commit 6a0458d88b
3 changed files with 14 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
vue-consul/src/assets/login_images/SLH.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.4 KiB

BIN
vue-consul/src/assets/login_images/bg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 61 KiB

21
vue-consul/src/views/login/index.vue
View File

@ -2,7 +2,8 @@
<div class="login-container"> <div class="login-container">
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on" label-position="left"> <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form" auto-complete="on" label-position="left">
<div class="title-container"> <div class="title-container" style="text-align:center">
<img src="../../assets/login_images/SLH.png" width="90" height="90">
<h3 style="font-size:35px" class="title">Consul Manager</h3> <h3 style="font-size:35px" class="title">Consul Manager</h3>
</div> </div>
@ -162,7 +163,7 @@ $cursor: #fff;
} }
.el-form-item { .el-form-item {
border: 1px solid rgba(255, 255, 255, 0.1); border: 2px solid rgba(255, 255, 255, 0.3);
background: rgba(0, 0, 0, 0.1); background: rgba(0, 0, 0, 0.1);
border-radius: 5px; border-radius: 5px;
color: #454545; color: #454545;
@ -176,14 +177,20 @@ $dark_gray:#889aa4;
$light_gray:#eee; $light_gray:#eee;
.login-container { .login-container {
min-height: 100%; // min-height: 100%;
// width: 100%;
// background-color: $bg;
// overflow: hidden;
width: 100%; width: 100%;
background-color: $bg; height: 100%;
overflow: hidden; background-image: url("../../assets/login_images/bg.png");
background-size: cover;
background-position: center;
position: relative;
.login-form { .login-form {
position: relative; position: relative;
width: 520px; width: 460px;
max-width: 100%; max-width: 100%;
padding: 160px 35px 0; padding: 160px 35px 0;
margin: 0 auto; margin: 0 auto;
@ -216,7 +223,7 @@ $light_gray:#eee;
.title { .title {
font-size: 26px; font-size: 26px;
color: $light_gray; color: $light_gray;
margin: 0px auto 40px auto; margin: 0px auto 20px auto;
text-align: center; text-align: center;
font-weight: bold; font-weight: bold;
} }