Cleanup page-header, more accessible and responsive.

This commit is contained in:
opi 2014-02-11 14:06:00 +01:00
parent dee5de67fc
commit a22fb84d28
5 changed files with 23 additions and 15 deletions

View file

@ -62,10 +62,17 @@ body .form-control {
margin: -35px auto 0 auto; margin: -35px auto 0 auto;
} }
body .page-header { .page-header {
margin-top: 0px; margin-top: 0px;
padding: 0 10px; padding: 0 10px;
} }
.page-header h1,
.page-header .logout-button {
margin-top:20px;
}
.page-header h1 {max-width: 85%; /* leave space for logout button */}
.logout-button {font-size:2em;}
div.br { div.br {
height: 30px; height: 30px;

View file

@ -13,14 +13,15 @@
</head> </head>
<body> <body>
<div id="slider"> <div id="slider">
<div class="page-header hidden-xs"> <div class="page-header clearfix hidden-xs">
<a href="#/logout" class="pull-right logout-button">
<span class="glyphicon glyphicon-log-out"></span><span class="text-hide">Logout</span>
</a>
<h1 class="pull-left">YunoHost <small>Administration</small></h1> <h1 class="pull-left">YunoHost <small>Administration</small></h1>
<a id="logout-button" href="#/logout" class="pull-right" style="padding-top: 29px; padding-right: 5px; font-size: 24px;"><span class="glyphicon glyphicon-log-out"></span></a>
<div class="clearfix"></div>
<br />
</div>
<div id="flash" style="display: none">
</div> </div>
<div id="flash" style="display: none"></div>
<div id="slider-container"> <div id="slider-container">
<div id="slideBack" class="block" style="display: none;"></div> <div id="slideBack" class="block" style="display: none;"></div>
<div id="main" class="block"> <div id="main" class="block">
@ -29,6 +30,7 @@
<div id="slideTo" class="block" style="display: none; z-index: 100;"></div> <div id="slideTo" class="block" style="display: none; z-index: 100;"></div>
<div class="clearfix"></div> <div class="clearfix"></div>
</div> </div>
</div> </div>
<div id="popup" class="modal fade"> <div id="popup" class="modal fade">

View file

@ -247,7 +247,7 @@ app = Sammy('#main', function (sam) {
}); });
sam.get('#/login', function (c) { sam.get('#/login', function (c) {
$('#logout-button').hide(); $('.logout-button').hide();
store.set('path-1', '#/login'); store.set('path-1', '#/login');
// Check if te client is hosted on a yunohost node // Check if te client is hosted on a yunohost node
@ -278,7 +278,7 @@ app = Sammy('#main', function (sam) {
if (data.apiVersion) { if (data.apiVersion) {
c.api('/users', function(data) { c.api('/users', function(data) {
store.set('connected', true); store.set('connected', true);
$('#logout-button').fadeIn(); $('.logout-button').fadeIn();
c.flash('success', 'Logged in'); c.flash('success', 'Logged in');
if (store.get('path')) { if (store.get('path')) {
c.redirect(store.get('path')); c.redirect(store.get('path'));

View file

@ -1,7 +1,8 @@
<div class="page-header visible-xs"> <div class="page-header clearfix visible-xs">
<a href="#/logout" class="pull-right logout-button">
<span class="glyphicon glyphicon-log-out"></span><span class="text-hide">Logout</span>
</a>
<h1 class="pull-left">YunoHost <small>Administration</small></h1> <h1 class="pull-left">YunoHost <small>Administration</small></h1>
<div class="clearfix"></div>
<br />
</div> </div>
<div class="list-group"> <div class="list-group">

View file

@ -1,7 +1,5 @@
<div class="page-header visible-xs"> <div class="page-header clearfix visible-xs">
<h1 class="pull-left">YunoHost <small>Administration</small></h1> <h1 class="pull-left">YunoHost <small>Administration</small></h1>
<div class="clearfix"></div>
<br />
</div> </div>
<form action="#/login" id="form" method="post"> <form action="#/login" id="form" method="post">