mirror of https://github.com/BTCPrivate/copay.git
side bar
This commit is contained in:
bechi
parent
4469cf1f0a
commit
d3747b6f7a
55
css/main.css
55
css/main.css
|
|
@ -75,15 +75,20 @@ body, html{
|
|||
.sidebar {
|
||||
position: fixed;
|
||||
width: 250px;
|
||||
padding: 15px;
|
||||
padding: 20px;
|
||||
background-color: #2C3E50;
|
||||
color: #fff;
|
||||
line-height: 24px;
|
||||
}
|
||||
|
||||
.sidebar a {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.button.small.side-bar {
|
||||
padding: 0.2rem 0.4rem;
|
||||
}
|
||||
|
||||
.main {
|
||||
margin-left: 250px;
|
||||
}
|
||||
|
|
@ -95,7 +100,7 @@ body, html{
|
|||
.dn {display: none;}
|
||||
.pr {position: relative;}
|
||||
.m0 {margin: 0;}
|
||||
.db {display: block;}
|
||||
.db {display: block;}
|
||||
.size-12 { font-size: 12px; }
|
||||
.size-14 { font-size: 14px; }
|
||||
.size-16 { font-size: 16px; }
|
||||
|
|
@ -112,6 +117,7 @@ body, html{
|
|||
.m10b {margin-bottom: 10px;}
|
||||
.m15b {margin-bottom: 20px;}
|
||||
.m10r {margin-right: 10px;}
|
||||
.m20r {margin-right: 20px;}
|
||||
.m10 {margin: 10px;}
|
||||
.m15 {margin: 15px;}
|
||||
.p10t {padding-top: 10px;}
|
||||
|
|
@ -122,6 +128,7 @@ body, html{
|
|||
.p20h {padding: 0 20px;}
|
||||
.m30v {margin: 30px 0;}
|
||||
.m10h {margin:0 10px;}
|
||||
.m10v {margin:10px 0;}
|
||||
.m30a {margin: 30px auto;}
|
||||
.br100 {border-radius: 100%;}
|
||||
.lh {line-height: 0;}
|
||||
|
|
@ -141,6 +148,11 @@ body, html{
|
|||
margin: 0.5rem 0 1rem;
|
||||
}
|
||||
|
||||
.line-sidebar {
|
||||
border-top: 1px solid #34495E;
|
||||
margin: 1.4rem 0;
|
||||
}
|
||||
|
||||
.line-dashed {
|
||||
border-top: 1px dashed #ccc;
|
||||
margin: 1rem 0;
|
||||
|
|
@ -148,6 +160,23 @@ body, html{
|
|||
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 */
|
||||
input[type=number]::-webkit-inner-spin-button,
|
||||
input[type=number]::-webkit-outer-spin-button {
|
||||
|
|
@ -468,4 +497,26 @@ button[disabled].warning:focus,
|
|||
|
||||
.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;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/*-----------------------------------------------------------------*/
|
||||
|
|
@ -1,61 +1,58 @@
|
|||
<div ng-controller="SidebarController">
|
||||
<span class="logo"></span>
|
||||
Copay <small>v{{version}}</small>
|
||||
<small>
|
||||
<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>
|
||||
<header class="text-center">
|
||||
<a href="/" class="db">
|
||||
<img src="../img/logo-negative-beta.svg" alt="" width="100">
|
||||
</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-click="refresh()"><i class="fi-refresh"></i></a>
|
||||
<a title="Signout"
|
||||
ng-click="signout()"><i class="fi-power"></i></a>
|
||||
</div>
|
||||
<div>
|
||||
Balance<br class="hide-for-small">
|
||||
<span ng-if="$root.updatingBalance">
|
||||
<i class="fi-bitcoin-circle icon-rotate spinner"></i>
|
||||
</span>
|
||||
<span ng-if="!$root.updatingBalance"
|
||||
data-options="disable_for_touch:true"
|
||||
tooltip="{{totalBalanceBTC || 0 |noFractionNumber:8}} BTC"
|
||||
tooltip-trigger="mouseenter"
|
||||
tooltip-placement="bottom">{{totalBalance || 0
|
||||
|noFractionNumber}} {{$root.unitName}}
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
Available to Spend<br class="hide-for-small">
|
||||
<span ng-if="$root.updatingBalance">
|
||||
<i class="fi-bitcoin-circle icon-rotate spinner"></i>
|
||||
</span>
|
||||
<span ng-show="!$root.updatingBalance"
|
||||
data-options="disable_for_touch:true"
|
||||
tooltip="{{availableBalanceBTC || 0 |noFractionNumber:8}} BTC"
|
||||
tooltip-trigger="mouseenter"
|
||||
tooltip-placement="bottom">{{availableBalance || 0|noFractionNumber}} {{$root.unitName}}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
ng-click="refresh()"><i class="size-16 fi-refresh"></i></a>
|
||||
<a class="button small side-bar" title="Signout"
|
||||
ng-click="signout()"><i class="size-16 fi-power"></i></a>
|
||||
</div>
|
||||
<div class="founds size-12">
|
||||
Balance
|
||||
<span ng-if="$root.updatingBalance">
|
||||
<i class="fi-bitcoin-circle icon-rotate spinner"></i>
|
||||
</span>
|
||||
<span ng-if="!$root.updatingBalance"
|
||||
data-options="disable_for_touch:true"
|
||||
tooltip="{{totalBalanceBTC || 0 |noFractionNumber:8}} BTC"
|
||||
tooltip-trigger="mouseenter"
|
||||
tooltip-placement="bottom">{{totalBalance || 0
|
||||
|noFractionNumber}} {{$root.unitName}}
|
||||
</span>
|
||||
<br>
|
||||
Available
|
||||
<span ng-if="$root.updatingBalance">
|
||||
<i class="fi-bitcoin-circle icon-rotate spinner"></i>
|
||||
</span>
|
||||
<span ng-show="!$root.updatingBalance"
|
||||
data-options="disable_for_touch:true"
|
||||
tooltip="{{availableBalanceBTC || 0 |noFractionNumber:8}} BTC"
|
||||
tooltip-trigger="mouseenter"
|
||||
tooltip-placement="bottom">{{availableBalance || 0|noFractionNumber}} {{$root.unitName}}
|
||||
</span>
|
||||
</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">
|
||||
<li data-ng-repeat="item in menu" ui-route="/{{item.link}}" class="text-center" data-ng-class="{active: isActive(item)}">
|
||||
<a href="{{item.link}}" ng-click="toggleCollapse()"> <i class="{{item.icon}}"></i> {{item.title}}
|
||||
<span class="label alert round" ng-if="item.link=='#/transactions' && $root.pendingTxCount > 0">{{$root.pendingTxCount}}</span>
|
||||
</a>
|
||||
<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()" class="db">
|
||||
<i class="size-24 m20r {{item.icon}}"></i> {{item.title}}
|
||||
<span class="label alert round" ng-if="item.link=='#/transactions' && $root.pendingTxCount > 0">{{$root.pendingTxCount}}</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
{{$root.wallet.requiredCopayers}}-of-{{$root.wallet.totalCopayers}} wallet
|
||||
|
||||
<div ng-include="'views/includes/video.html'"></div>
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue