diff --git a/src/assets/styles/login.scss b/src/assets/styles/login.scss index 796930e8..6196c4d8 100644 --- a/src/assets/styles/login.scss +++ b/src/assets/styles/login.scss @@ -103,13 +103,13 @@ $buttonHeight: $buttonH * 1px; background-position: 0 0; position: relative; - &::after { - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - } + &::after { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + } } .field { // background: #ccc3; @@ -304,17 +304,30 @@ $buttonHeight: $buttonH * 1px; // - - - - - PC 最小尺寸设置 @media screen and (min-width: 599px) and (max-width: 1366px) { .container { + min-width: 599px; .content { - width: 710px; - height: 397px; + // width: 710px; + // height: 397px; + width: 100%; + height: 100%; .pic { - width: 314px; + // width: 314px; + display: none; } .field { - width: calc(710px - 314px); - left: 314px; + // width: calc(710px - 314px); + // left: 314px; + // justify-content: center; + width: 100%; + + .pc-title { + h3 { + font-size: 2.4rem !important; + } + } + .form { - width: 320px; + // width: 320px; :deep(.el-input__inner) { width: 320px; height: 56px; @@ -357,13 +370,17 @@ $iconBgImage: '../assets/images/icon.png'; min-width: 280px; min-height: 568px; // 文字 - font-size: 17px; + font-size: 14px; font-family: PingFang SC; font-weight: bold; .logo { display: none; } + .pc-title { + display: none; + } + .content { // 元素 width: $mobileContentWidth; @@ -378,6 +395,7 @@ $iconBgImage: '../assets/images/icon.png'; display: none; } .field { + padding: 0; // 元素 width: inherit; min-height: inherit; @@ -385,12 +403,15 @@ $iconBgImage: '../assets/images/icon.png'; left: 0; display: flex; flex-direction: column; + .mobile-title { // 元素 - margin: 0 0 20px; + margin: 0; display: block; } + .form { + margin: 0; width: $mobileFormWidth; // - - - tab :deep(.el-tabs__header) { @@ -419,6 +440,24 @@ $iconBgImage: '../assets/images/icon.png'; color: #ffffff; } } + + .login-form { + :deep(.el-input__inner) { + height: $mobileRowHeight; + line-height: 24px; + // 文字 + text-align: center; + color: #262626; + } + + :deep(#button-form-item) { + margin: 0 !important; + button { + // 元素 + height: $mobileRowHeight; + } + } + } .mobile-switch { display: block; line-height: 20px; @@ -439,6 +478,7 @@ $iconBgImage: '../assets/images/icon.png'; } } } + .footer { // 元素 font-size: 12px; @@ -448,8 +488,8 @@ $iconBgImage: '../assets/images/icon.png'; color: #333333; opacity: 0.6; // 定位 - position: absolute; - bottom: 20px; + // position: absolute; + bottom: -32px; } } } diff --git a/src/views/login.vue b/src/views/login.vue index 2357b7c0..ae2ff139 100644 --- a/src/views/login.vue +++ b/src/views/login.vue @@ -55,7 +55,7 @@ style=" user-select: none; position: absolute; - top: 20%; + top: 28%; width: 100%; height: 70%; "> @@ -219,7 +219,7 @@ - +