Browse Source

style: 登录页面

Gaokun Wang 1 month ago
parent
commit
bf6d2ed7e1
2 changed files with 24 additions and 57 deletions
  1. 22 53
      src/views/login/index.scss
  2. 2 4
      src/views/login/index.vue

+ 22 - 53
src/views/login/index.scss

@@ -1,59 +1,28 @@
 .login-container {
   height: 100%;
-  min-height: 550px;
-  background-color: #eeeeee;
-  background-image: url('@/assets/images/bg.png');
-  background-size: cover;
-  .login-box {
-    .login-left {
-      width: 800px;
-      margin-right: 10px;
-      .login-left-img {
-        width: 100%;
-        height: 100%;
-      }
-    }
-    .login-form {
-      width: 420px;
-      padding: 50px 40px 45px;
-      background-color: var(--el-bg-color);
-      border-radius: 10px;
-      box-shadow: rgb(0 0 0 / 10%) 0 2px 10px 2px;
-      .login-logo {
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        .logo-text {
-          padding: 0 0 0 25px;
-          margin: 0;
-          font-size: 42px;
-          font-weight: bold;
-          color: #34495e;
-          white-space: nowrap;
-        }
-      }
-      .login-btn {
-        display: flex;
-        align-items: center;
-        width: 100%;
-        margin-top: 40px;
-        white-space: nowrap;
-        .el-button {
-          width: 185px;
-        }
-      }
-    }
+  .logo-text {
+    margin: 0;
+    font-size: 42px;
+    font-weight: bold;
+    color: #34495e;
+    white-space: nowrap;
+    text-align: center;
+    margin-bottom: 40px;
   }
-}
-
-@media screen and (width <= 1250px) {
-  .login-left {
-    display: none;
-  }
-}
-
-@media screen and (width <= 600px) {
   .login-form {
-    width: 97% !important;
+    width: 420px;
+    padding: 20px;
+    border-radius: 10px;
+    box-shadow: rgb(0 0 0 / 10%) 0 2px 10px 2px;
+    .login-btn {
+      display: flex;
+      align-items: center;
+      width: 100%;
+      margin-top: 40px;
+      white-space: nowrap;
+      .el-button {
+        width: 185px;
+      }
+    }
   }
 }

+ 2 - 4
src/views/login/index.vue

@@ -1,10 +1,8 @@
 <template>
   <div class="login-container flx-center">
-    <div class="login-box">
+    <div>
+      <h2 class="logo-text">ECO-BOOT-WEB</h2>
       <div class="login-form">
-        <div class="login-logo">
-          <h2 class="logo-text">ECO-BOOT-WEB</h2>
-        </div>
         <el-form ref="loginFormRef" :model="loginForm" :rules="loginRules" size="large" label-position="top">
           <el-form-item prop="account" label="账号">
             <el-input v-model="loginForm.account" placeholder="账号: superadmin"> </el-input>