更改登录页

src/views/choujiang/Login.vue

@@ -46,7 +46,7 @@ const handleLogin = () => {
   </script>
 <style scoped>
 .login-container {
-  background-image: url('../../assets/loginback.png'); /* 确保路径正确 */
+  background-image: url('../../assets/登录背景.png'); /* 确保路径正确 */
   background-position: center;
   background-size: cover;
   height: 100vh; /* 确保背景图片覆盖整个视口高度 */
@@ -59,13 +59,13 @@ const handleLogin = () => {
 
 .login-card {
     position: absolute;
-    top: 50%;
+    top: 55%;
     left: 50%;
     transform: translate(-50%, -50%);
-    width: 300px; /* 设置固定宽度 */
-    height: 200px; /* 设置固定高度 */
-    padding: 2rem;
-    background: rgba(255, 255, 255, 0.8); /* 调整背景颜色为半透明白色 */
+     width: 450px; /* 增加卡片宽度 */
+height: 285px;
+    padding: 2.5rem; /* 增加内边距 */
+    background: rgba(255, 255, 255, 0.3); /* 调整背景颜色为半透明白色 */
     border-radius: 8px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
     box-sizing: border-box;
@@ -74,28 +74,28 @@ const handleLogin = () => {
 
 input {
     width: 100%;
-    padding: 0.8rem;
+    padding: 1.2rem; 
     border: 1px solid #ddd;
     border-radius: 4px;
-    font-size: 1rem;
-    margin-bottom: 2rem;
+       font-size: 1.3rem; /* 增大字体大小 */
+    margin-bottom: 2.5rem; /* 增加底部间距 */
     box-sizing: border-box
 }
 
 .login-button {
     width: 100%;
-    padding: 0.8rem;
-    background-color: #42b983;
+        padding: 1.2rem; /* 增加按钮内边距 */
+    background-color: #e92821a3;
     color: white;
     border: none;
     border-radius: 4px;
-    font-size: 1rem;
+    font-size: 1.3rem; /* 增大字体大小 */
     cursor: pointer;
     transition: background-color 0.3s;
     box-sizing: border-box
 }
 
 .login-button:hover {
-    background-color: #359469;
+   transform: scale(1.03);
 }
 </style>