修改登录页面

frontend/src/renderer/src/views/Detection - 副本.vue

@@ -2579,9 +2579,6 @@ function refreshClick(type) {
   padding: 12px 20px !important;
 }
 
-.el-card__body {
-  padding: 20px !important;
-}
 
 .el-button--primary:hover {
   --el-button-bg-color: #A325B0 !important;

frontend/src/renderer/src/views/Login.vue

@@ -5,11 +5,12 @@
     <div class="login-content">
       <!-- 系统标题 -->
       <div style="margin-right: 150px;">
+        <h1 class="system-login-title">欢迎登录</h1>
         <h1 class="system-title">平衡体态检测系统</h1>
 
         <!-- 登录页面 -->
         <el-card v-if="!isRegisterMode && !isForgotPasswordMode" class="login-card">
-          <div class="card-header">欢迎登录</div>
+         
           
           <el-form class="login-form">
             <!-- 账号输入框 -->
@@ -51,7 +52,7 @@
 
             <!-- 记住密码 & 忘记密码 -->
             <div class="form-footer">
-              <el-checkbox v-model="form.remember" class="remember-checkbox" @change="handleRememberChange">记住账号及密码</el-checkbox>
+              <el-checkbox v-model="form.remember" class="remember-checkbox" @change="handleRememberChange">记住密码</el-checkbox>
               <a href="#" class="forgot-link" @click="handleForgotPassword">忘记密码？</a>
             </div>
 
@@ -222,7 +223,7 @@ import { ElMessage } from 'element-plus'
 import { useAuthStore } from '../stores'
 import { User, Lock, View, Hide, Phone } from '@element-plus/icons-vue'
 
-import bg from '@/assets/new/newbg.jpg'
+import bg from '@/assets/bg.jpg'
 import { getBackendUrl,systemAPI } from '../services/api.js'
 // import Model from './model.vue'
 const BACKEND_URL = getBackendUrl()
@@ -623,6 +624,7 @@ const copyPassword = async () => {
   width: 100vw;
   height: 100vh;
   background-color: #000;
+  background-size:100% 100% ;
   overflow: hidden;
 }
 
@@ -680,27 +682,25 @@ const copyPassword = async () => {
 
 /* 系统标题 */
 .system-title {
-  text-align: center;
+  font-family: 'Noto Sans SC Bold', 'Noto Sans SC Regular', 'Noto Sans SC';
-  font-family: 'Noto Sans SC';
   font-weight: 700;
   font-style: normal;
-  font-size: 40px;
+  font-size: 48px;
-  color: rgb(255, 255, 255);
+  color: #14AAFF;
-  margin-bottom: 30px;
+  padding-top: 15px;
-  letter-spacing: 2px;
+  padding-bottom: 40px;
 }
 
 /* 登录卡片 */
 .login-card {
-  width: 482px;
+  width: 450px;
-  height: 450px;
+  /* height: 450px; */
-  background-color: #1D1C21;
+  background-color: transparent;
   box-sizing: border-box;
-  border-width: 3px;
+  border-width: 0;
-  border-style: solid;
-  border-color: #1D1C21;
   border-radius: 5px;
-  padding: 40px 25px 0; 
+  box-shadow: 0 0 0px rgba(0, 0, 0, 0);
+  padding: 0px 0px 0; 
 }
 
 /* 注册卡片 */
@@ -730,7 +730,9 @@ const copyPassword = async () => {
 .login-form {
   width: 100%;
 }
-
+:deep(.el-card__body) {
+  padding: 0 !important;
+}
 /* 自定义输入框 */
 /* .custom-input {
   background-color: #004080 !important;
@@ -763,21 +765,15 @@ const copyPassword = async () => {
 }
 
 /* 记住密码复选框 */
-.remember-checkbox {
-  color: #fff !important;
-}
-.remember-checkbox .el-checkbox__input.is-checked .el-checkbox__inner {
-  background-color: #00ffff !important;
-  border-color: #00ffff !important;
-}
-.remember-checkbox .el-checkbox__inner {
-  border-color: #00ffff !important;
-}
 
 /* 忘记密码链接 */
 .forgot-link {
-  color: #ffffff;
   text-decoration: none;
+  font-family: 'Noto Sans SC';
+  font-weight: 400;
+  font-style: normal;
+  font-size: 14px;
+  color: #FFFFFF;
 }
 .forgot-link:hover {
   text-decoration: underline;
@@ -791,18 +787,20 @@ const copyPassword = async () => {
 
 /* 登录按钮 */
 .login-btn {
-  flex: 1;
+  width: 450px;
-  background-color: #266fff !important;
+  height: 60px;
-  border-color: #266fff !important;
+  background: inherit;
-  color: #fff !important;
+  background-color: rgba(11, 148, 213, 1);
-  font-weight: 500 !important;
+  border-color: rgba(11, 148, 213, 1) !important;
-  border-radius: 6px !important;
+  font-family: 'Noto Sans SC';
-  height: 50px;
+  font-weight: 400;
-  font-size: 16px;
+  font-style: normal;
+  font-size: 20px;
+  color: #FFFFFF;
 }
 .login-btn:hover {
-  background-color: #266fff !important;
+  background-color: #14aaff !important;
-  border-color: #266fff !important;
+  border-color: #14aaff !important;
 }
 
 /* 注册按钮 */
@@ -1141,13 +1139,13 @@ const copyPassword = async () => {
 .input-box{
   display: flex;
   align-items: center;
-  width: 100%;
+  width: 450px;
-  height: 49px;
+    height: 60px;
-  background-color: rgba(255, 255, 255, 0);
+  background-color: rgba(255, 255, 255, 0.1);
   box-sizing: border-box;
   border-width: 1px;
   border-style: solid;
-  border-color: rgb(67, 67, 67);
+  border-color: transparent;
   border-radius: 3px;
 }
 </style>
@@ -1173,7 +1171,28 @@ const copyPassword = async () => {
 
 .login-card .el-button{
   padding: 12px 20px !important;
-  height: 50px;
+  height: 60px;
+}
+
+
+.system-login-title{
+  font-family: 'Noto Sans SC Bold', 'Noto Sans SC Regular', 'Noto Sans SC';
+    font-weight: 700;
+    font-style: normal;
+    font-size: 30px;
+    color: #FFFFFF;
+}
+
+.remember-checkbox {
+  color: #fff !important;
+}
+.remember-checkbox .el-checkbox__input.is-checked .el-checkbox__inner {
+  background-color: #0b94d5 !important;
+  border-color: #0b94d5 !important;
+}
+.remember-checkbox .el-checkbox__inner {
+  border-color: #fff !important;
+  background: transparent;
 }
 
 </style>