CSS: Fix login layout on very small screens (e.g. iPhone SE)

This commit is contained in:
Florian Strohmaier 2017-11-22 09:13:14 +01:00 committed by Eric Lippmann
parent 61ce6fcc1d
commit fd705bf2de
2 changed files with 20 additions and 11 deletions

View File

@ -16,7 +16,7 @@
.login-wrapper { .login-wrapper {
height: 100%; height: 100%;
max-width: 85em; max-width: 85em;
padding: 0 2em; padding: 0 1em;
margin: 0 auto; margin: 0 auto;
z-index: 2; z-index: 2;
position: relative position: relative
@ -25,7 +25,7 @@
.login-form { .login-form {
position: relative; position: relative;
background: white; background: white;
min-width: 320px; min-width: 288px;
height: 100%; height: 100%;
width: 33%; width: 33%;
box-shadow: 0 0 4em 1em rgba(0, 0, 0, 0.2); box-shadow: 0 0 4em 1em rgba(0, 0, 0, 0.2);
@ -202,9 +202,3 @@
} }
} }
} }
canvas.particles-js-canvas-el {
position: absolute;
top: 0; right: 0; bottom: 0; left: 0;
z-index: 1;
}

View File

@ -78,18 +78,33 @@
width: 100%; width: 100%;
} }
#login {
.form-controls {
margin: .5em;
}
#icinga-logo {
max-width: 12em;
}
.login-wrapper { .login-wrapper {
padding: 0 2em; padding: 0 1em;
}
.login-form { .login-form {
width: 100%; width: 100%;
} }
.login-form-content.centered-content {
max-width: 100%;
}
} }
#social { #social {
width: 100%; width: 100%;
text-align: center; text-align: center;
bottom: 4em; bottom: 3em;
} }
#social > li a i { #social > li a i {