1Panel-dev/1Panel
1
1
Fork 0
mirror of https://github.com/1Panel-dev/1Panel.git synced 2025-10-12 00:16:37 +08:00
Code Issues Projects Releases Packages Wiki Activity Actions

fix: 登录页面优化适配 (#425)

Browse source
This commit is contained in:
wangdan-fit2cloud 2023-03-27 23:07:32 +08:00 • committed by GitHub
parent b9fbcb0e73
commit e2d39b9ed0
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 18 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

28
frontend/src/views/login/index.vue
View file

@ -1,11 +1,11 @@
<template> <template>
<div> <div>
<div class="login-backgroud" v-if="statusCode == 1"> <div class="login-backgroud" v-if="statusCode == 1">
<div class="login-wrapper" v-if="screenWidth > 1000"> <div class="login-wrapper" v-if="screenWidth > 1110">
<div class="left inline-block">
<div class="login-title"> <div class="login-title">
<span>{{ $t('commons.login.title') }}</span> <span>{{ $t('commons.login.title') }}</span>
</div> </div>
<div class="left inline-block">
<img src="@/assets/images/1panel-login.png" alt="" /> <img src="@/assets/images/1panel-login.png" alt="" />
</div> </div>
<div class="right inline-block"> <div class="right inline-block">
@ -89,10 +89,10 @@ onMounted(() => {
padding-top: 8%; padding-top: 8%;
width: 80%; width: 80%;
margin: 0 auto; margin: 0 auto;
@media only screen and (max-width: 1440px) { // @media only screen and (max-width: 1440px) {
width: 100%; // width: 100%;
padding-top: 6%; // padding-top: 6%;
} // }
.left { .left {
vertical-align: middle; vertical-align: middle;
text-align: right; text-align: right;
@ -100,6 +100,9 @@ onMounted(() => {
img { img {
object-fit: contain; object-fit: contain;
width: 100%; width: 100%;
@media only screen and (min-width: 1440px) {
width: 85%;
}
} }
} }
.right { .right {
@ -109,17 +112,18 @@ onMounted(() => {
} }
.login-title { .login-title {
margin-left: 10%; text-align: right;
margin-right: 10%;
span:first-child { span:first-child {
color: $primary-color; color: $primary-color;
font-size: 40px; font-size: 40px;
font-family: pingFangSC-Regular; font-family: pingFangSC-Regular;
font-weight: 600; font-weight: 600;
@media only screen and (max-width: 1440px) { // @media only screen and (max-width: 1440px) {
margin-left: 0; // margin-left: 0;
// }
} }
} @media only screen and (max-width: 1110px) {
@media only screen and (max-width: 1000px) {
margin-bottom: 20px; margin-bottom: 20px;
font-size: 35px; font-size: 35px;
text-align: center; text-align: center;
@ -137,7 +141,7 @@ onMounted(() => {
@media only screen and (max-width: 1440px) { @media only screen and (max-width: 1440px) {
margin-top: 60px; margin-top: 60px;
} }
@media only screen and (max-width: 1000px) { @media only screen and (max-width: 1110px) {
margin: 60px auto 0; margin: 60px auto 0;
} }
} }