Transparent list items, payment dropdown menu changes

src/app/app.scss

@@ -8,4 +8,5 @@ $colors: (
 
 ion-content{
     background-image: url('https://specials-images.forbesimg.com/dam/imageserve/1022389510/960x0.jpg?fit=scale');
+    background-color: transparent !important;
 }

src/pages/payment/payment.html

@@ -12,7 +12,7 @@
            <ion-label color="primary" stacked>Please select your ID</ion-label>
       <!-- <ion-input type="string" [(ngModel)]="trans.fromId"></ion-input> // Can type ID manually-->
     
-          <ion-select [(ngModel)]="trans.fromId">
+          <ion-select [(ngModel)]="trans.fromId" interface="popover">
             <ion-option value="15b9ef7d26485fae2ecdc74f8f9f465e0c082fe19a996aef2f1daf712aec5751">Vince</ion-option>
             <ion-option value="9e3123b4c696cb7d9d906a6ec2813d6e6fed5af58b49c4e5f849b7adcb00486c">Tennessee</ion-option>
             <ion-option value="625ef69f8ef7318876d5c5e31c045f4cc2c89ec01949a3af3789be1f45405342">Mexi</ion-option>
@@ -25,7 +25,7 @@
     <ion-item>
         <ion-label color="primary" stacked>Who would you like to receive BlueCoin?</ion-label>
         <!-- <ion-input type="string"[(ngModel)]="trans.fromId"></ion-input> Can type ID mamaully-->
-        <ion-select [(ngModel)]="trans.toId">
+        <ion-select [(ngModel)]="trans.toId" interface="popover">
             <ion-option value="15b9ef7d26485fae2ecdc74f8f9f465e0c082fe19a996aef2f1daf712aec5751">Vince</ion-option>
             <ion-option value="9e3123b4c696cb7d9d906a6ec2813d6e6fed5af58b49c4e5f849b7adcb00486c">Tennessee</ion-option>
             <ion-option value="625ef69f8ef7318876d5c5e31c045f4cc2c89ec01949a3af3789be1f45405342">Mexi</ion-option>
@@ -36,7 +36,7 @@
 
       <ion-item>
           <ion-label color="primary" stacked>Amount</ion-label>
-          <ion-input type="number" placeholder="Enter Amount" [(ngModel)]="trans.amount" ></ion-input>
+          <ion-input type="number" placeholder="Enter Amount" [(ngModel)]="trans.amount" interface="popover"></ion-input>
         </ion-item>
 
         <button ion-button (click) = "transferMoney()">Send BlueCoin</button>

src/pages/transactions/transactions.html

@@ -9,7 +9,7 @@
   
 <ion-content padding>
   <ion-refresher (ionRefresh)="doRefresh($event);">
-    <ion-refresher-content
+   <ion-refresher-content
       pullingText="Pull to refresh"
       pullingIcon="arrow-dropdown"
       refreshingSpinner="circles"

src/pages/transactions/transactions.scss

@@ -1,4 +1,8 @@
 
-ion-content{
-    background-image: url('https://specials-images.forbesimg.com/dam/imageserve/1022389510/960x0.jpg?fit=scale');
-}
+  page-transactions {
+       .list .item, .list .item-complex .item-content {
+     background: rgba(255,255,255,0);
+
+    ion-content { background-color: transparent !important; }
+  }
+  }

src/pages/wallet/wallet.scss

@@ -1,3 +1,7 @@
 page-wallet {
+    .list .item, .list .item-complex .item-content .refresher .refresher-content {
+        background: rgba(255,255,255,0);
+      }
 
+      ion-content { background-color: transparent !important; }
 }

www/build/main.css

@@ -25680,8 +25680,21 @@ ion-navbar.toolbar {
 
 ion-content {
   background-image: url("https://specials-images.forbesimg.com/dam/imageserve/1022389510/960x0.jpg?fit=scale");
+  background-color: transparent !important;
 }
 
-ion-content {
-  background-image: url("https://specials-images.forbesimg.com/dam/imageserve/1022389510/960x0.jpg?fit=scale");
+page-transactions .list .item, page-transactions .list .item-complex .item-content {
+  background: rgba(255, 255, 255, 0);
+}
+
+page-transactions .list .item ion-content, page-transactions .list .item-complex .item-content ion-content {
+  background-color: transparent !important;
+}
+
+page-wallet .list .item, page-wallet .list .item-complex .item-content .refresher .refresher-content {
+  background: rgba(255, 255, 255, 0);
+}
+
+page-wallet ion-content {
+  background-color: transparent !important;
 }

www/build/main.js

@@ -22,13 +22,13 @@ webpackEmptyAsyncContext.id = 115;
 
 var map = {
 	"../pages/payment/payment.module": [
-		161
+		158
 	],
 	"../pages/transactions/transactions.module": [
-		158
+		159
 	],
 	"../pages/wallet/wallet.module": [
-		159
+		160
 	]
 };
 function webpackAsyncContext(req) {
@@ -52,6 +52,52 @@ module.exports = webpackAsyncContext;
 
 "use strict";
 Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PaymentPageModule", function() { return PaymentPageModule; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__angular_core__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_ionic_angular__ = __webpack_require__(18);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__payment__ = __webpack_require__(80);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__providers_transaction_service__ = __webpack_require__(41);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__components_transaction_transaction__ = __webpack_require__(258);
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+
+
+
+
+
+var PaymentPageModule = /** @class */ (function () {
+    function PaymentPageModule() {
+    }
+    PaymentPageModule = __decorate([
+        Object(__WEBPACK_IMPORTED_MODULE_0__angular_core__["I" /* NgModule */])({
+            declarations: [
+                __WEBPACK_IMPORTED_MODULE_2__payment__["a" /* PaymentPage */],
+                __WEBPACK_IMPORTED_MODULE_4__components_transaction_transaction__["a" /* TransactionComponent */]
+            ],
+            imports: [
+                __WEBPACK_IMPORTED_MODULE_1_ionic_angular__["d" /* IonicPageModule */].forChild(__WEBPACK_IMPORTED_MODULE_2__payment__["a" /* PaymentPage */]),
+            ],
+            providers: [
+                __WEBPACK_IMPORTED_MODULE_3__providers_transaction_service__["a" /* TransactionService */],
+            ],
+        })
+    ], PaymentPageModule);
+    return PaymentPageModule;
+}());
+
+//# sourceMappingURL=payment.module.js.map
+
+/***/ }),
+
+/***/ 159:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "TransactionPageModule", function() { return TransactionPageModule; });
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__angular_core__ = __webpack_require__(0);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_ionic_angular__ = __webpack_require__(18);
@@ -90,7 +136,7 @@ var TransactionPageModule = /** @class */ (function () {
 
 /***/ }),
 
-/***/ 159:
+/***/ 160:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -98,8 +144,8 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "WalletPageModule", function() { return WalletPageModule; });
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__angular_core__ = __webpack_require__(0);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_ionic_angular__ = __webpack_require__(18);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__wallet__ = __webpack_require__(160);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__providers_wallet_service__ = __webpack_require__(80);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__wallet__ = __webpack_require__(161);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__providers_wallet_service__ = __webpack_require__(81);
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -133,12 +179,12 @@ var WalletPageModule = /** @class */ (function () {
 
 /***/ }),
 
