Adds donate component

Adds FAB to dashboard
Adds slack to sidebar

web/src/app/app-routing.module.ts

@@ -3,6 +3,7 @@ import { SettingsComponent } from './pages/settings/settings.component';
 import { AboutComponent } from './pages/about/about.component';
 import { DashboardComponent } from './pages/dashboard/dashboard.component';
 import { WalletComponent } from './pages/wallet/wallet.component';
+import { DonateComponent } from './pages/donate/donate.component';
 
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
@@ -28,6 +29,11 @@ const routes: Routes = [
         path: 'wallet',
         component: WalletComponent
     }
+    ,
+    {
+        path: 'donate',
+        component: DonateComponent
+    }
 
 ];
 

web/src/app/app.component.html

@@ -39,6 +39,12 @@
           <h3>Trello</h3>
         </a>
       </mat-list-item>
+      <mat-list-item>
+          <mat-icon>apps</mat-icon>&nbsp;
+          <a href="https://gocryptotrader.herokuapp.com/" target="_blank">
+            <h3>Slack</h3>
+          </a>
+        </mat-list-item>
       <mat-list-item>
         <mat-icon>bug_report</mat-icon>&nbsp;
         <a href="https://github.com/thrasher-/gocryptotrader/issues/new" target="_blank">

web/src/app/app.component.scss

@@ -1,5 +1,6 @@
 .container {
-    height: 100vmax;
+    min-height: 100vh;
+    height:100%;
 }
 
 .main {
@@ -17,6 +18,7 @@
     width: 14%;
     position: fixed;
     margin-top: 4rem;
+    
 }
 
 .navbar {
@@ -43,4 +45,8 @@
 
 .settings-highlight {
     color: magenta !important;
+}
+
+.donate-highlight {
+    color: goldenrod!important;
 }

web/src/app/app.module.ts

@@ -33,6 +33,8 @@ import { AboutComponent } from './pages/about/about.component';
 import { SettingsComponent } from './pages/settings/settings.component';
 import { DashboardComponent } from './pages/dashboard/dashboard.component';
 import { WalletComponent } from './pages/wallet/wallet.component';
+import { DonateComponent } from './pages/donate/donate.component';
+
 //Shared
 import { NavbarComponent } from './shared/navbar/navbar.component';
 import { ExchangeCurrencyTickerComponent } from './shared/exchange-currency-ticker/exchange-currency-ticker.component';
@@ -58,7 +60,6 @@ import { PriceHistoryComponent } from './shared/price-history/price-history.comp
 import { MyOrdersComponent } from './shared/my-orders/my-orders.component';
 import { OrdersComponent } from './shared/orders/orders.component';
 import { BuySellComponent } from './shared/buy-sell/buy-sell.component';
-import { DonateComponent } from './shared/donate/donate.component';
 import { SelectedCurrencyComponent } from './shared/selected-currency/selected-currency.component';
 
 

web/src/app/pages/dashboard/dashboard.component.html

@@ -1,3 +1,6 @@
+<button (click)="tradeOpen()" mat-fab color="accent" class="mat-fab mat-fab-bottom-right"><mat-icon >swap_horiz</mat-icon></button>
+
+<div style="width:97%;">
 <mat-grid-list cols="3" rowHeight="24rem">
     <mat-grid-tile [colspan]="tile.columns" [rowspan]="tile.rows" *ngFor="let tile of dashboard.tiles">
         <mat-card class="full-card">
@@ -14,4 +17,5 @@
             </mat-card-footer>
         </mat-card>
     </mat-grid-tile>
-</mat-grid-list>
+</mat-grid-list>
+</div>

web/src/app/pages/dashboard/dashboard.component.scss

@@ -11,4 +11,13 @@
 .mat-card-footer {
     position: absolute;
     bottom: 24px;
-}
+}
+
+.mat-fab {
+    top: auto;
+    right: 30px;
+    bottom: 20px;
+    left: auto;
+    position: fixed;
+    z-index: 3;
+}

web/src/app/pages/donate/donate.component.html

@@ -0,0 +1,19 @@
+ <mat-card class="full-card">
+    <mat-card-header>
+        <mat-card-title>Donations</mat-card-title>
+        <mat-card-subtitle>We give our thanks</mat-card-subtitle>
+    </mat-card-header>
+    <mat-card-content>
+        <div style="margin: 0px auto" >
+        <img src="/assets/early-dumb-donate.png"/>
+    </div>
+<p>If this framework helped you in any way, or you would like to support the developers working on it, please donate</p>
+<mat-list>
+    <mat-list-item >
+        <mat-icon mat-list-icon class="BTC">attach_money</mat-icon>
+        <h4 mat-line>Address:</h4>
+        <h4 mat-line>1F5zVDgNjorJ51oGebSvNCrSAHpwGkUdDB</h4>
+    </mat-list-item>
+    </mat-list>
+    </mat-card-content>
+</mat-card>

web/src/app/pages/donate/donate.component.scss

@@ -0,0 +1,8 @@
+.BTC {
+    color:orange;
+}
+
+.full-card {
+    width: 80%;
+    margin: 0px auto !important;
+}

web/src/app/pages/settings/settings.component.html

@@ -64,11 +64,11 @@
                     </mat-form-field>
                     <div mat-line></div>
                     <mat-panel-description>
-                        Enabled Currency pairs {{enabledCurrencies.selectedOptions.selected.length}}
+                        Enabled Currency pairs {{enabledCurrencies.selectedOptions.selected.length}} - Managed via config temporarily
                     </mat-panel-description>
                     <div mat-line></div>
                     <mat-selection-list #enabledCurrencies>
-                            <mat-list-option [disabled]="!exchange.Enabled" *ngFor="let currency of exchange.AvailablePairs.split(',')">
+                            <mat-list-option [disabled]="!exchange.Enabled || true" *ngFor="let currency of exchange.AvailablePairs.split(',')">
                               {{currency}}
                             </mat-list-option>
                           </mat-selection-list>

web/src/app/shared/donate/donate.component.html

@@ -1 +0,0 @@
-<button mat-button>Donate!</button>