123

src/views/login/css/index.css

@@ -1,7 +1,8 @@
 html {
     font-size: 16px !important;
 }
- /* iPhone6的375px尺寸作为16px基准，414px正好18px大小,600 20px */
+
+/* iPhone6的375px尺寸作为16px基准，414px正好18px大小,600 20px */
 /* @media screen and (min-width:375px) {
     html {
         font-size: calc(100% + 2 * (100vw - 375px) / 39);
@@ -43,29 +44,44 @@ html {
     margin: 0;
     width: 100vw;
     height: 100vh;
-    background-size: calc(100vw - 25.5rem) 100%;
-    background-repeat: no-repeat;
-    background-position: right;
-    background-origin: border-box;
-    background-attachment: fixed;
+    /* background-size: calc(100vw - 25.5rem) 100%; */
+    /* background-repeat: no-repeat; */
+    /* background-position: right; */
+    /* background-origin: border-box; */
+    /* background-attachment: fixed; */
     animation: start .5s;
     overflow: auto;
-    background-image: url('../../../assets/img/login/bg@2x.png') !important;
+    /* background-image: url('../../../assets/img/login/bg@2x.png') !important; */
+    background: linear-gradient(to right, #D3DFFB, #FFFFFF, #F0FBFE);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.newlogin_container_tb img {
+    width: 554px;
+    height: 554px;
+    margin-right: 234px;
 }
 
 .newlogin_login_container {
-    height: 100%;
-    width: 100%;
-    padding: 5.7rem 0 0 5.7rem;
+    /* height: 100%;
+    width: 100%; */
+    /* padding: 5.7rem 0 0 5.7rem; */
     animation: move 1s;
     /* animation-delay:1s;
     -webkit-animation-delay:1s;  */
+    box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.1);
+    border-radius: 8px 8px 8px 8px;
+    opacity: 1;
+    padding: 52px 80px 94px 80px;
+    /* width: 460px; */
 
 }
 
 .newlogin_login_logo {
-    width: 10.8rem;
-    height: 3.672rem;
+    width: 147px;
+    height: 46px;
 }
 
 .newlogin_login_logo img {
@@ -74,7 +90,7 @@ html {
 }
 
 .newlogin_login_title {
-    color: #1767F9;
+    color: #000000;
     font-size: 1.45rem;
     margin-top: 2rem;
 }
@@ -85,14 +101,14 @@ html {
 }
 
 .newlogin_container .el-input {
-    box-shadow: 0px 0px 6px 0px rgba(7, 0, 2, 0.2) !important;
-    border-radius: 36px;
+    /* box-shadow: 0px 0px 6px 0px rgba(7, 0, 2, 0.2) !important; */
+    /* border-radius: 36px; */
 }
 
- .newlogin_container .el-input__inner {
+.newlogin_container .el-input__inner {
     border: 0px !important;
     padding-left: 50px !important;
-    border-radius: 36px;
+    /* border-radius: 36px; */
     height: 2.6rem !important;
     font-size: .8rem !important;
     padding-right: 50px !important;
@@ -100,7 +116,7 @@ html {
 }
 
 .newlogin_container .el-form-item__content .el-input {
-    box-shadow: 0px 0px 6px 0px rgba(7, 0, 2, 0.2) !important;
+    /* box-shadow: 0px 0px 6px 0px rgba(7, 0, 2, 0.2) !important; */
 
 }
 
@@ -112,8 +128,9 @@ html {
 
 .newlogin_login_from_butten {
     width: 100%;
-    border-radius: 36px;
-    font-size: 1.16rem;
+    /* border-radius: 36px; */
+    font-size: 14px;
+    background-color: #409EFF !important;
 }
 
 .newlogin_container .el-form-item {
@@ -133,12 +150,14 @@ html {
 }
 
 .newlogin_container .el-button--primary {
-    background: linear-gradient(to right, #1767F9, #4883ED);
+    background-color: #409EFF !important;
+
 }
 
 .newlogin_container .el-button--primary:hover,
 .newlogin_container .el-button--primary:focus {
-    background: linear-gradient(to right, #1767F9, #4883ED);
+    background-color: #409EFF !important;
+
 
 }
 
@@ -166,7 +185,7 @@ html {
     padding-left: 20px;
     font-size: 0.8rem;
     color: #1767F9;
-    cursor:default
+    cursor: default
 }
 
 .verifyCode .el-input__inner {

src/views/login/index.vue

@@ -1,10 +1,13 @@
 <template>
     <div v-loading="this.$store.getters.loading" class="newlogin_container">
+        <div class="newlogin_container_tb">
+            <img style="" src="../../assets/img/login/img.png" alt="" />
+        </div>
         <div class="newlogin_login_container">
             <div class="newlogin_login_logo">
                 <img style="" src="../../assets/img/login/logo.png" alt="" />
             </div>
-            <div class="newlogin_login_title">星油能源调度管理平台</div>
+            <div class="newlogin_login_title">欢迎使用中品调度管理平台</div>
             <div class="newlogin_login_from_container">
                 <el-form ref="form" :model="loginForm">
                     <el-form-item>