Parcourir la source

登录界面样式修改

marymelisa il y a 4 ans
Parent
commit
ca01921930
1 fichiers modifiés avec 26 ajouts et 6 suppressions
  1. 26 6
      src/views/account/login.vue

+ 26 - 6
src/views/account/login.vue

@@ -24,7 +24,7 @@
                 </template>
               </a-input>
             </a-form-item>
-            <a-form-item name="password">
+            <a-form-item name="password" class="mb20">
               <a-input @keyup.enter="loginAction"
                        placeholder="请输入您的登录密码"
                        type="password"
@@ -51,7 +51,7 @@
                 <router-link to="/resetPassword">《用户协议》</router-link>
               </div>
             </a-form-item> -->
-            <a-form-item>
+            <a-form-item class="mt20">
               <a-button @click="loginAction"
                         :loading="loading"
                         :disabled="goHomeloading">登录</a-button>
@@ -224,8 +224,9 @@ export default defineComponent({
     .flex();
 }
 .login-background {
-    width: 324px;
+    width: 275px;
     background: url('../../assets/images/logoBackground.png') no-repeat scroll 0 0;
+    background-size: cover;
     div {
         margin-top: 120px;
         margin-left: 55px;
@@ -255,13 +256,27 @@ export default defineComponent({
 }
 .login-content {
     flex: 1;
-    margin-left: 20px;
-    margin-right: 80px;
+    padding-left: 53px;
+    padding-right: 53px;
+    min-width: 405px;
     ::v-deep(.ant-form) {
         margin-top: 20px;
         .ant-form-item-control-wrapper {
             width: 100%;
         }
+        .ant-form-item-control.has-error {
+            .ant-form-item-children {
+                .ant-input-affix-wrapper {
+                    .ant-input {
+                        background: transparent !important;
+                    }
+                }
+            }
+            .ant-form-explain {
+                text-align: left;
+                padding-left: 24px;
+            }
+        }
         .ant-input {
             border: 0;
             border-radius: 0;
@@ -281,7 +296,12 @@ export default defineComponent({
             border-bottom: 1px solid @m-blue1;
         }
     }
-
+    .mt20 {
+        margin-top: 20px;
+    }
+    .mb20 {
+        margin-bottom: 20px;
+    }
     .ant-form-item,
     .ant-form label {
         font-size: 16px;