术习电报 / electron-vue-template

转到一个项目
切换导航栏
切换导航栏固定状态
张恒
872f1d2b 1 个父辈 86fb5827

小幅度修改登录页样式

内嵌 并排
正在显示 3 个修改的文件 包含 73 行增加 和 16 行删除
......@@ -7930,12 +7930,14 @@
"balanced-match": {
"version": "1.0.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"brace-expansion": {
"version": "1.1.11",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
......@@ -7950,17 +7952,20 @@
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"concat-map": {
"version": "0.0.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"core-util-is": {
"version": "1.0.2",
......@@ -8077,7 +8082,8 @@
"inherits": {
"version": "2.0.4",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"ini": {
"version": "1.3.5",
......@@ -8089,6 +8095,7 @@
"version": "1.0.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
......@@ -8103,6 +8110,7 @@
"version": "3.0.4",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"brace-expansion": "^1.1.7"
}
......@@ -8223,7 +8231,8 @@
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"dev": true
"dev": true,
"optional": true
},
"object-assign": {
"version": "4.1.1",
......@@ -8235,6 +8244,7 @@
"version": "1.4.0",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"wrappy": "1"
}
......@@ -8356,6 +8366,7 @@
"version": "1.0.2",
"bundled": true,
"dev": true,
"optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
......
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1577517047047" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6202" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css"></style></defs><path d="M512 128q69.675 0 135.51 21.163t115.498 54.997 93.483 74.837 73.685 82.006 51.67 74.837 32.17 54.827L1024 512q-2.347 4.992-6.315 13.483T998.87 560.17t-31.658 51.669-44.331 59.99-56.832 64.34-69.504 60.16-82.347 51.5-94.848 34.687T512 896q-69.675 0-135.51-21.163t-115.498-54.826-93.483-74.326-73.685-81.493-51.67-74.496-32.17-54.997L0 513.707q2.347-4.992 6.315-13.483t18.816-34.816 31.658-51.84 44.331-60.33 56.832-64.683 69.504-60.331 82.347-51.84 94.848-34.816T512 128.085z m0 85.333q-46.677 0-91.648 12.331t-81.152 31.83-70.656 47.146-59.648 54.485-48.853 57.686-37.675 52.821-26.325 43.99q12.33 21.674 26.325 43.52t37.675 52.351 48.853 57.003 59.648 53.845T339.2 767.02t81.152 31.488T512 810.667t91.648-12.331 81.152-31.659 70.656-46.848 59.648-54.186 48.853-57.344 37.675-52.651T927.957 512q-12.33-21.675-26.325-43.648t-37.675-52.65-48.853-57.345-59.648-54.186-70.656-46.848-81.152-31.659T512 213.334z m0 128q70.656 0 120.661 50.006T682.667 512 632.66 632.661 512 682.667 391.339 632.66 341.333 512t50.006-120.661T512 341.333z m0 85.334q-35.328 0-60.33 25.002T426.666 512t25.002 60.33T512 597.334t60.33-25.002T597.334 512t-25.002-60.33T512 426.666z" p-id="6203"></path></svg>
\ No newline at end of file
......@@ -35,17 +35,12 @@
placeholder="密码"
></el-input>
<span class="show-pwd" @click="showPwd">
<svg-icon icon-class="eye" />
<svg-icon :icon-class="pwdType ==='password'?'eye':'eye-open'" />
</span>
</el-form-item>
<el-form-item>
<el-button
type="primary"
style="width:100%;"
:loading="loading"
@click.native.prevent="handleLogin"
>登录</el-button>
</el-form-item>
<div class="login-btn">
<button class="btn" @click="handleLogin">登录</button>
</div>
<div class="tips">
<span style="margin-right:20px;">用户名: admin</span>
<span>密码：随便什么都行</span>
......@@ -136,7 +131,8 @@ $light_gray: #eee;
width: 100%;
top: 0;
left: 0;
background-image: url("https://cn.bing.com/th?id=OHR.ClavijoLandscape_ZH-CN1525245124_1920x1080.jpg&rf=LaDigue_1920x1080.jpg&pid=hp");
background-image: url("https://i.loli.net/2019/10/18/buDT4YS6zUMfHst.jpg");
background-position: center;
/deep/ .el-input {
display: inline-block;
height: 47px;
......@@ -172,6 +168,55 @@ $light_gray: #eee;
width: 520px;
padding: 35px 35px 15px 35px;
margin: 120px auto;
align-items: center;
color: white;
background: rgba(0, 0, 0, 0.8);
border-radius: 10px;
box-shadow: 0 0.4px 0.6px rgba(0, 0, 0, 0.141),
0 1px 1.3px rgba(0, 0, 0, 0.202), 0 1.9px 2.5px rgba(0, 0, 0, 0.25),
0 3.4px 4.5px rgba(0, 0, 0, 0.298), 0 6.3px 8.4px rgba(0, 0, 0, 0.359),
0 15px 20px rgba(0, 0, 0, 0.5);
.login-btn {
.btn {
position: relative;
width: 100%;
padding: 6px 0;
margin: 10px 0 36px 0;
font-size: 1.2em;
color: white;
background: transparent;
border: 2px solid hsla(204, 70%, 53%, 1);
outline: none;
cursor: pointer;
overflow: hidden;
transition: 0.5s;
&::before {
position: absolute;
content: "";
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(
120deg,
transparent,
hsla(204, 70%, 53%, 0.5),
transparent
);
transform: translateX(-100%);
transition: 0.5s;
}
&:hover {
box-shadow: 0 0 20px 10px hsla(204, 70%, 53%, 0.5);
}
&:hover::before {
transform: translateX(100%);
}
}
}
}
.tips {
font-size: 14px;
......