BTCPrivate
/
copay
mirror of https://github.com/BTCPrivate/copay.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

side bar

This commit is contained in:
bechi 2014-07-17 15:44:50 -03:00
parent 4469cf1f0a
commit d3747b6f7a
2 changed files with 102 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
css/main.css
View File

@ -75,15 +75,20 @@ body, html{
.sidebar { .sidebar {
position: fixed; position: fixed;
width: 250px; width: 250px;
padding: 15px; padding: 20px;
background-color: #2C3E50; background-color: #2C3E50;
color: #fff; color: #fff;
line-height: 24px;
} }
.sidebar a { .sidebar a {
color: #fff; color: #fff;
} }
.button.small.side-bar {
padding: 0.2rem 0.4rem;
}
.main { .main {
margin-left: 250px; margin-left: 250px;
} }
@ -95,7 +100,7 @@ body, html{
.dn {display: none;} .dn {display: none;}
.pr {position: relative;} .pr {position: relative;}
.m0 {margin: 0;} .m0 {margin: 0;}
.db {display: block;} .db {display: block;}
.size-12 { font-size: 12px; } .size-12 { font-size: 12px; }
.size-14 { font-size: 14px; } .size-14 { font-size: 14px; }
.size-16 { font-size: 16px; } .size-16 { font-size: 16px; }
@ -112,6 +117,7 @@ body, html{
.m10b {margin-bottom: 10px;} .m10b {margin-bottom: 10px;}
.m15b {margin-bottom: 20px;} .m15b {margin-bottom: 20px;}
.m10r {margin-right: 10px;} .m10r {margin-right: 10px;}
.m20r {margin-right: 20px;}
.m10 {margin: 10px;} .m10 {margin: 10px;}
.m15 {margin: 15px;} .m15 {margin: 15px;}
.p10t {padding-top: 10px;} .p10t {padding-top: 10px;}
@ -122,6 +128,7 @@ body, html{
.p20h {padding: 0 20px;} .p20h {padding: 0 20px;}
.m30v {margin: 30px 0;} .m30v {margin: 30px 0;}
.m10h {margin:0 10px;} .m10h {margin:0 10px;}
.m10v {margin:10px 0;}
.m30a {margin: 30px auto;} .m30a {margin: 30px auto;}
.br100 {border-radius: 100%;} .br100 {border-radius: 100%;}
.lh {line-height: 0;} .lh {line-height: 0;}
@ -141,6 +148,11 @@ body, html{
margin: 0.5rem 0 1rem; margin: 0.5rem 0 1rem;
} }
.line-sidebar {
border-top: 1px solid #34495E;
margin: 1.4rem 0;
}
.line-dashed { .line-dashed {
border-top: 1px dashed #ccc; border-top: 1px dashed #ccc;
margin: 1rem 0; margin: 1rem 0;
@ -148,6 +160,23 @@ body, html{
overflow: hidden; overflow: hidden;
} }
.name-wallet {
font-size: 16px;
color: #D4D4D4;
line-height: 16px;
}
.box-livenet {
background: #213140;
padding: 0rem 0.5rem 0.2rem;
color: #7A8C9E;
}
.founds {
font-weight: 100;
color: #7A8C9E;
}
/* Turn Off Number Input Spinners */ /* Turn Off Number Input Spinners */
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button { input[type=number]::-webkit-outer-spin-button {
@ -468,4 +497,26 @@ button[disabled].warning:focus,
.text-gray { color: #999 !important;} .text-gray { color: #999 !important;}
.side-nav li {
font-size: 16px;
line-height: 40px;
}
.side-nav li a {
color: #FFFFFF !important;
font-weight: 100;
}
.side-nav li.active a {
background-color: #1ABC9C;
}
.side-nav li:hover a {
background-color: #3C4E60;
}
/*-----------------------------------------------------------------*/ /*-----------------------------------------------------------------*/

101
views/includes/sidebar.html
View File

@ -1,61 +1,58 @@
<div ng-controller="SidebarController"> <div ng-controller="SidebarController">
<span class="logo"></span> <header class="text-center">
Copay <small>v{{version}}</small> <a href="/" class="db">
<small> <img src="../img/logo-negative-beta.svg" alt="" width="100">
<a class="text-gray" href="https://copay.io" target="_blank">Project Homapage</a>
</small>
<div>
<strong>{{$root.wallet.getName()}}</strong>
</div>
<div class="size-12 m10t">
{{$root.wallet.requiredCopayers}}-of-{{$root.wallet.totalCopayers}} wallet
<span ng-if="$root.wallet.getNetworkName()=='livenet'">[LIVENET]</span>
<span ng-if="$root.wallet.getNetworkName()=='testnet'">[TESTNET]</span>
</div>
<div>
<a href="/addresses" class="has-tip" tooltip-placement="bottom" tooltip="ID: {{$root.wallet.id}}">
<strong><span>{{$root.wallet.getName()}}</span></strong>
</a> </a>
<a title="Manual Refresh" <small>v{{version}}</small>
<div class="line-sidebar"></div>
<div>
<a href="/addresses" class="name-wallet" tooltip-placement="bottom" tooltip="ID: {{$root.wallet.id}}">
<span>{{$root.wallet.getName()}}</span>
</a>
<a class="button small side-bar" title="Manual Refresh"
ng-disabled="$root.loading" ng-disabled="$root.loading"
ng-click="refresh()"><i class="fi-refresh"></i></a> ng-click="refresh()"><i class="size-16 fi-refresh"></i></a>
<a title="Signout" <a class="button small side-bar" title="Signout"
ng-click="signout()"><i class="fi-power"></i></a> ng-click="signout()"><i class="size-16 fi-power"></i></a>
</div> </div>
<div> <div class="founds size-12">
Balance<br class="hide-for-small"> Balance
<span ng-if="$root.updatingBalance"> <span ng-if="$root.updatingBalance">
<i class="fi-bitcoin-circle icon-rotate spinner"></i> <i class="fi-bitcoin-circle icon-rotate spinner"></i>
</span> </span>
<span ng-if="!$root.updatingBalance" <span ng-if="!$root.updatingBalance"
data-options="disable_for_touch:true" data-options="disable_for_touch:true"
tooltip="{{totalBalanceBTC || 0 |noFractionNumber:8}} BTC" tooltip="{{totalBalanceBTC || 0 |noFractionNumber:8}} BTC"
tooltip-trigger="mouseenter" tooltip-trigger="mouseenter"
tooltip-placement="bottom">{{totalBalance || 0 tooltip-placement="bottom">{{totalBalance || 0
|noFractionNumber}} {{$root.unitName}} |noFractionNumber}} {{$root.unitName}}
</span> </span>
</div> <br>
<div> Available
Available to Spend<br class="hide-for-small"> <span ng-if="$root.updatingBalance">
<span ng-if="$root.updatingBalance"> <i class="fi-bitcoin-circle icon-rotate spinner"></i>
<i class="fi-bitcoin-circle icon-rotate spinner"></i> </span>
</span> <span ng-show="!$root.updatingBalance"
<span ng-show="!$root.updatingBalance" data-options="disable_for_touch:true"
data-options="disable_for_touch:true" tooltip="{{availableBalanceBTC || 0 |noFractionNumber:8}} BTC"
tooltip="{{availableBalanceBTC || 0 |noFractionNumber:8}} BTC" tooltip-trigger="mouseenter"
tooltip-trigger="mouseenter" tooltip-placement="bottom">{{availableBalance || 0|noFractionNumber}} {{$root.unitName}}
tooltip-placement="bottom">{{availableBalance || 0|noFractionNumber}} {{$root.unitName}} </span>
</span> </div>
</div> <div class="m10v box-livenet">
<small ng-if="$root.wallet.getNetworkName()=='livenet'">LIVENET</small>
<small ng-if="$root.wallet.getNetworkName()=='testnet'">TESTNET</small>
</div>
</header>
<ul class="side-nav"> <ul class="side-nav">
<li data-ng-repeat="item in menu" ui-route="/{{item.link}}" class="text-center" data-ng-class="{active: isActive(item)}"> <li data-ng-repeat="item in menu" ui-route="/{{item.link}}" class="nav-item" data-ng-class="{active: isActive(item)}">
<a href="{{item.link}}" ng-click="toggleCollapse()"> <i class="{{item.icon}}"></i> {{item.title}} <a href="{{item.link}}" ng-click="toggleCollapse()" class="db">
<span class="label alert round" ng-if="item.link=='#/transactions' && $root.pendingTxCount > 0">{{$root.pendingTxCount}}</span> <i class="size-24 m20r {{item.icon}}"></i> {{item.title}}
</a> <span class="label alert round" ng-if="item.link=='#/transactions' && $root.pendingTxCount > 0">{{$root.pendingTxCount}}</span>
</a>
</li> </li>
</ul> </ul>
{{$root.wallet.requiredCopayers}}-of-{{$root.wallet.totalCopayers}} wallet
<div ng-include="'views/includes/video.html'"></div> <div ng-include="'views/includes/video.html'"></div>