Merge pull request #8140 from owncloud/login-valign
Vertically align public layout to better fit small mobile screens
This commit is contained in:
commit
60efa0f1c8
|
@ -1,5 +1,26 @@
|
||||||
@media only screen and (max-width: 768px) {
|
@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 */
|
/* show caret indicator next to logo to make clear it is tappable */
|
||||||
#owncloud.menutoggle {
|
#owncloud.menutoggle {
|
||||||
background-image: url('../img/actions/caret.svg');
|
background-image: url('../img/actions/caret.svg');
|
||||||
|
|
|
@ -35,14 +35,15 @@
|
||||||
<?php flush(); ?>
|
<?php flush(); ?>
|
||||||
<body id="body-login">
|
<body id="body-login">
|
||||||
<div class="wrapper"><!-- for sticky footer -->
|
<div class="wrapper"><!-- for sticky footer -->
|
||||||
<header><div id="header">
|
<div class="v-align"><!-- vertically centred box -->
|
||||||
<div class="logo svg"></div>
|
<header><div id="header">
|
||||||
<div id="logo-claim" style="display:none;"><?php p($theme->getLogoClaim()); ?></div>
|
<div class="logo svg"></div>
|
||||||
</div></header>
|
<div id="logo-claim" style="display:none;"><?php p($theme->getLogoClaim()); ?></div>
|
||||||
|
</div></header>
|
||||||
<?php print_unescaped($_['content']); ?>
|
|
||||||
|
|
||||||
|
<?php print_unescaped($_['content']); ?>
|
||||||
<div class="push"></div><!-- for sticky footer -->
|
<div class="push"></div><!-- for sticky footer -->
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
|
|
Loading…
Reference in New Issue