-/***/ 160:
+/***/ 161:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return WalletPage; });
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__providers_wallet_service__ = __webpack_require__(80);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__providers_wallet_service__ = __webpack_require__(81);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__angular_core__ = __webpack_require__(0);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_2_ionic_angular__ = __webpack_require__(18);
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
@@ -172,72 +218,25 @@ var WalletPage = /** @class */ (function () {
     ;
     WalletPage = __decorate([
         Object(__WEBPACK_IMPORTED_MODULE_1__angular_core__["m" /* Component */])({
-            selector: 'page-wallet',template:/*ion-inline-start:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/pages/wallet/wallet.html"*/'<ion-header>\n  <ion-navbar>\n    <ion-title>ZipCoin Blue Wallet</ion-title>\n  </ion-navbar>\n</ion-header>\n\n<ion-content padding>\n    <ion-refresher (ionRefresh)="doRefresh($event);">\n        <ion-refresher-content\n          pullingText="Pull to refresh"\n          pullingIcon="arrow-dropdown"\n          refreshingSpinner="circles"\n          refreshingText="...fetching...">\n        </ion-refresher-content>\n      </ion-refresher>\n  <ion-list>\n    <ion-item *ngFor="let wallet of wallets">\n        <ion-card>\n            <ion-card-header>\n               Name: <h2>{{wallet.name}}</h2>\n            </ion-card-header>\n            <ion-card-content>\n     Balance: <h2>{{wallet.amount}}</h2>\n     Public Key: <h2>{{wallet.publicId}}</h2>\n      \n    </ion-card-content>\n  </ion-card>\n    </ion-item>\n  </ion-list>\n  \n</ion-content>'/*ion-inline-end:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/pages/wallet/wallet.html"*/,
+            selector: 'page-wallet',template:/*ion-inline-start:"/Users/yauhenip/Projects/blueCoin-UI/src/pages/wallet/wallet.html"*/'<ion-header>\n  <ion-navbar>\n    <ion-title>ZipCoin Blue Wallet</ion-title>\n  </ion-navbar>\n</ion-header>\n\n<ion-content padding>\n    <ion-refresher (ionRefresh)="doRefresh($event);">\n        <ion-refresher-content\n          pullingText="Pull to refresh"\n          pullingIcon="arrow-dropdown"\n          refreshingSpinner="circles"\n          refreshingText="...fetching...">\n        </ion-refresher-content>\n      </ion-refresher>\n  <ion-list>\n    <ion-item *ngFor="let wallet of wallets">\n        <ion-card>\n            <ion-card-header>\n               Name: <h2>{{wallet.name}}</h2>\n            </ion-card-header>\n            <ion-card-content>\n     Balance: <h2>{{wallet.amount}}</h2>\n     Public Key: <h2>{{wallet.publicId}}</h2>\n      \n    </ion-card-content>\n  </ion-card>\n    </ion-item>\n  </ion-list>\n  \n</ion-content>'/*ion-inline-end:"/Users/yauhenip/Projects/blueCoin-UI/src/pages/wallet/wallet.html"*/,
         }),
-        __metadata("design:paramtypes", [typeof (_a = typeof __WEBPACK_IMPORTED_MODULE_2_ionic_angular__["e" /* NavController */] !== "undefined" && __WEBPACK_IMPORTED_MODULE_2_ionic_angular__["e" /* NavController */]) === "function" && _a || Object, typeof (_b = typeof __WEBPACK_IMPORTED_MODULE_2_ionic_angular__["f" /* NavParams */] !== "undefined" && __WEBPACK_IMPORTED_MODULE_2_ionic_angular__["f" /* NavParams */]) === "function" && _b || Object, typeof (_c = typeof __WEBPACK_IMPORTED_MODULE_0__providers_wallet_service__["a" /* WalletService */] !== "undefined" && __WEBPACK_IMPORTED_MODULE_0__providers_wallet_service__["a" /* WalletService */]) === "function" && _c || Object])
+        __metadata("design:paramtypes", [__WEBPACK_IMPORTED_MODULE_2_ionic_angular__["e" /* NavController */], __WEBPACK_IMPORTED_MODULE_2_ionic_angular__["f" /* NavParams */], __WEBPACK_IMPORTED_MODULE_0__providers_wallet_service__["a" /* WalletService */]])
     ], WalletPage);
     return WalletPage;
-    var _a, _b, _c;
 }());
 
 //# sourceMappingURL=wallet.js.map
 
 /***/ }),
 
