mirror of https://github.com/jumpserver/jumpserver
perf: login style change (#13539)
* perf: login style change * perf: login style change * perf: login style change --------- Co-authored-by: zhaojisen <1301338853@qq.com>pull/13661/head
parent
ba8d3be9a6
commit
afe7f03c16
|
@ -69,16 +69,21 @@
|
|||
}
|
||||
|
||||
.login-content {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
height: 500px;
|
||||
width: 1000px;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
margin-top: calc((100vh - 470px) / 3);
|
||||
}
|
||||
|
||||
|
||||
body {
|
||||
position: relative;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
background-color: #f3f3f3;
|
||||
height: calc(100vh - (100vh - 470px) / 3);
|
||||
{#height: calc(100vh - (100vh - 470px) / 3);#}
|
||||
}
|
||||
|
||||
.captcha {
|
||||
|
@ -99,6 +104,27 @@
|
|||
border-right: 1px solid #EFF0F1;
|
||||
}
|
||||
|
||||
.left-form-box .form-panel {
|
||||
position: relative;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.left-form-box .form-panel {
|
||||
position: relative;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.left-form-box .form-panel .form-mobile {
|
||||
padding: 15px 60px;
|
||||
text-align: left
|
||||
}
|
||||
|
||||
.left-form-box .form-panel .form-mobile h2 {
|
||||
display: inline
|
||||
}
|
||||
|
||||
.red-fonts {
|
||||
color: red;
|
||||
}
|
||||
|
@ -112,11 +138,11 @@
|
|||
}
|
||||
|
||||
.jms-title {
|
||||
padding: 22px 10px 10px;
|
||||
{#padding: 22px 10px 10px;#}
|
||||
}
|
||||
|
||||
.more-login-items {
|
||||
margin-top: 10px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.more-login-item {
|
||||
|
@ -153,6 +179,9 @@
|
|||
}
|
||||
|
||||
.jms-title {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
color: #151515;
|
||||
|
@ -252,7 +281,7 @@
|
|||
|
||||
.mobile-logo {
|
||||
display: block;
|
||||
padding: 0 30px;
|
||||
padding: 0 45px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
|
@ -260,6 +289,15 @@
|
|||
height: revert;
|
||||
width: revert;
|
||||
}
|
||||
|
||||
.left-form-box .form-panel {
|
||||
transform: translateY(-65%);
|
||||
}
|
||||
|
||||
.left-form-box .form-panel .form-mobile h2 {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
@ -279,14 +317,15 @@
|
|||
</a>
|
||||
</div>
|
||||
<div class="left-form-box {% if not form.challenge and not form.captcha %} no-captcha-challenge {% endif %}">
|
||||
<div class="mobile-logo">
|
||||
<div class="mobile-logo" style="padding-bottom: 45px; box-sizing: border-box">
|
||||
<div class="jms-title">
|
||||
<span style="">{{ INTERFACE.login_title }}</span>
|
||||
<img style="width: 60px; height: 60px" src="{{ INTERFACE.logo_logout }}" alt="Logo"/>
|
||||
<span style="padding-left: 10px">{{ INTERFACE.login_title }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div style="position: relative;top: 50%;transform: translateY(-50%);">
|
||||
<div style='padding: 15px 60px; text-align: left'>
|
||||
<h2 style='font-weight: 400;display: inline'>
|
||||
<div class="form-panel">
|
||||
<div class="form-mobile">
|
||||
<h2 style='font-weight: 400;'>
|
||||
{% trans 'Login' %}
|
||||
</h2>
|
||||
<ul class=" nav navbar-top-links navbar-right">
|
||||
|
|
Binary file not shown.
Before Width: | Height: | Size: 3.6 KiB |
|
@ -19,12 +19,19 @@
|
|||
|
||||
.markdown-footer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
width: 285px;
|
||||
transform: translate(-50%, -50%);
|
||||
@media (min-width: 768px) {
|
||||
top: 97%;
|
||||
}
|
||||
}
|
||||
|
||||
.markdown-footer p {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
<div id="markdown-output" class="markdown-footer"></div>
|
||||
{% endif %}
|
||||
|
|
Loading…
Reference in New Issue