ionic side menu
This commit is contained in:
Gabriel Bazán
Javier
parent
a54df263e2
commit
d468c28cd0
7 changed files with 105 additions and 161 deletions
|
|
@ -16,32 +16,31 @@
|
|||
</head>
|
||||
<body ng-cloak class="ng-cloak">
|
||||
|
||||
<div class="page" ng-controller="indexController as index">
|
||||
<div notifications="right top"></div>
|
||||
<div ng-include="'views/includes/tx-details.html'" ng-if="index.showTx"></div>
|
||||
<div ng-include="'views/includes/password.html'" ng-if="index.askPassword"></div>
|
||||
<div ng-include="'views/includes/alert.html'" ng-if="index.showAlert"></div>
|
||||
<div ng-include="'views/includes/confirm-tx.html'" ng-if="index.confirmTx"></div>
|
||||
<ion-side-menus class="page" ng-controller="indexController as index">
|
||||
|
||||
<div class="off-canvas-wrap" id="off-canvas-wrap"
|
||||
ng-swipe-disable-mouse
|
||||
ng-swipe-left="index.closeMenu()"
|
||||
ng-swipe-right="index.openMenu()">
|
||||
<div class="inner-wrap">
|
||||
<div ng-include="'views/includes/sidebar.html'" ng-if="index.hasProfile"></div>
|
||||
<div id="sectionContainer">
|
||||
<div id="mainSection">
|
||||
<section ui-view="main"
|
||||
ng-class="{
|
||||
'main': index.hasProfile
|
||||
}"></section>
|
||||
</div>
|
||||
<!-- Left menu -->
|
||||
<ion-side-menu side="left">
|
||||
<div ng-include="'views/includes/sidebar.html'" ng-if="index.hasProfile"></div>
|
||||
</ion-side-menu>
|
||||
|
||||
<!-- Main content -->
|
||||
|
||||
<ion-side-menu-content>
|
||||
<div notifications="right top"></div>
|
||||
<div ng-include="'views/includes/tx-details.html'" ng-if="index.showTx"></div>
|
||||
<div ng-include="'views/includes/password.html'" ng-if="index.askPassword"></div>
|
||||
<div ng-include="'views/includes/alert.html'" ng-if="index.showAlert"></div>
|
||||
<div ng-include="'views/includes/confirm-tx.html'" ng-if="index.confirmTx"></div>
|
||||
<div id="sectionContainer">
|
||||
<div id="mainSection">
|
||||
<section ui-view="main"
|
||||
ng-class="{
|
||||
'main': index.hasProfile
|
||||
}"></section>
|
||||
</div>
|
||||
<a class="close-menu" ng-click="index.closeMenu()"></a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ion-side-menu-content>
|
||||
</ion-side-menus>
|
||||
|
||||
<script src="lib/ionic.bundle.js"></script>
|
||||
<script src="lib/angular.js"></script>
|
||||
|
|
|
|||
|
|
@ -1,51 +1,53 @@
|
|||
<nav class="sidebar left-off-canvas-menu" ng-controller="sidebarController as sidebar">
|
||||
<header>
|
||||
<logo ng-if="!sidebar.isWindowsPhoneApp" negative="true" width="80"></logo>
|
||||
<img ng-if="sidebar.isWindowsPhoneApp" src="img/logo-negative.png" alt="Copay" width="80">
|
||||
<div ng-include="'views/includes/version.html'"></div>
|
||||
</header>
|
||||
<ul class="off-canvas-list">
|
||||
<li ng-show="sidebar.wallets[0]"
|
||||
ng-repeat="item in sidebar.wallets track by $index"
|
||||
ng-class="{'selected': item.id == index.walletId}"
|
||||
class="nav-item">
|
||||
<a ng-click="sidebar.closeMenu(); sidebar.switchWallet(item.id, index.walletId)" class="oh">
|
||||
<div class="avatar-wallet"
|
||||
ng-style="{'background-color':item.color}">
|
||||
<i class="icon-wallet size-21"></i>
|
||||
</div>
|
||||
<div class="name-wallet" ng-class="{'m8t':item.n == 1}">{{item.name || item.id}}</div>
|
||||
<div class="size-12" ng-show="item.n > 1" translate>{{item.m}}-of-{{item.n}}</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a ng-click="sidebar.closeMenu(); $root.go('add')" class="oh">
|
||||
<i class="icon-arrow-right3 size-18 right m10t vm"></i>
|
||||
<i class="fi-plus size-24 icon vm"></i>
|
||||
<div class="tu text-bold">
|
||||
<span class="size-12" translate>Add wallet</span>
|
||||
</div>
|
||||
<div translate>Create, join or import</div>
|
||||
</a>
|
||||
</li>
|
||||
<li ng-show="!index.isWindowsPhoneApp && index.isComplete && (index.glideraEnabled || index.coinbaseEnabled)">
|
||||
<a ng-click="sidebar.closeMenu(); $root.go('buyandsell')" class="oh">
|
||||
<i class="icon-arrow-right3 size-18 right m10t vm"></i>
|
||||
<i class="icon-bank size-24 icon vm"></i>
|
||||
<div class="tu text-bold m5t">
|
||||
<span class="size-12" translate>Buy & Sell</span>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a ng-click="sidebar.closeMenu(); $root.go('preferencesGlobal')" class="oh">
|
||||
<i class="icon-arrow-right3 size-18 right m10t vm"></i>
|
||||
<i class="fi-widget size-24 icon vm"></i>
|
||||
<div class="tu text-bold">
|
||||
<span class="size-12" translate>Settings</span>
|
||||
</div>
|
||||
<div translate>Global preferences</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<nav class="sidebar" ng-controller="sidebarController as sidebar">
|
||||
<header>
|
||||
<logo ng-if="!sidebar.isWindowsPhoneApp" negative="true" width="80"></logo>
|
||||
<img ng-if="sidebar.isWindowsPhoneApp" src="img/logo-negative.png" alt="Copay" width="80">
|
||||
<div ng-include="'views/includes/version.html'"></div>
|
||||
</header>
|
||||
<ion-content overflow-scroll="true">
|
||||
<ul class="pr">
|
||||
<li ng-show="sidebar.wallets[0]"
|
||||
ng-repeat="item in sidebar.wallets track by $index"
|
||||
ng-class="{'selected': item.id == index.walletId}"
|
||||
class="nav-item">
|
||||
<a menu-toggle ng-click="$root.go('walletHome'); sidebar.switchWallet(item.id, index.walletId)" class="oh">
|
||||
<div class="avatar-wallet"
|
||||
ng-style="{'background-color':item.color}">
|
||||
<i class="icon-wallet size-21"></i>
|
||||
</div>
|
||||
<div class="name-wallet" ng-class="{'m8t':item.n == 1}">{{item.name || item.id}}</div>
|
||||
<div class="size-12" ng-show="item.n > 1" translate>{{item.m}}-of-{{item.n}}</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a menu-toggle ng-click="$root.go('add')" class="oh">
|
||||
<i class="icon-arrow-right3 size-18 right m10t vm"></i>
|
||||
<i class="fi-plus size-24 icon vm"></i>
|
||||
<div class="tu text-bold">
|
||||
<span class="size-12" translate>Add wallet</span>
|
||||
</div>
|
||||
<div translate>Create, join or import</div>
|
||||
</a>
|
||||
</li>
|
||||
<li ng-show="!index.isWindowsPhoneApp && index.isComplete && (index.glideraEnabled || index.coinbaseEnabled)">
|
||||
<a menu-toggle ng-click="$root.go('buyandsell')" class="oh">
|
||||
<i class="icon-arrow-right3 size-18 right m10t vm"></i>
|
||||
<i class="icon-bank size-24 icon vm"></i>
|
||||
<div class="tu text-bold m5t">
|
||||
<span class="size-12" translate>Buy & Sell</span>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a menu-toggle ng-click="$root.go('preferencesGlobal')" class="oh">
|
||||
<i class="icon-arrow-right3 size-18 right m10t vm"></i>
|
||||
<i class="fi-widget size-24 icon vm"></i>
|
||||
<div class="tu text-bold">
|
||||
<span class="size-12" translate>Settings</span>
|
||||
</div>
|
||||
<div translate>Global preferences</div>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</ion-content>
|
||||
</nav>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
ng-style="{'background-color': noColor ? '#4B6178' : index.backgroundColor}">
|
||||
<section class="left-small">
|
||||
<a id="hamburger" class="p10" ng-show="!goBackToState && !closeToHome && !index.noFocusedWallet"
|
||||
ng-click="index.openMenu()"><i class="fi-list size-24"></i>
|
||||
ng-click="index.toggleLeftMenu()"><i class="fi-list size-24"></i>
|
||||
</a>
|
||||
<a ng-show="goBackToState"
|
||||
ng-click="$root.go(goBackToState); goBackToState = null"><i class="icon-arrow-left3 icon-back"></i>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue