OpenSourceArk/Ghost
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixes login box being off centred on small screens

Browse Source 
Accounted for top offset to keep login container centred. Login container fades in on load.
Tested on a variety of window sizes and appears to be centred on all of them (measured it to make sure).
This commit is contained in:
Matthew Harrison-Jones 2013-06-13 09:38:40 +01:00
parent 94c8c94ad1
commit de09e7d19c
2 changed files with 5 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
core/admin/assets/js/admin-ui-temp.js
View File

@ -23,8 +23,8 @@
$(window).resize(function () {
var loginContainer = $(".js-login-container"),
marginTop = Math.round(($(window).height() / 2) - loginContainer.outerHeight());
loginContainer.css('margin-top', marginTop);
marginTop = Math.floor((loginContainer.parent().height() - loginContainer.height()) / 2) - 15;
loginContainer.css('margin-top', marginTop).fadeIn(400);
});

5
core/admin/assets/sass/layouts/login.scss
View File

@ -19,15 +19,16 @@
}
main {
top: 15px;
top: 15px;
@include breakpoint($mobile) { top: 0; }
}
}//.ghost-login
.login-box {
max-width: 530px;
margin: 240px auto; // TODO: Change this to proper vertical centering with JS
margin: 0 auto;
padding: 0;
display: none;
@include breakpoint(630px) {
max-width: 264px;