<!--<mat-tab-group [selectedIndex]="1" mat-stretch-tabs>-->
<!--  &lt;!&ndash;<mat-tab>&ndash;&gt;-->
<!--  &lt;!&ndash;<ng-template matTabLabel>Today</ng-template>&ndash;&gt;-->
<!--  &lt;!&ndash;<div class="scroll">&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-list class="pt-1 pb-1">&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<div fxLayout="column">&ndash;&gt;-->
<!--  &lt;!&ndash;<h1 class="ma-0">{{ today | date:'EEEE' }}</h1>&ndash;&gt;-->
<!--  &lt;!&ndash;<h3 class="mat-text-muted ma-0"><span>{{ today | date:'dd' }}</span>&nbsp;<span>{{ today | date:'MMMM' }}</span></h3>&ndash;&gt;-->
<!--  &lt;!&ndash;</div>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-list>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-nav-list>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-divider></mat-divider>&ndash;&gt;-->
<!--  &lt;!&ndash;<h3 mat-subheader class="text-uppercase font-weight-bold">Stocks</h3>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<a matLine href="javascript:;">NASDAQ</a>&ndash;&gt;-->
<!--  &lt;!&ndash;<span class="mat-text-muted text-md mr-xs ml-xs">4,492.87</span>&ndash;&gt;-->
<!--  &lt;!&ndash;<span>-0.29%</span>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<a matLine href="javascript:;">NYSE</a>&ndash;&gt;-->
<!--  &lt;!&ndash;<span class="mat-text-muted text-md mr-xs ml-xs">10,692.07</span>&ndash;&gt;-->
<!--  &lt;!&ndash;<span>-0.53%</span>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<a matLine href=javascript:;>DOW J</a>&ndash;&gt;-->
<!--  &lt;!&ndash;<span class="mat-text-muted text-md mr-xs ml-xs">17,046.81</span>&ndash;&gt;-->
<!--  &lt;!&ndash;<span>-0.14%</span>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<a matLine href="javascript:;">APPL</a>&ndash;&gt;-->
<!--  &lt;!&ndash;<span class="mat-text-muted text-md mr-xs ml-xs">100,89</span>&ndash;&gt;-->
<!--  &lt;!&ndash;<span>+0.75%</span>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-divider></mat-divider>&ndash;&gt;-->
<!--  &lt;!&ndash;<h3 mat-subheader class="text-uppercase font-weight-bold">Weather</h3>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<a matLine href="javascript:;">{{ today | date:'shortTime' }}</a>&ndash;&gt;-->
<!--  &lt;!&ndash;<p matLine class="mat-text-muted">London</p>&ndash;&gt;-->
<!--  &lt;!&ndash;<span class="mat-h1 mr-1">&ndash;&gt;-->
<!--  &lt;!&ndash;<span class="pe-is-w-blizzard"></span>&ndash;&gt;-->
<!--  &lt;!&ndash;</span>&ndash;&gt;-->
<!--  &lt;!&ndash;<span class="mat-h1">26°</span>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-divider></mat-divider>&ndash;&gt;-->
<!--  &lt;!&ndash;<h3 mat-subheader class="text-uppercase font-weight-bold">Todo</h3>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<a matLine href="javascript:;">Learn Angular 2.0</a>&ndash;&gt;-->
<!--  &lt;!&ndash;<p matLine class="mat-text-muted text-md">2:45PM</p>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<a matLine href="javascript:;">Learn Angular Material</a>&ndash;&gt;-->
<!--  &lt;!&ndash;<p matLine class="mat-text-muted text-md">3:20PM</p>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<a matLine href="javascript:;">Write documentation</a>&ndash;&gt;-->
<!--  &lt;!&ndash;<p matLine class="mat-text-muted text-md">6:00PM</p>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-divider class="mt-xs mb-xs"></mat-divider>&ndash;&gt;-->
<!--  &lt;!&ndash;<h3 mat-subheader class="text-uppercase font-weight-bold">Stats</h3>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<p class="text-md" matLine>Local Storage (4023 / 10690)</p>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-progress-bar  matLine mode="determinate" color="warn" value="40"></mat-progress-bar>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<p class="text-md" matLine>Cloud Storage (700 / 1030)</p>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-progress-bar  matLine mode="determinate" color="accent" value="70"></mat-progress-bar>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;<p class="text-md" matLine>Local Storage (20 / 100)</p>&ndash;&gt;-->
<!--  &lt;!&ndash;<mat-progress-bar  matLine mode="determinate" value="20"></mat-progress-bar>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-nav-list>&ndash;&gt;-->
<!--  &lt;!&ndash;</div>&ndash;&gt;-->
<!--  &lt;!&ndash;</mat-tab>&ndash;&gt;-->
<!--  &lt;!&ndash;// **********************************************************&ndash;&gt;-->
<!--  <mat-tab>-->
<!--    <ng-template matTabLabel>Notifications</ng-template>-->
<!--    <div class="scroll">-->
<!--      <mat-nav-list *ngIf="userMessages" >-->
<!--        &lt;!&ndash;<mat-list-item *ngFor="let test of userMessages.$toArray">&ndash;&gt;-->
<!--        &lt;!&ndash;<h1 matLine>{{test['attributes']['title']}}</h1>&ndash;&gt;-->
<!--        &lt;!&ndash;<p matLine>{{test['attributes']['body']}}</p>&ndash;&gt;-->
<!--        &lt;!&ndash;</mat-list-item >&ndash;&gt;-->
<!--        &lt;!&ndash;**********&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-nav-list *ngFor="let message of userMessages.$toArray">&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;{{message.title}}&ndash;&gt;-->
<!--        &lt;!&ndash;{{message.body}}&ndash;&gt;-->
<!--        &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;***************&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<h4 matLine>{{(message | async)?.notification.title}}</h4>&ndash;&gt;-->
<!--        &lt;!&ndash;&lt;!&ndash;<img [src]="(message | async).notification" width="100px">&ndash;&gt;&ndash;&gt;-->
<!--        &lt;!&ndash;<p matLine> {{(message | async)?.notification.body}}</p>&ndash;&gt;-->
<!--        &lt;!&ndash;&lt;!&ndash;{{message | async | json}}&ndash;&gt;&ndash;&gt;-->
<!--        &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;***************&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-list-item *ngFor="let zahra of message">&ndash;&gt;-->
<!--        &lt;!&ndash;<h4 matLine>{{zahra.notification.title}}</h4>&ndash;&gt;-->
<!--        &lt;!&ndash;<p matLine>{{zahra.notification.body}}</p>&ndash;&gt;-->
<!--        &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-list-item *ngFor="let messages of message">&ndash;&gt;-->
<!--        &lt;!&ndash;&lt;!&ndash;<mat-icon mat-list-avatar class="mat-text-primary">people</mat-icon>&ndash;&gt;&ndash;&gt;-->
<!--        &lt;!&ndash;&lt;!&ndash;<h4 matLine>Social</h4>&ndash;&gt;&ndash;&gt;-->
<!--        &lt;!&ndash;&lt;!&ndash;<p matLine>Ligula Purus Adipiscing</p>&ndash;&gt;&ndash;&gt;-->
<!--        &lt;!&ndash;<h1>{{(message | async)?.notification.title}}</h1>&ndash;&gt;-->
<!--        &lt;!&ndash;<p>{{(message | async)?.notification.body}}</p>&ndash;&gt;-->
<!--        &lt;!&ndash;{{message | async | json}}&ndash;&gt;-->
<!--        &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-icon mat-list-avatar class="mat-text-warn">local_offer</mat-icon>&ndash;&gt;-->
<!--        &lt;!&ndash;<h4 matLine>Promotions</h4>&ndash;&gt;-->
<!--        &lt;!&ndash;<p matLine>Etiam Ligula Dapibus</p>&ndash;&gt;-->
<!--        &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-icon mat-list-avatar class="mat-text-accent">info</mat-icon>&ndash;&gt;-->
<!--        &lt;!&ndash;<h4 matLine>Updates</h4>&ndash;&gt;-->
<!--        &lt;!&ndash;<p matLine>Sollicitudin Euismod Fringilla</p>&ndash;&gt;-->
<!--        &lt;!&ndash;</mat-list-item>&ndash;&gt;-->

