Merge pull request #8140 from owncloud/login-valign

Vertically align public layout to better fit small mobile screens
This commit is contained in:
Jan-Christoph Borchardt 2014-05-15 15:06:52 +02:00
commit 60efa0f1c8
2 changed files with 28 additions and 6 deletions

View File

@ -1,5 +1,26 @@
@media only screen and (max-width: 768px) {
#body-login #header {
padding-top: 10px;
}
#body-login .wrapper {
display: -webkit-box;
-webkit-box-orient: horizontal;
-webkit-box-pack: center;
-webkit-box-align: center;
display: -moz-box;
-moz-box-orient: horizontal;
-moz-box-pack: center;
-moz-box-align: center;
display: box;
box-orient: horizontal;
box-pack: center;
box-align: center;
}
/* show caret indicator next to logo to make clear it is tappable */
#owncloud.menutoggle {
background-image: url('../img/actions/caret.svg');

View File

@ -35,14 +35,15 @@
<?php flush(); ?>
<body id="body-login">
<div class="wrapper"><!-- for sticky footer -->
<header><div id="header">
<div class="logo svg"></div>
<div id="logo-claim" style="display:none;"><?php p($theme->getLogoClaim()); ?></div>
</div></header>
<?php print_unescaped($_['content']); ?>
<div class="v-align"><!-- vertically centred box -->
<header><div id="header">
<div class="logo svg"></div>
<div id="logo-claim" style="display:none;"><?php p($theme->getLogoClaim()); ?></div>
</div></header>
<?php print_unescaped($_['content']); ?>
<div class="push"></div><!-- for sticky footer -->
</div>
</div>
<footer>