changes on side-menu. Remove old info box. fixes for txs on searchbar

5apps · Jan 10, 2019 · 5306a1e · 5306a1e
1 parent 0eac2ab
commit 5306a1e
Show file tree

Hide file tree

Showing 12 changed files with 347 additions and 122 deletions.
diff --git a/packages/insight-previous/src/app/app.component.ts b/packages/insight-previous/src/app/app.component.ts
@@ -19,7 +19,7 @@ export class InsightApp {
   private status: StatusBar;
 
   public rootPage: any;
-  public pages: Array<{ title: string; component: any }>;
+  public pages: Array<{ title: string; component: any; icon: any; }>;
 
   constructor(
     platform: Platform,
@@ -34,9 +34,9 @@ export class InsightApp {
 
     // set our app's pages
     this.pages = [
-      { title: 'Home', component: 'home' },
-      { title: 'Blocks', component: 'blocks' },
-      { title: 'Broadcast Transaction', component: 'BroadcastTxPage' }
+      { title: 'Home', component: 'home', icon: 'home' },
+      { title: 'Blocks', component: 'blocks', icon: 'logo-buffer' },
+      { title: 'Broadcast Transaction', component: 'BroadcastTxPage', icon: 'ios-radio-outline' }
     ];
   }
 

diff --git a/packages/insight-previous/src/app/app.html b/packages/insight-previous/src/app/app.html
@@ -1,13 +1,39 @@
 <ion-menu [content]="content">
+  <ion-header>
 
+    <ion-navbar color="brand" class="menu-title">
+      <button ion-button menuToggle>
+        <ion-icon name="menu"></ion-icon>
+      </button>
+      <ion-title class="logo-header">insight</ion-title>
+      <ion-buttons end>
+        <button ion-button (click)="changeCurrency($event)">
+        </button>
+      </ion-buttons>
+    </ion-navbar>
+  </ion-header>
   <ion-content>
     <ion-list>
       <button ion-item *ngFor="let p of pages" (click)="openPage(p)">
-        {{p.title}}
+        <ion-icon name="{{p.icon}}"></ion-icon>
+        &nbsp;{{p.title}}
       </button>
     </ion-list>
   </ion-content>
+  <ion-footer>
+    <div class="footer-title">
+      View more on:
+    </div>
+    <div class="about">
+      <a href="https://github.com/bitpay/bitcore/tree/master/packages/insight-previous" target="_blank">
+        <ion-icon name="custom-github"></ion-icon>
+      </a>
+      <a href="https://bitpay.com/" target="_blank">
+        <ion-icon name="custom-bitpay"></ion-icon>
+      </a>
+    </div>
+  </ion-footer>
 
 </ion-menu>
 
-<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>
+<ion-nav [root]="rootPage" #content swipeBackEnabled="false"></ion-nav>
diff --git a/packages/insight-previous/src/app/app.scss b/packages/insight-previous/src/app/app.scss
@@ -76,6 +76,58 @@ a {
   }
 }
 
+ion-icon {
+  &[class*="custom-"] {
+    mask-size: contain;
+    mask-position: 50% 50%;
+    mask-repeat: no-repeat;
+    width: 6rem;
+    height: 6rem;
+  }
+
+  &[class*="custom-github"] {
+    mask-image: url(../assets/img/github.svg);
+    background: #263238;
+  }
+  &[class*="custom-bitpay"] {
+    mask-image: url(../assets/img/bitpay.svg);
+    background: #293b92;
+  }
+}
+
+
+ion-title {
+  &.logo-header {
+    .toolbar-title{
+      color: white;
+      font-weight: 700;
+      font-style: italic;
+      font-size: 2em;
+    }
+  }
+}
+.menu-inner >
+  ion-content{
+    position: relative;
+  }
+
+ion-footer{
+  height: 7rem;
+  display: flex;
+  flex-direction: column;
+  .footer-title{
+    display: flex;
+    width: 100%;
+    padding: 5px 0 0 16px;
+  }
+  .about{
+    display: flex;
+    justify-content: space-around;
+    width: 100%; 
+    align-self: center;
+    height: 100%;
+  }
+}
 // Shared Sass variables, which can be used to adjust Ionic's
 // default Sass variables, belong in "theme/variables.scss".
 //

diff --git a/packages/insight-previous/src/assets/img/angularjs.png b/packages/insight-previous/src/assets/img/angularjs.png
diff --git a/packages/insight-previous/src/assets/img/bitcore.svg b/packages/insight-previous/src/assets/img/bitcore.svg