-/***/ 161:
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
-Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "PaymentPageModule", function() { return PaymentPageModule; });
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__angular_core__ = __webpack_require__(0);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_ionic_angular__ = __webpack_require__(18);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__payment__ = __webpack_require__(81);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__providers_transaction_service__ = __webpack_require__(41);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__components_transaction_transaction__ = __webpack_require__(258);
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-
-
-
-
-
-var PaymentPageModule = /** @class */ (function () {
-    function PaymentPageModule() {
-    }
-    PaymentPageModule = __decorate([
-        Object(__WEBPACK_IMPORTED_MODULE_0__angular_core__["I" /* NgModule */])({
-            declarations: [
-                __WEBPACK_IMPORTED_MODULE_2__payment__["a" /* PaymentPage */],
-                __WEBPACK_IMPORTED_MODULE_4__components_transaction_transaction__["a" /* TransactionComponent */]
-            ],
-            imports: [
-                __WEBPACK_IMPORTED_MODULE_1_ionic_angular__["d" /* IonicPageModule */].forChild(__WEBPACK_IMPORTED_MODULE_2__payment__["a" /* PaymentPage */]),
-            ],
-            providers: [
-                __WEBPACK_IMPORTED_MODULE_3__providers_transaction_service__["a" /* TransactionService */],
-            ],
-        })
-    ], PaymentPageModule);
-    return PaymentPageModule;
-}());
-
-//# sourceMappingURL=payment.module.js.map
-
-/***/ }),
-
 /***/ 205:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return TabsPage; });
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__payment_payment__ = __webpack_require__(81);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__payment_payment__ = __webpack_require__(80);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__transactions_transactions__ = __webpack_require__(57);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__wallet_wallet__ = __webpack_require__(160);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_2__wallet_wallet__ = __webpack_require__(161);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_3__angular_core__ = __webpack_require__(0);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_4__home_home__ = __webpack_require__(206);
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
@@ -262,7 +261,7 @@ var TabsPage = /** @class */ (function () {
         this.tab4Root = __WEBPACK_IMPORTED_MODULE_2__wallet_wallet__["a" /* WalletPage */];
     }
     TabsPage = __decorate([
-        Object(__WEBPACK_IMPORTED_MODULE_3__angular_core__["m" /* Component */])({template:/*ion-inline-start:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/pages/tabs/tabs.html"*/'<ion-tabs>\n  <!-- <ion-tab [root]="tab1Root" tabTitle="Blockchain" tabIcon="cube"></ion-tab> -->\n  <ion-tab [root]="tab2Root" tabTitle="Payment" tabIcon="send"></ion-tab>\n  <ion-tab [root]="tab3Root" tabTitle="Blockchain" tabIcon="cube"></ion-tab>\n  <ion-tab [root]="tab4Root" tabTitle="Wallet" tabIcon="logo-usd"></ion-tab>\n</ion-tabs>\n'/*ion-inline-end:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/pages/tabs/tabs.html"*/
+        Object(__WEBPACK_IMPORTED_MODULE_3__angular_core__["m" /* Component */])({template:/*ion-inline-start:"/Users/yauhenip/Projects/blueCoin-UI/src/pages/tabs/tabs.html"*/'<ion-tabs>\n  <!-- <ion-tab [root]="tab1Root" tabTitle="Blockchain" tabIcon="cube"></ion-tab> -->\n  <ion-tab [root]="tab2Root" tabTitle="Payment" tabIcon="send"></ion-tab>\n  <ion-tab [root]="tab3Root" tabTitle="Blockchain" tabIcon="cube"></ion-tab>\n  <ion-tab [root]="tab4Root" tabTitle="Wallet" tabIcon="logo-usd"></ion-tab>\n</ion-tabs>\n'/*ion-inline-end:"/Users/yauhenip/Projects/blueCoin-UI/src/pages/tabs/tabs.html"*/
         }),
         __metadata("design:paramtypes", [])
     ], TabsPage);
@@ -299,7 +298,7 @@ var HomePage = /** @class */ (function () {
     };
     HomePage = __decorate([
         Object(__WEBPACK_IMPORTED_MODULE_0__angular_core__["m" /* Component */])({
-            selector: 'page-home',template:/*ion-inline-start:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/pages/home/home.html"*/'<ion-header>\n  <ion-navbar>\n    <ion-title>BlueCoin</ion-title>\n  </ion-navbar>\n</ion-header>\n\n<ion-content padding>\n  <h2>Blockchain</h2>\n  <div>\n  <ion-item>\n      <ion-label color="primary" stacked>Blockchain</ion-label>\n      <ion-input type="number" placeholder="Block"></ion-input>\n    </ion-item>\n    <ion-item>\n        <ion-label color="primary" stacked>Nonce</ion-label>\n        <ion-input type="number" placeholder="Nonce"></ion-input>\n      </ion-item>\n      <ion-item>\n          <ion-label color="primary" stacked>Transaction Data</ion-label>\n          <p></p>\n          <ion-input type="number" placeholder="Data"></ion-input>\n        </ion-item>\n        <ion-item>\n            <ion-label color="primary" stacked>Hash</ion-label>\n            <ion-input type="number" disabled placeholder="Hash"></ion-input>\n          </ion-item>\n          <button ion-button block>Mine</button></div>\n  <!-- <div id="block1chain1well" class="well well-success">\n    <form class="form-horizontal">\n      <div class="form-group">\n        <label for="block1chain1number" class="col-sm-2 control-label">Block:</label>\n        <div class="col-sm-10">\n          <div class="input-group">\n            <span class="input-group-addon">#</span>\n            <input id="block1chain1number" type="text" value="1" onkeyup="updateHash(1, 1);" class="form-control"></div>\n          </div></div><div class="form-group">\n            <label for="block1chain1nonce" class="col-sm-2 control-label">Nonce:</label>\n            <div class="col-sm-10"><input id="block1chain1nonce" type="text" value="72608" onkeyup="updateHash(1, 1);" class="form-control"></div>\n          </div><div class="form-group"><label for="block1chain1data" class="col-sm-2 control-label">Data:</label>\n            <div class="col-sm-10">\n              <textarea id="block1chain1data" rows="10" onkeyup="updateHash(1, 1);" class="form-control">\n\n              </textarea></div></div><div id="state" class="form-group">\n                <label for="block1chain1hash" class="col-sm-2 control-label">Hash:</label><div class="col-sm-10">\n                  <input id="block1chain1hash" type="text" disabled="" class="form-control">\n                </div></div><div class="form-group"><div class="col-sm-2">\n                  <i class="icon-spinner icon-spin icon-large">\n\n                  </i></div><div class="col-sm-10">\n                    <button id="block1chain1mineButton" data-style="expand-right" class="btn btn-primary ladda-button">\n                      <span class="ladda-label">Mine</span></button></div></div></form></div> -->'/*ion-inline-end:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/pages/home/home.html"*/
+            selector: 'page-home',template:/*ion-inline-start:"/Users/yauhenip/Projects/blueCoin-UI/src/pages/home/home.html"*/'<ion-header>\n  <ion-navbar>\n    <ion-title>BlueCoin</ion-title>\n  </ion-navbar>\n</ion-header>\n\n<ion-content padding>\n  <h2>Blockchain</h2>\n  <div>\n  <ion-item>\n      <ion-label color="primary" stacked>Blockchain</ion-label>\n      <ion-input type="number" placeholder="Block"></ion-input>\n    </ion-item>\n    <ion-item>\n        <ion-label color="primary" stacked>Nonce</ion-label>\n        <ion-input type="number" placeholder="Nonce"></ion-input>\n      </ion-item>\n      <ion-item>\n          <ion-label color="primary" stacked>Transaction Data</ion-label>\n          <p></p>\n          <ion-input type="number" placeholder="Data"></ion-input>\n        </ion-item>\n        <ion-item>\n            <ion-label color="primary" stacked>Hash</ion-label>\n            <ion-input type="number" disabled placeholder="Hash"></ion-input>\n          </ion-item>\n          <button ion-button block>Mine</button></div>\n  <!-- <div id="block1chain1well" class="well well-success">\n    <form class="form-horizontal">\n      <div class="form-group">\n        <label for="block1chain1number" class="col-sm-2 control-label">Block:</label>\n        <div class="col-sm-10">\n          <div class="input-group">\n            <span class="input-group-addon">#</span>\n            <input id="block1chain1number" type="text" value="1" onkeyup="updateHash(1, 1);" class="form-control"></div>\n          </div></div><div class="form-group">\n            <label for="block1chain1nonce" class="col-sm-2 control-label">Nonce:</label>\n            <div class="col-sm-10"><input id="block1chain1nonce" type="text" value="72608" onkeyup="updateHash(1, 1);" class="form-control"></div>\n          </div><div class="form-group"><label for="block1chain1data" class="col-sm-2 control-label">Data:</label>\n            <div class="col-sm-10">\n              <textarea id="block1chain1data" rows="10" onkeyup="updateHash(1, 1);" class="form-control">\n\n              </textarea></div></div><div id="state" class="form-group">\n                <label for="block1chain1hash" class="col-sm-2 control-label">Hash:</label><div class="col-sm-10">\n                  <input id="block1chain1hash" type="text" disabled="" class="form-control">\n                </div></div><div class="form-group"><div class="col-sm-2">\n                  <i class="icon-spinner icon-spin icon-large">\n\n                  </i></div><div class="col-sm-10">\n                    <button id="block1chain1mineButton" data-style="expand-right" class="btn btn-primary ladda-button">\n                      <span class="ladda-label">Mine</span></button></div></div></form></div> -->'/*ion-inline-end:"/Users/yauhenip/Projects/blueCoin-UI/src/pages/home/home.html"*/
         }),
         __metadata("design:paramtypes", [__WEBPACK_IMPORTED_MODULE_1_ionic_angular__["e" /* NavController */]])
     ], HomePage);
@@ -337,14 +336,14 @@ Object(__WEBPACK_IMPORTED_MODULE_0__angular_platform_browser_dynamic__["a" /* pl
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_5__angular_common_http__ = __webpack_require__(47);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_6__pages_home_home__ = __webpack_require__(206);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_7__pages_tabs_tabs__ = __webpack_require__(205);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_8__pages_wallet_wallet_module__ = __webpack_require__(159);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_8__pages_wallet_wallet_module__ = __webpack_require__(160);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_9__ionic_native_status_bar__ = __webpack_require__(201);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_10__ionic_native_splash_screen__ = __webpack_require__(204);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_11__pages_transactions_transactions_module__ = __webpack_require__(158);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_12__pages_payment_payment__ = __webpack_require__(81);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_13__pages_payment_payment_module__ = __webpack_require__(161);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_11__pages_transactions_transactions_module__ = __webpack_require__(159);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_12__pages_payment_payment__ = __webpack_require__(80);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_13__pages_payment_payment_module__ = __webpack_require__(158);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_14__providers_transaction_service__ = __webpack_require__(41);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_15__providers_wallet_service__ = __webpack_require__(80);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_15__providers_wallet_service__ = __webpack_require__(81);
 var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -385,9 +384,9 @@ var AppModule = /** @class */ (function () {
                 __WEBPACK_IMPORTED_MODULE_5__angular_common_http__["b" /* HttpClientModule */],
                 __WEBPACK_IMPORTED_MODULE_3_ionic_angular__["c" /* IonicModule */].forRoot(__WEBPACK_IMPORTED_MODULE_4__app_component__["a" /* MyApp */], {}, {
                     links: [
+                        { loadChildren: '../pages/payment/payment.module#PaymentPageModule', name: 'PaymentPage', segment: 'payment', priority: 'low', defaultHistory: [] },
                         { loadChildren: '../pages/transactions/transactions.module#TransactionPageModule', name: 'TransactionPage', segment: 'transactions', priority: 'low', defaultHistory: [] },
-                        { loadChildren: '../pages/wallet/wallet.module#WalletPageModule', name: 'WalletPage', segment: 'wallet', priority: 'low', defaultHistory: [] },
-                        { loadChildren: '../pages/payment/payment.module#PaymentPageModule', name: 'PaymentPage', segment: 'payment', priority: 'low', defaultHistory: [] }
+                        { loadChildren: '../pages/wallet/wallet.module#WalletPageModule', name: 'WalletPage', segment: 'wallet', priority: 'low', defaultHistory: [] }
                     ]
                 })
             ],
@@ -445,7 +444,7 @@ var TransactionComponent = /** @class */ (function () {
     }
     TransactionComponent = __decorate([
         Object(__WEBPACK_IMPORTED_MODULE_0__angular_core__["m" /* Component */])({
-            selector: 'transaction',template:/*ion-inline-start:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/components/transaction/transaction.html"*/'<!-- Generated template for the TransactionComponent component -->\n<div>\n  {{text}}\n</div>\n'/*ion-inline-end:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/components/transaction/transaction.html"*/
+            selector: 'transaction',template:/*ion-inline-start:"/Users/yauhenip/Projects/blueCoin-UI/src/components/transaction/transaction.html"*/'<!-- Generated template for the TransactionComponent component -->\n<div>\n  {{text}}\n</div>\n'/*ion-inline-end:"/Users/yauhenip/Projects/blueCoin-UI/src/components/transaction/transaction.html"*/
         }),
         __metadata("design:paramtypes", [String, String, Number])
     ], TransactionComponent);
@@ -491,7 +490,7 @@ var MyApp = /** @class */ (function () {
         });
     }
     MyApp = __decorate([
-        Object(__WEBPACK_IMPORTED_MODULE_0__angular_core__["m" /* Component */])({template:/*ion-inline-start:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/app/app.html"*/'<ion-nav [root]="rootPage"></ion-nav>\n'/*ion-inline-end:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/app/app.html"*/
+        Object(__WEBPACK_IMPORTED_MODULE_0__angular_core__["m" /* Component */])({template:/*ion-inline-start:"/Users/yauhenip/Projects/blueCoin-UI/src/app/app.html"*/'<ion-nav [root]="rootPage"></ion-nav>\n'/*ion-inline-end:"/Users/yauhenip/Projects/blueCoin-UI/src/app/app.html"*/
         }),
         __metadata("design:paramtypes", [__WEBPACK_IMPORTED_MODULE_1_ionic_angular__["g" /* Platform */], __WEBPACK_IMPORTED_MODULE_2__ionic_native_status_bar__["a" /* StatusBar */], __WEBPACK_IMPORTED_MODULE_3__ionic_native_splash_screen__["a" /* SplashScreen */]])
     ], MyApp);
@@ -582,7 +581,7 @@ var TransactionPage = /** @class */ (function () {
     ;
     TransactionPage = __decorate([
         Object(__WEBPACK_IMPORTED_MODULE_0__angular_core__["m" /* Component */])({
-            selector: 'page-transactions',template:/*ion-inline-start:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/pages/transactions/transactions.html"*/'<ion-header>\n  <ion-navbar>\n    <ion-title>\n      Blockchain\n    </ion-title>\n  </ion-navbar>\n</ion-header>\n\n  \n<ion-content padding>\n  <ion-refresher (ionRefresh)="doRefresh($event);">\n    <ion-refresher-content\n      pullingText="Pull to refresh"\n      pullingIcon="arrow-dropdown"\n      refreshingSpinner="circles"\n      refreshingText="...fetching...">\n    </ion-refresher-content>\n  </ion-refresher>\n  <ion-list>\n    <ion-item *ngFor="let transaction of transactions">\n      <ion-card>\n          <ion-card-content>\n              Date: <h4>{{transaction.timestamp}}</h4>\n              Sender: <h4>{{transaction.fromId}}</h4>\n              Receiver: <h4>{{transaction.toId}}</h4>\n              Amount: <h4>{{transaction.amount}}</h4>\n              TransactionId<h4>{{transaction.transactionId}}</h4>\n  </ion-card-content>\n</ion-card>\n  </ion-item>\n  </ion-list>\n</ion-content>'/*ion-inline-end:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/pages/transactions/transactions.html"*/,
+            selector: 'page-transactions',template:/*ion-inline-start:"/Users/yauhenip/Projects/blueCoin-UI/src/pages/transactions/transactions.html"*/'<ion-header>\n  <ion-navbar>\n    <ion-title>\n      Blockchain\n    </ion-title>\n  </ion-navbar>\n</ion-header>\n\n  \n<ion-content padding>\n  <ion-refresher (ionRefresh)="doRefresh($event);">\n   <ion-refresher-content\n      pullingText="Pull to refresh"\n      pullingIcon="arrow-dropdown"\n      refreshingSpinner="circles"\n      refreshingText="...fetching...">\n    </ion-refresher-content>\n  </ion-refresher>\n  <ion-list>\n    <ion-item *ngFor="let transaction of transactions">\n      <ion-card>\n          <ion-card-content>\n              Date: <h4>{{transaction.timestamp}}</h4>\n              Sender: <h4>{{transaction.fromId}}</h4>\n              Receiver: <h4>{{transaction.toId}}</h4>\n              Amount: <h4>{{transaction.amount}}</h4>\n              TransactionId<h4>{{transaction.transactionId}}</h4>\n  </ion-card-content>\n</ion-card>\n  </ion-item>\n  </ion-list>\n</ion-content>'/*ion-inline-end:"/Users/yauhenip/Projects/blueCoin-UI/src/pages/transactions/transactions.html"*/,
         }),
         __metadata("design:paramtypes", [__WEBPACK_IMPORTED_MODULE_1_ionic_angular__["e" /* NavController */], __WEBPACK_IMPORTED_MODULE_1_ionic_angular__["f" /* NavParams */], __WEBPACK_IMPORTED_MODULE_2__providers_transaction_service__["a" /* TransactionService */]])
     ], TransactionPage);
@@ -597,43 +596,6 @@ var TransactionPage = /** @class */ (function () {
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
-/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return WalletService; });
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__angular_core__ = __webpack_require__(0);
-/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__angular_common_http__ = __webpack_require__(47);
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-var __metadata = (this && this.__metadata) || function (k, v) {
-    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
-};
-
-
-var WalletService = /** @class */ (function () {
-    function WalletService(http) {
-        this.http = http;
-        this.API = 'http://localhost:8080';
-    }
-    WalletService.prototype.getWalletAmount = function () {
-        return this.http.get(this.API + '/wallets');
-    };
-    WalletService = __decorate([
-        Object(__WEBPACK_IMPORTED_MODULE_0__angular_core__["A" /* Injectable */])(),
-        __metadata("design:paramtypes", [__WEBPACK_IMPORTED_MODULE_1__angular_common_http__["a" /* HttpClient */]])
-    ], WalletService);
-    return WalletService;
-}());
-
-//# sourceMappingURL=wallet-service.js.map
-
-/***/ }),
-
-/***/ 81:
-/***/ (function(module, __webpack_exports__, __webpack_require__) {
-
-"use strict";
 /* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return PaymentPage; });
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__angular_core__ = __webpack_require__(0);
 /* harmony import */ var __WEBPACK_IMPORTED_MODULE_1_ionic_angular__ = __webpack_require__(18);
@@ -677,7 +639,7 @@ var PaymentPage = /** @class */ (function () {
     };
     PaymentPage = __decorate([
         Object(__WEBPACK_IMPORTED_MODULE_0__angular_core__["m" /* Component */])({
-            selector: 'page-payment',template:/*ion-inline-start:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/pages/payment/payment.html"*/'<ion-header>\n  <ion-navbar>\n    <ion-title>BlueCoin</ion-title>\n  </ion-navbar>\n</ion-header>\n\n<ion-content padding>\n    <div padding>\n   </div>\n  <ion-item>\n     \n           <ion-label color="primary" stacked>Please select your ID</ion-label>\n      <!-- <ion-input type="string" [(ngModel)]="trans.fromId"></ion-input> // Can type ID manually-->\n    \n          <ion-select [(ngModel)]="trans.fromId">\n            <ion-option value="15b9ef7d26485fae2ecdc74f8f9f465e0c082fe19a996aef2f1daf712aec5751">Vince</ion-option>\n            <ion-option value="9e3123b4c696cb7d9d906a6ec2813d6e6fed5af58b49c4e5f849b7adcb00486c">Tennessee</ion-option>\n            <ion-option value="625ef69f8ef7318876d5c5e31c045f4cc2c89ec01949a3af3789be1f45405342">Mexi</ion-option>\n            <ion-option value="9b1e8a94fcdb88c8391ec1200718b3ddd73fb631b9c6b5d56619852a47833665">Eugene</ion-option>\n            <ion-option value="4b2166f22897c2e85fbab852ae252ee2990231d9692aa7fcc8535cf74c571efd">Clement</ion-option>\n          </ion-select>\n        </ion-item>\n    \n    \n    <ion-item>\n        <ion-label color="primary" stacked>Who would you like to receive BlueCoin?</ion-label>\n        <!-- <ion-input type="string"[(ngModel)]="trans.fromId"></ion-input> Can type ID mamaully-->\n        <ion-select [(ngModel)]="trans.toId">\n            <ion-option value="15b9ef7d26485fae2ecdc74f8f9f465e0c082fe19a996aef2f1daf712aec5751">Vince</ion-option>\n            <ion-option value="9e3123b4c696cb7d9d906a6ec2813d6e6fed5af58b49c4e5f849b7adcb00486c">Tennessee</ion-option>\n            <ion-option value="625ef69f8ef7318876d5c5e31c045f4cc2c89ec01949a3af3789be1f45405342">Mexi</ion-option>\n            <ion-option value="9b1e8a94fcdb88c8391ec1200718b3ddd73fb631b9c6b5d56619852a47833665">Eugene</ion-option>\n            <ion-option value="4b2166f22897c2e85fbab852ae252ee2990231d9692aa7fcc8535cf74c571efd">Clement</ion-option>\n          </ion-select>\n      </ion-item>\n\n      <ion-item>\n          <ion-label color="primary" stacked>Amount</ion-label>\n          <ion-input type="number" placeholder="Enter Amount" [(ngModel)]="trans.amount" ></ion-input>\n        </ion-item>\n\n        <button ion-button (click) = "transferMoney()">Send BlueCoin</button>\n</ion-content>'/*ion-inline-end:"/Users/tennesseeg/blueCoin/blueCoin-UI/src/pages/payment/payment.html"*/,
+            selector: 'page-payment',template:/*ion-inline-start:"/Users/yauhenip/Projects/blueCoin-UI/src/pages/payment/payment.html"*/'<ion-header>\n  <ion-navbar>\n    <ion-title>BlueCoin</ion-title>\n  </ion-navbar>\n</ion-header>\n\n<ion-content padding>\n    <div padding>\n   </div>\n  <ion-item>\n     \n           <ion-label color="primary" stacked>Please select your ID</ion-label>\n      <!-- <ion-input type="string" [(ngModel)]="trans.fromId"></ion-input> // Can type ID manually-->\n    \n          <ion-select [(ngModel)]="trans.fromId" interface="popover">\n            <ion-option value="15b9ef7d26485fae2ecdc74f8f9f465e0c082fe19a996aef2f1daf712aec5751">Vince</ion-option>\n            <ion-option value="9e3123b4c696cb7d9d906a6ec2813d6e6fed5af58b49c4e5f849b7adcb00486c">Tennessee</ion-option>\n            <ion-option value="625ef69f8ef7318876d5c5e31c045f4cc2c89ec01949a3af3789be1f45405342">Mexi</ion-option>\n            <ion-option value="9b1e8a94fcdb88c8391ec1200718b3ddd73fb631b9c6b5d56619852a47833665">Eugene</ion-option>\n            <ion-option value="4b2166f22897c2e85fbab852ae252ee2990231d9692aa7fcc8535cf74c571efd">Clement</ion-option>\n          </ion-select>\n        </ion-item>\n    \n    \n    <ion-item>\n        <ion-label color="primary" stacked>Who would you like to receive BlueCoin?</ion-label>\n        <!-- <ion-input type="string"[(ngModel)]="trans.fromId"></ion-input> Can type ID mamaully-->\n        <ion-select [(ngModel)]="trans.toId" interface="popover">\n            <ion-option value="15b9ef7d26485fae2ecdc74f8f9f465e0c082fe19a996aef2f1daf712aec5751">Vince</ion-option>\n            <ion-option value="9e3123b4c696cb7d9d906a6ec2813d6e6fed5af58b49c4e5f849b7adcb00486c">Tennessee</ion-option>\n            <ion-option value="625ef69f8ef7318876d5c5e31c045f4cc2c89ec01949a3af3789be1f45405342">Mexi</ion-option>\n            <ion-option value="9b1e8a94fcdb88c8391ec1200718b3ddd73fb631b9c6b5d56619852a47833665">Eugene</ion-option>\n            <ion-option value="4b2166f22897c2e85fbab852ae252ee2990231d9692aa7fcc8535cf74c571efd">Clement</ion-option>\n          </ion-select>\n      </ion-item>\n\n      <ion-item>\n          <ion-label color="primary" stacked>Amount</ion-label>\n          <ion-input type="number" placeholder="Enter Amount" [(ngModel)]="trans.amount" interface="popover"></ion-input>\n        </ion-item>\n\n        <button ion-button (click) = "transferMoney()">Send BlueCoin</button>\n</ion-content>'/*ion-inline-end:"/Users/yauhenip/Projects/blueCoin-UI/src/pages/payment/payment.html"*/,
         }),
         __metadata("design:paramtypes", [__WEBPACK_IMPORTED_MODULE_1_ionic_angular__["e" /* NavController */], __WEBPACK_IMPORTED_MODULE_1_ionic_angular__["f" /* NavParams */], __WEBPACK_IMPORTED_MODULE_2__angular_common_http__["a" /* HttpClient */], __WEBPACK_IMPORTED_MODULE_3__providers_transaction_service__["a" /* TransactionService */]])
     ], PaymentPage);
@@ -686,6 +648,43 @@ var PaymentPage = /** @class */ (function () {
 
 //# sourceMappingURL=payment.js.map
 
+/***/ }),
+
+/***/ 81:
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "a", function() { return WalletService; });
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_0__angular_core__ = __webpack_require__(0);
+/* harmony import */ var __WEBPACK_IMPORTED_MODULE_1__angular_common_http__ = __webpack_require__(47);
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = (this && this.__metadata) || function (k, v) {
+    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+
+
+var WalletService = /** @class */ (function () {
+    function WalletService(http) {
+        this.http = http;
+        this.API = 'http://localhost:8080';
+    }
+    WalletService.prototype.getWalletAmount = function () {
+        return this.http.get(this.API + '/wallets');
+    };
+    WalletService = __decorate([
+        Object(__WEBPACK_IMPORTED_MODULE_0__angular_core__["A" /* Injectable */])(),
+        __metadata("design:paramtypes", [__WEBPACK_IMPORTED_MODULE_1__angular_common_http__["a" /* HttpClient */]])
+    ], WalletService);
+    return WalletService;
+}());
+
+//# sourceMappingURL=wallet-service.js.map
+
 /***/ })
 
 },[207]);