<!--        &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-icon mat-list-avatar class="mat-indigo">delete_sweep</mat-icon>&ndash;&gt;-->
<!--        &lt;!&ndash;<h4 matLine>Removed 6 items from task list</h4>&ndash;&gt;-->
<!--        &lt;!&ndash;<span class="text-md mat-text-muted" matLine>{{ 1427207139000 | date: 'fullDate' }}</span>&ndash;&gt;-->
<!--        &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-icon mat-list-avatar>check_circle</mat-icon>&ndash;&gt;-->
<!--        &lt;!&ndash;<h4 matLine>Completed 2 projects</h4>&ndash;&gt;-->
<!--        &lt;!&ndash;<span class="text-md mat-text-muted" matLine>{{ 1427412725000 | date: 'fullDate' }}</span>&ndash;&gt;-->
<!--        &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-icon mat-list-avatar>notifications_paused</mat-icon>&ndash;&gt;-->
<!--        &lt;!&ndash;<h4 matLine>Muted notifications</h4>&ndash;&gt;-->
<!--        &lt;!&ndash;<span class="text-md mat-text-muted" matLine>{{ 1427546580000 | date: 'fullDate' }}</span>&ndash;&gt;-->
<!--        &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-icon mat-list-avatar>person_add</mat-icon>&ndash;&gt;-->
<!--        &lt;!&ndash;<h4 matLine>Added Joel to contact list</h4>&ndash;&gt;-->
<!--        &lt;!&ndash;<span class="text-md mat-text-muted" matLine>{{ 1428275520000 | date: 'fullDate' }}</span>&ndash;&gt;-->
<!--        &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-icon mat-list-avatar>phone_missed</mat-icon>&ndash;&gt;-->
<!--        &lt;!&ndash;<h4 matLine>Missed live call from Ellie</h4>&ndash;&gt;-->
<!--        &lt;!&ndash;<span class="text-md mat-text-muted" matLine>{{ 1428830580000 | date: 'fullDate' }}</span>&ndash;&gt;-->
<!--        &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-list-item>&ndash;&gt;-->
<!--        &lt;!&ndash;<mat-icon mat-list-avatar>group_add</mat-icon>&ndash;&gt;-->
<!--        &lt;!&ndash;<h4 matLine>You've been added to HR group</h4>&ndash;&gt;-->
<!--        &lt;!&ndash;<span class="text-md mat-text-muted" matLine>{{ 1429363920000 | date: 'fullDate' }}</span>&ndash;&gt;-->
<!--        &lt;!&ndash;</mat-list-item>&ndash;&gt;-->
<!--      </mat-nav-list>-->
<!--    </div>-->
<!--  </mat-tab>-->
<!--</mat-tab-group>-->
