登录页修改

This commit is contained in:
cwchen 2025-10-17 10:10:48 +08:00
parent 7d1edd7639
commit 812ca2cd31
1 changed files with 25 additions and 20 deletions

View File

@ -1,14 +1,14 @@
<template> <template>
<div class="login"> <div class="login">
<div class="login-container"> <div class="login-container">
<div class="login-header">
<h1 class="main-title">
<img src="../assets/logo/logo.png" alt="logo" class="logo"/>
<span>智能投标系统</span>
</h1>
<h2 class="sub-title">欢迎登录 welcome to login in</h2>
</div>
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form"> <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
<div class="login-header">
<h1 class="main-title">
<img src="../assets/logo/logo.png" alt="logo" class="logo"/>
<span>智能投标系统</span>
</h1>
<h2 class="sub-title">欢迎登录 <span style="color: #666;font-size: 15px;">welcome to login in</span></h2>
</div>
<el-form-item prop="username"> <el-form-item prop="username">
<el-input <el-input
v-model="loginForm.username" v-model="loginForm.username"
@ -47,7 +47,6 @@
</el-form-item> </el-form-item>
<div class="form-options"> <div class="form-options">
<el-checkbox v-model="loginForm.rememberMe">记住密码</el-checkbox> <el-checkbox v-model="loginForm.rememberMe">记住密码</el-checkbox>
<a href="#" class="forgot-password">忘记密码</a>
</div> </div>
<el-form-item style="width:100%;"> <el-form-item style="width:100%;">
<el-button <el-button
@ -169,7 +168,7 @@ export default {
<style rel="stylesheet/scss" lang="scss"> <style rel="stylesheet/scss" lang="scss">
.login { .login {
display: flex; display: flex;
justify-content: center; justify-content: flex-end;
align-items: center; align-items: center;
height: 100vh; height: 100vh;
background: #fff; background: #fff;
@ -178,6 +177,7 @@ export default {
background-position: center center; background-position: center center;
// background-size: contain; // background-size: contain;
position: relative; position: relative;
padding-right: 15%;
&::before { &::before {
content: ''; content: '';
@ -199,20 +199,23 @@ export default {
.login-header { .login-header {
text-align: center; text-align: center;
margin-bottom: 40px; margin-bottom: 30px;
.main-title { .main-title {
font-size: 32px; font-size: 28px;
font-weight: 700; font-weight: 600;
color: #060F2E; color: #1E6BFF;
margin-bottom: 12px; margin-bottom: 8px;
letter-spacing: 1px; display: flex;
align-items: center;
justify-content: center;
gap: 10px;
} }
.sub-title { .sub-title {
font-size: 18px; font-size: 24px;
color: #666; color: #333333;
font-weight: 500; font-weight: bold;
margin: 0; margin: 0;
} }
} }
@ -370,7 +373,9 @@ export default {
// //
@media (max-width: 768px) { @media (max-width: 768px) {
.login { .login {
justify-content: center;
padding: 20px; padding: 20px;
padding-right: 20px;
} }
.login-container { .login-container {
@ -387,7 +392,7 @@ export default {
} }
.sub-title { .sub-title {
font-size: 16px; font-size: 20px;
} }
} }
} }
@ -403,7 +408,7 @@ export default {
} }
.sub-title { .sub-title {
font-size: 15px; font-size: 18px;
} }
} }
} }