Fixes header. Mobile support

This commit is contained in:
Gustavo Cortez 2014-04-29 14:24:26 -03:00
parent b13287870f
commit 50ebb2757b
3 changed files with 24 additions and 9 deletions

View File

@ -29,6 +29,13 @@ html, body {height: 100%;}
height: 51px;
}
@media (max-width: 640px) {
.logo {
margin: 0 auto;
margin-bottom: 10px;
}
}
.top-bar-section li:not(.has-form) a:not(.button) {
line-height: 60px;
}
@ -60,6 +67,7 @@ html, body {height: 100%;}
.header a.button.small-icon {
padding: 0.1rem 0.3rem;
font-size: 0.9rem;
margin-left: 5px;
}
.header h1, h5, p {
@ -237,6 +245,7 @@ hr { margin: 2.25rem 0;}
.m10h {margin:0 10px;}
.m30a {margin: 30px auto;}
.br100 {border-radius: 100%;}
.oh {overflow:hidden;}
.signin input.ng-dirty.ng-invalid {
border: 2px red solid;

View File

@ -87,6 +87,10 @@ body {
color: #fff;
}
.header-content a {
color: #fff;
}
.panel {
color: #333;
background: #FFFFFF;

View File

@ -14,19 +14,21 @@
<div data-ng-init="init()" data-ng-controller="HeaderController">
<div class="header">
<div class="header-content">
<div class="large-2 columns">
<div class="large-3 medium-3 columns">
<span class="logo"></span>
</div>
<div class="text-center large-10 columns p10t" ng-show="$root.wallet">
<h6 class="large-5 columns line-dashed-v">
<span ng-if="!$root.wallet.name && $root.wallet.id">{{$root.wallet.id}}</span>
<span ng-if="$root.wallet.name">Wallet: {{$root.wallet.name}} &lt;{{$root.wallet.id}}&gt;</span>
<a class="button radius small-icon" href="#" ng-click="signout()"><i class="fi-power"></i></a>
</h6>
<div class="large-3 columns line-dashed-v">
<div class="large-9 medium-9 columns text-center p10t" ng-show="$root.wallet">
<div class="large-4 medium-4 columns line-dashed-v">
<a href="#/peer" class="has-tip" tooltip-placement="bottom" tooltip="{{$root.wallet.id}}">
<span ng-if="!$root.wallet.name && $root.wallet.id">{{$root.wallet.id}}</span>
<span ng-if="$root.wallet.name">{{$root.wallet.name}}</span>
</a>
<a class="button radius small-icon" href="#" title="Signout" ng-click="signout()"><i class="fi-power"></i></a>
</div>
<div class="large-4 medium-4 columns line-dashed-v">
Balance: {{totalBalance || 0}} <i class="fi-bitcoin"></i><br>
</div>
<div class="large-4 columns">
<div class="large-4 medium-4 columns">
Available to Spend: {{availableBalance || 0}} <i class="fi-bitcoin"></i>
</div>
</div>