Pear-Trading/FoodLoop-Web
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Remove widgets module as unused

Browse source
This commit is contained in:
Tom Bloor 2017-08-16 16:05:47 +01:00
parent eee8f8e949
commit ee7b81ad3c
4 changed files with 0 additions and 1395 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
src/app/widgets/widgets-routing.module.ts
View file

@ -1,20 +0,0 @@
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { WidgetsComponent } from './widgets.component';
const routes: Routes = [
{
path: '',
component: WidgetsComponent,
data: {
title: 'Widgets'
}
}
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule]
})
export class WidgetsRoutingModule {}

975
src/app/widgets/widgets.component.html
View file

@ -1,975 +0,0 @@
<div class="animated fadeIn">
<div class="row">
<div class="col-sm-6 col-lg-3">
<div class="card card-inverse card-primary">
<div class="card-block pb-0">
<div class="btn-group float-right" dropdown>
<button type="button" class="btn btn-transparent dropdown-toggle p-0" dropdownToggle>
<i class="icon-settings"></i>
</button>
<div class="dropdown-menu dropdown-menu-right" *dropdownMenu>
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</div>
<h4 class="mb-0">9.823</h4>
<p>Members online</p>
</div>
<div class="chart-wrapper px-3" style="height:70px;">
<canvas baseChart class="chart"
[datasets]="lineChart1Data"
[labels]="lineChart1Labels"
[options]="lineChart1Options"
[colors]="lineChart1Colours"
[legend]="lineChart1Legend"
[chartType]="lineChart1Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-lg-3">
<div class="card card-inverse card-info">
<div class="card-block pb-0">
<button type="button" class="btn btn-transparent p-0 float-right">
<i class="icon-location-pin"></i>
</button>
<h4 class="mb-0">9.823</h4>
<p>Members online</p>
</div>
<div class="chart-wrapper px-3" style="height:70px;">
<canvas baseChart class="chart"
[datasets]="lineChart2Data"
[labels]="lineChart2Labels"
[options]="lineChart2Options"
[colors]="lineChart2Colours"
[legend]="lineChart2Legend"
[chartType]="lineChart2Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-lg-3">
<div class="card card-inverse card-warning">
<div class="card-block pb-0">
<div class="btn-group float-right">
<button type="button" class="btn btn-transparent dropdown-toggle p-0" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="icon-settings"></i>
</button>
<div class="dropdown-menu dropdown-menu-right">
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</div>
<h4 class="mb-0">9.823</h4>
<p>Members online</p>
</div>
<div class="chart-wrapper" style="height:70px;">
<canvas baseChart class="chart"
[datasets]="lineChart3Data"
[labels]="lineChart3Labels"
[options]="lineChart3Options"
[colors]="lineChart3Colours"
[legend]="lineChart3Legend"
[chartType]="lineChart3Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-lg-3">
<div class="card card-inverse card-danger">
<div class="card-block pb-0">
<div class="btn-group float-right" dropdown>
<button type="button" class="btn btn-transparent dropdown-toggle p-0" dropdownToggle>
<i class="icon-settings"></i>
</button>
<div class="dropdown-menu dropdown-menu-right" *dropdownMenu>
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</div>
<h4 class="mb-0">9.823</h4>
<p>Members online</p>
</div>
<div class="chart-wrapper px-3" style="height:70px;">
<canvas baseChart class="chart"
[datasets]="barChart1Data"
[labels]="barChart1Labels"
[options]="barChart1Options"
[colors]="barChart1Colours"
[legend]="barChart1Legend"
[chartType]="barChart1Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div><!--/.col-->
</div><!--/.row-->
<div class="row">
<div class="col-sm-6 col-lg-3">
<div class="card">
<div class="card-header card-header-inverse card-header-primary">
<div class="font-weight-bold">
<span>Money spent this week</span>
<span class="float-right">$1.890,65</span>
</div>
<div>
<span>
<small>Today 6:43 AM</small>
</span>
<span class="float-right">
<small>+432,50 (15,78%)</small>
</span>
</div>
<div class="chart-wrapper" style="height:38px;">
<canvas baseChart class="chart"
[datasets]="lineChart4Data"
[labels]="lineChart4Labels"
[options]="lineChart4Options"
[colors]="lineChart4Colours"
[legend]="lineChart4Legend"
[chartType]="lineChart4Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
<div class="chart-wrapper" style="height:38px;">
<canvas baseChart class="chart"
[datasets]="barChart2Data"
[labels]="barChart2Labels"
[options]="barChart2Options"
[colors]="barChart2Colours"
[legend]="barChart2Legend"
[chartType]="barChart2Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="card">
<div class="card-header card-header-inverse card-header-danger">
<div class="font-weight-bold">
<span>Money spent last week</span>
<span class="float-right">$1.890,65</span>
</div>
<div>
<span>
<small>Today 6:43 AM</small>
</span>
<span class="float-right">
<small>+432,50 (15,78%)</small>
</span>
</div>
<div class="chart-wrapper" style="height:38px;">
<canvas baseChart class="chart"
[datasets]="lineChart5Data"
[labels]="lineChart5Labels"
[options]="lineChart5Options"
[colors]="lineChart4Colours"
[legend]="lineChart5Legend"
[chartType]="lineChart5Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
<div class="chart-wrapper" style="height:38px;">
<canvas baseChart class="chart"
[datasets]="barChart3Data"
[labels]="barChart3Labels"
[options]="barChart3Options"
[colors]="barChart2Colours"
[legend]="barChart3Legend"
[chartType]="barChart3Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="card">
<div class="card-header card-header-inverse card-header-success">
<div class="font-weight-bold">
<span>SALE</span>
<span class="float-right">$1.890,65</span>
</div>
<div>
<span>
<small>Today 6:43 AM</small>
</span>
<span class="float-right">
<small>+432,50 (15,78%)</small>
</span>
</div>
<div class="chart-wrapper" style="height:38px;">
<canvas baseChart class="chart"
[datasets]="lineChart4Data"
[labels]="lineChart4Labels"
[options]="lineChart4Options"
[colors]="lineChart4Colours"
[legend]="lineChart4Legend"
[chartType]="lineChart4Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
<div class="chart-wrapper" style="height:38px;">
<canvas baseChart class="chart"
[datasets]="barChart2Data"
[labels]="barChart2Labels"
[options]="barChart2Options"
[colors]="barChart2Colours"
[legend]="barChart2Legend"
[chartType]="barChart2Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="card">
<div class="card-header card-header-inverse card-header-warning">
<div class="font-weight-bold">
<span>SALE</span>
<span class="float-right">$1.890,65</span>
</div>
<div>
<span>
<small>Today 6:43 AM</small>
</span>
<span class="float-right">
<small>+432,50 (15,78%)</small>
</span>
</div>
<div class="chart-wrapper" style="height:38px;">
<canvas baseChart class="chart"
[datasets]="lineChart4Data"
[labels]="lineChart4Labels"
[options]="lineChart4Options"
[colors]="lineChart4Colours"
[legend]="lineChart4Legend"
[chartType]="lineChart4Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
<div class="chart-wrapper" style="height:38px;">
<canvas baseChart class="chart"
[datasets]="barChart2Data"
[labels]="barChart2Labels"
[options]="barChart2Options"
[colors]="barChart2Colours"
[legend]="barChart2Legend"
[chartType]="barChart2Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6 col-lg-3">
<div class="card">
<div class="card-block">
<div class="h4 m-0">89.9%</div>
<div>Lorem ipsum...</div>
<div class="progress progress-xs my-3">
<div class="progress-bar bg-success" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<small class="text-muted">Lorem ipsum dolor sit amet enim.</small>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-lg-3">
<div class="card">
<div class="card-block">
<div class="h4 m-0">12.124</div>
<div>Lorem ipsum...</div>
<div class="progress progress-xs my-3">
<div class="progress-bar bg-info" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<small class="text-muted">Lorem ipsum dolor sit amet enim.</small>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-lg-3">
<div class="card">
<div class="card-block">
<div class="h4 m-0">$98.111,00</div>
<div>Lorem ipsum...</div>
<div class="progress progress-xs my-3">
<div class="progress-bar bg-warning" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<small class="text-muted">Lorem ipsum dolor sit amet enim.</small>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-lg-3">
<div class="card">
<div class="card-block">
<div class="h4 m-0">2 TB</div>
<div>Lorem ipsum...</div>
<div class="progress progress-xs my-3">
<div class="progress-bar bg-danger" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<small class="text-muted">Lorem ipsum dolor sit amet enim.</small>
</div>
</div>
</div><!--/.col-->
</div><!--/.row-->
<div class="row">
<div class="col-sm-6 col-lg-3">
<div class="card card-inverse card-primary">
<div class="card-block">
<div class="h4 m-0">89.9%</div>
<div>Lorem ipsum...</div>
<div class="progress progress-white progress-xs my-3">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<small class="text-muted">Lorem ipsum dolor sit amet enim.</small>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-lg-3">
<div class="card card-inverse card-warning">
<div class="card-block">
<div class="h4 m-0">12.124</div>
<div>Lorem ipsum...</div>
<div class="progress progress-white progress-xs my-3">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<small class="text-muted">Lorem ipsum dolor sit amet enim.</small>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-lg-3">
<div class="card card-inverse card-danger">
<div class="card-block">
<div class="h4 m-0">$98.111,00</div>
<div>Lorem ipsum...</div>
<div class="progress progress-white progress-xs my-3">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<small class="text-muted">Lorem ipsum dolor sit amet enim.</small>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-lg-3">
<div class="card card-inverse card-info">
<div class="card-block">
<div class="h4 m-0">2 TB</div>
<div>Lorem ipsum...</div>
<div class="progress progress-white progress-xs my-3">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
<small class="text-muted">Lorem ipsum dolor sit amet enim.</small>
</div>
</div>
</div><!--/.col-->
</div><!--/.row-->
<div class="row">
<div class="col-md-2 col-sm-4">
<div class="card">
<div class="card-block text-center">
<div class="text-muted small text-uppercase font-weight-bold">Title</div>
<div class="h2 py-3">1,123</div>
<div class="chart-wrapper " style="height:40px;width:80px;">
<canvas baseChart class="chart"
[datasets]="barChart3Data"
[labels]="barChart3Labels"
[options]="barChart3Options"
[colors]="barChart3Primary"
[legend]="barChart3Legend"
[chartType]="barChart3Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-md-2 col-sm-4">
<div class="card">
<div class="card-block text-center">
<div class="text-muted small text-uppercase font-weight-bold">Title</div>
<div class="h2 py-3">1,123</div>
<div class="chart-wrapper " style="height:40px;width:80px;">
<canvas baseChart class="chart"
[datasets]="barChart3Data"
[labels]="barChart3Labels"
[options]="barChart3Options"
[colors]="barChart3Danger"
[legend]="barChart3Legend"
[chartType]="barChart3Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-md-2 col-sm-4">
<div class="card">
<div class="card-block text-center">
<div class="text-muted small text-uppercase font-weight-bold">Title</div>
<div class="h2 py-3">1,123</div>
<div class="chart-wrapper " style="height:40px;width:80px;">
<canvas baseChart class="chart"
[datasets]="barChart3Data"
[labels]="barChart3Labels"
[options]="barChart3Options"
[colors]="barChart3Success"
[legend]="barChart3Legend"
[chartType]="barChart3Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-md-2 col-sm-4">
<div class="card">
<div class="card-block text-center">
<div class="text-muted small text-uppercase font-weight-bold">Title</div>
<div class="h2 py-3">1,123</div>
<div class="chart-wrapper " style="height:40px;width:80px;">
<canvas baseChart class="chart"
[datasets]="lineChart5Data"
[labels]="lineChart5Labels"
[options]="lineChart5Options"
[colors]="lineChart5Info"
[legend]="lineChart5Legend"
[chartType]="lineChart5Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-md-2 col-sm-4">
<div class="card">
<div class="card-block text-center">
<div class="text-muted small text-uppercase font-weight-bold">Title</div>
<div class="h2 py-3">1,123</div>
<div class="chart-wrapper " style="height:40px;width:80px;">
<canvas baseChart class="chart"
[datasets]="lineChart5Data"
[labels]="lineChart5Labels"
[options]="lineChart5Options"
[colors]="lineChart5Success"
[legend]="lineChart5Legend"
[chartType]="lineChart5Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-md-2 col-sm-4">
<div class="card">
<div class="card-block text-center">
<div class="text-muted small text-uppercase font-weight-bold">Title</div>
<div class="h2 py-3">1,123</div>
<div class="chart-wrapper " style="height:40px;width:80px;">
<canvas baseChart class="chart"
[datasets]="lineChart5Data"
[labels]="lineChart5Labels"
[options]="lineChart5Options"
[colors]="lineChart5Warning"
[legend]="lineChart5Legend"
[chartType]="lineChart5Type"
(chartHover)="chartHovered($event)"
(chartClick)="chartClicked($event)"></canvas>
</div>
</div>
</div>
</div><!--/.col-->
</div><!--/.row-->
<div class="row">
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-3 clearfix">
<i class="fa fa-cogs bg-primary p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-primary mb-0 mt-2">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-3 clearfix">
<i class="fa fa-laptop bg-info p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-info mb-0 mt-2">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-3 clearfix">
<i class="fa fa-moon-o bg-warning p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-warning mb-0 mt-2">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-3 clearfix">
<i class="fa fa-bell bg-danger p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-danger mb-0 mt-2">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-3 clearfix">
<i class="fa fa-cogs bg-primary p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-primary mb-0 mt-2">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
<div class="card-footer px-3 py-2">
<a class="font-weight-bold font-xs btn-block text-muted" href="#">View More <i class="fa fa-angle-right float-right font-lg"></i></a>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-3 clearfix">
<i class="fa fa-laptop bg-info p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-info mb-0 mt-2">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
<div class="card-footer px-3 py-2">
<a class="font-weight-bold font-xs btn-block text-muted" href="#">View More <i class="fa fa-angle-right float-right font-lg"></i></a>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-3 clearfix">
<i class="fa fa-moon-o bg-warning p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-warning mb-0 mt-2">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
<div class="card-footer px-3 py-2">
<a class="font-weight-bold font-xs btn-block text-muted" href="#">View More <i class="fa fa-angle-right float-right font-lg"></i></a>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-3 clearfix">
<i class="fa fa-bell bg-danger p-3 font-2xl mr-3 float-left"></i>
<div class="h5 text-danger mb-0 mt-2">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
<div class="card-footer px-3 py-2">
<a class="font-weight-bold font-xs btn-block text-muted" href="#">View More <i class="fa fa-angle-right float-right font-lg"></i></a>
</div>
</div>
</div>
<!--/.col-->
</div>
<!--/.row-->
<div class="row">
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-0 clearfix">
<i class="fa fa-cogs bg-primary p-4 font-2xl mr-3 float-left"></i>
<div class="h5 text-primary mb-0 pt-3">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-0 clearfix">
<i class="fa fa-laptop bg-info p-4 font-2xl mr-3 float-left"></i>
<div class="h5 text-info mb-0 pt-3">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-0 clearfix">
<i class="fa fa-moon-o bg-warning p-4 font-2xl mr-3 float-left"></i>
<div class="h5 text-warning mb-0 pt-3">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-0 clearfix">
<i class="fa fa-bell bg-danger p-4 font-2xl mr-3 float-left"></i>
<div class="h5 text-danger mb-0 pt-3">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-0 clearfix">
<i class="fa fa-cogs bg-primary p-4 px-5 font-2xl mr-3 float-left"></i>
<div class="h5 text-primary mb-0 pt-3">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-0 clearfix">
<i class="fa fa-laptop bg-info p-4 px-5 font-2xl mr-3 float-left"></i>
<div class="h5 text-info mb-0 pt-3">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-0 clearfix">
<i class="fa fa-moon-o bg-warning p-4 px-5 font-2xl mr-3 float-left"></i>
<div class="h5 text-warning mb-0 pt-3">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
</div>
</div>
<!--/.col-->
<div class="col-6 col-lg-3">
<div class="card">
<div class="card-block p-0 clearfix">
<i class="fa fa-bell bg-danger p-4 px-5 font-2xl mr-3 float-left"></i>
<div class="h5 text-danger mb-0 pt-3">$1.999,50</div>
<div class="text-muted text-uppercase font-weight-bold font-xs">Income</div>
</div>
</div>
</div>
<!--/.col-->
</div>
<!--/.row-->
<div class="row">
<div class="col-md-3 col-sm-6">
<div class="social-box facebook">
<i class="fa fa-facebook"></i>
<ul>
<li>
<strong>89k</strong>
<span>friends</span>
</li>
<li>
<strong>459</strong>
<span>feeds</span>
</li>
</ul>
</div>
<!--/social-box-->
</div><!--/.col-->
<div class="col-md-3 col-sm-6">
<div class="social-box twitter">
<i class="fa fa-twitter"></i>
<ul>
<li>
<strong>973k</strong>
<span>followers</span>
</li>
<li>
<strong>1.792</strong>
<span>tweets</span>
</li>
</ul>
</div>
<!--/social-box-->
</div><!--/.col-->
<div class="col-md-3 col-sm-6">
<div class="social-box linkedin">
<i class="fa fa-linkedin"></i>
<ul>
<li>
<strong>500+</strong>
<span>contacts</span>
</li>
<li>
<strong>292</strong>
<span>feeds</span>
</li>
</ul>
</div>
<!--/social-box-->
</div><!--/.col-->
<div class="col-md-3 col-sm-6">
<div class="social-box google-plus">
<i class="fa fa-google-plus"></i>
<ul>
<li>
<strong>894</strong>
<span>followers</span>
</li>
<li>
<strong>92</strong>
<span>circles</span>
</li>
</ul>
</div>
<!--/social-box-->
</div><!--/.col-->
</div><!--/.row-->
<div class="card-group">
<div class="card">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-people"></i>
</div>
<div class="h4 mb-0">87.500</div>
<small class="text-muted text-uppercase font-weight-bold">Visitors</small>
<div class="progress progress-xs mt-3 mb-0">
<div class="progress-bar bg-info" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
<div class="card">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-user-follow"></i>
</div>
<div class="h4 mb-0">385</div>
<small class="text-muted text-uppercase font-weight-bold">New Clients</small>
<div class="progress progress-xs mt-3 mb-0">
<div class="progress-bar bg-success" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
<div class="card">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-basket-loaded"></i>
</div>
<div class="h4 mb-0">1238</div>
<small class="text-muted text-uppercase font-weight-bold">Products sold</small>
<div class="progress progress-xs mt-3 mb-0">
<div class="progress-bar bg-warning" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
<div class="card">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-pie-chart"></i>
</div>
<div class="h4 mb-0">28%</div>
<small class="text-muted text-uppercase font-weight-bold">Returning Visitors</small>
<div class="progress progress-xs mt-3 mb-0">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
<div class="card">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-speedometer"></i>
</div>
<div class="h4 mb-0">5:34:11</div>
<small class="text-muted text-uppercase font-weight-bold">Avg. Time</small>
<div class="progress progress-xs mt-3 mb-0">
<div class="progress-bar bg-danger" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-sm-6 col-md-2">
<div class="card">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-people"></i>
</div>
<div class="h4 mb-0">87.500</div>
<small class="text-muted text-uppercase font-weight-bold">Visitors</small>
<div class="progress progress-xs mt-3 mb-0">
<div class="progress-bar bg-info" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-md-2">
<div class="card">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-user-follow"></i>
</div>
<div class="h4 mb-0">385</div>
<small class="text-muted text-uppercase font-weight-bold">New Clients</small>
<div class="progress progress-xs mt-3 mb-0">
<div class="progress-bar bg-success" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-md-2">
<div class="card">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-basket-loaded"></i>
</div>
<div class="h4 mb-0">1238</div>
<small class="text-muted text-uppercase font-weight-bold">Products sold</small>
<div class="progress progress-xs mt-3 mb-0">
<div class="progress-bar bg-warning" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-md-2">
<div class="card">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-pie-chart"></i>
</div>
<div class="h4 mb-0">28%</div>
<small class="text-muted text-uppercase font-weight-bold">Returning Visitors</small>
<div class="progress progress-xs mt-3 mb-0">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-md-2">
<div class="card">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-speedometer"></i>
</div>
<div class="h4 mb-0">5:34:11</div>
<small class="text-muted text-uppercase font-weight-bold">Avg. Time</small>
<div class="progress progress-xs mt-3 mb-0">
<div class="progress-bar bg-danger" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-md-2">
<div class="card">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-speech"></i>
</div>
<div class="h4 mb-0">972</div>
<small class="text-muted text-uppercase font-weight-bold">Comments</small>
<div class="progress progress-xs mt-3 mb-0">
<div class="progress-bar bg-info" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div><!--/.col-->
</div><!--/.row-->
<div class="row">
<div class="col-sm-6 col-md-2">
<div class="card card-inverse card-info">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-people"></i>
</div>
<div class="h4 mb-0">87.500</div>
<small class="text-muted text-uppercase font-weight-bold">Visitors</small>
<div class="progress progress-white progress-xs mt-3">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-md-2">
<div class="card card-inverse card-success">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-user-follow"></i>
</div>
<div class="h4 mb-0">385</div>
<small class="text-muted text-uppercase font-weight-bold">New Clients</small>
<div class="progress progress-white progress-xs mt-3">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-md-2">
<div class="card card-inverse card-warning">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-basket-loaded"></i>
</div>
<div class="h4 mb-0">1238</div>
<small class="text-muted text-uppercase font-weight-bold">Products sold</small>
<div class="progress progress-white progress-xs mt-3">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-md-2">
<div class="card card-inverse card-primary">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-pie-chart"></i>
</div>
<div class="h4 mb-0">28%</div>
<small class="text-muted text-uppercase font-weight-bold">Returning Visitors</small>
<div class="progress progress-white progress-xs mt-3">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-md-2">
<div class="card card-inverse card-danger">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-speedometer"></i>
</div>
<div class="h4 mb-0">5:34:11</div>
<small class="text-muted text-uppercase font-weight-bold">Avg. Time</small>
<div class="progress progress-white progress-xs mt-3">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div><!--/.col-->
<div class="col-sm-6 col-md-2">
<div class="card card-inverse card-info">
<div class="card-block">
<div class="h1 text-muted text-right mb-4">
<i class="icon-speech"></i>
</div>
<div class="h4 mb-0">972</div>
<small class="text-muted text-uppercase font-weight-bold">Comments</small>
<div class="progress progress-white progress-xs mt-3">
<div class="progress-bar" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div>
</div>
</div><!--/.col-->
</div><!--/.row-->
</div>

386
src/app/widgets/widgets.component.ts
View file

@ -1,386 +0,0 @@
import { Component } from '@angular/core';
@Component({
templateUrl: 'widgets.component.html'
})
export class WidgetsComponent {
constructor() { }
public brandPrimary = '#20a8d8';
public brandSuccess = '#4dbd74';
public brandInfo = '#63c2de';
public brandWarning = '#f8cb00';
public brandDanger = '#f86c6b';
// convert Hex to RGBA
// public convertHex(hex: string, opacity: number){
// hex = hex.replace('#','');
// let r = parseInt(hex.substring(0,2), 16);
// let g = parseInt(hex.substring(2,4), 16);
// let b = parseInt(hex.substring(4,6), 16);
//
// let rgba = 'rgba('+r+','+g+','+b+','+opacity/100+')';
// return rgba;
// }
// events
public chartClicked(e: any): void {
console.log(e);
}
public chartHovered(e: any): void {
console.log(e);
}
// lineChart1
public lineChart1Data: Array<any> = [
{
data: [80, 59, 84, 84, 51, 55, 40],
label: 'Series A'
}
];
public lineChart1Labels: Array<any> = ['January', 'February', 'March', 'April', 'May', 'June', 'July'];
public lineChart1Options: any = {
maintainAspectRatio: false,
scales: {
xAxes: [{
gridLines: {
color: 'transparent',
zeroLineColor: 'transparent'
},
ticks: {
fontSize: 2,
fontColor: 'transparent',
}
}],
yAxes: [{
display: false,
ticks: {
display: false,
min: 40 - 5,
max: 84 + 5,
}
}],
},
elements: {
line: {
borderWidth: 1
},
point: {
radius: 4,
hitRadius: 10,
hoverRadius: 4,
},
},
legend: {
display: false
}
};
public lineChart1Colours: Array<any> = [
{ // grey
backgroundColor: this.brandPrimary,
borderColor: 'rgba(255,255,255,.55)'
}
];
public lineChart1Legend = false;
public lineChart1Type = 'line';
// lineChart2
public lineChart2Data: Array<any> = [
{
data: [1, 18, 9, 17, 34, 22, 11],
label: 'Series A'
}
];
public lineChart2Labels: Array<any> = ['January', 'February', 'March', 'April', 'May', 'June', 'July'];
public lineChart2Options: any = {
maintainAspectRatio: false,
scales: {
xAxes: [{
gridLines: {
color: 'transparent',
zeroLineColor: 'transparent'
},
ticks: {
fontSize: 2,
fontColor: 'transparent',
}
}],
yAxes: [{
display: false,
ticks: {
display: false,
min: 1 - 5,
max: 34 + 5,
}
}],
},
elements: {
line: {
tension: 0.00001,
borderWidth: 1
},
point: {
radius: 4,
hitRadius: 10,
hoverRadius: 4,
},
},
legend: {
display: false
}
};
public lineChart2Colours: Array<any> = [
{ // grey
backgroundColor: this.brandInfo,
borderColor: 'rgba(255,255,255,.55)'
}
];
public lineChart2Legend = false;
public lineChart2Type = 'line';
// lineChart3
public lineChart3Data: Array<any> = [
{
data: [78, 81, 80, 45, 34, 12, 40],
label: 'Series A'
}
];
public lineChart3Labels: Array<any> = ['January', 'February', 'March', 'April', 'May', 'June', 'July'];
public lineChart3Options: any = {
maintainAspectRatio: false,
scales: {
xAxes: [{
display: false
}],
yAxes: [{
display: false
}]
},
elements: {
line: {
borderWidth: 2
},
point: {
radius: 0,
hitRadius: 10,
hoverRadius: 4,
},
},
legend: {
display: false
}
};
public lineChart3Colours: Array<any> = [
{
backgroundColor: 'rgba(255,255,255,.2)',
borderColor: 'rgba(255,255,255,.55)',
}
];
public lineChart3Legend = false;
public lineChart3Type = 'line';
// barChart1
public barChart1Data: Array<any> = [
{
data: [78, 81, 80, 45, 34, 12, 40, 78, 81, 80, 45, 34, 12, 40, 12, 40],
label: 'Series A'
}
];
public barChart1Labels: Array<any> = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16'];
public barChart1Options: any = {
maintainAspectRatio: false,
scales: {
xAxes: [{
display: false,
barPercentage: 0.6,
}],
yAxes: [{
display: false
}]
},
legend: {
display: false
}
};
public barChart1Colours: Array<any> = [
{
backgroundColor: 'rgba(255,255,255,.3)',
borderWidth: 0
}
];
public barChart1Legend = false;
public barChart1Type = 'bar';
// lineChart4
public lineChart4Data: Array<any> = [
{
data: [4, 18, 9, 17, 80, 22, 11],
label: 'Series A'
}
];
public lineChart4Labels: Array<any> = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];
public lineChart4Options: any = {
maintainAspectRatio: false,
scales: {
xAxes: [{
display: false,
points: false,
}],
yAxes: [{
display: false,
}]
},
elements: { point: { radius: 0 } },
legend: {
display: false
}
};
public lineChart4Colours: Array<any> = [
{
backgroundColor: 'transparent',
borderColor: 'rgba(255,255,255,.55)',
borderWidth: 2
}
];
public lineChart4Legend = false;
public lineChart4Type = 'line';
// barChart2
public barChart2Data: Array<any> = [
{
data: [4, 18, 9, 17, 34, 22, 11, 3, 15, 12, 18, 9],
label: 'Series A'
}
];
public barChart2Labels: Array<any> = ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'];
public barChart2Options: any = {
maintainAspectRatio: false,
scales: {
xAxes: [{
display: false,
barPercentage: 0.6,
}],
yAxes: [{
display: false,
ticks: {
beginAtZero: true,
}
}]
},
legend: {
display: false
}
};
public barChart2Colours: Array<any> = [
{
backgroundColor: 'rgba(0,0,0,.2)',
borderWidth: 0
}
];
public barChart2Legend = false;
public barChart2Type = 'bar';
// barChart3
public barChart3Data: Array<any> = [
{
data: [4, 18, 9, 17, 34, 22, 11, 3, 15, 12, 18, 9],
label: 'Series A'
}
];
public barChart3Labels: Array<any> = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'];
public barChart3Options: any = {
maintainAspectRatio: false,
scales: {
xAxes: [{
display: false
}],
yAxes: [{
display: false
}]
},
legend: {
display: false
}
};
public barChart3Primary: Array<any> = [
{
backgroundColor: this.brandPrimary,
borderColor: 'transparent',
borderWidth: 1
}
];
public barChart3Danger: Array<any> = [
{
backgroundColor: this.brandDanger,
borderColor: 'transparent',
borderWidth: 1
}
];
public barChart3Success: Array<any> = [
{
backgroundColor: this.brandSuccess,
borderColor: 'transparent',
borderWidth: 1
}
];
public barChart3Legend = false;
public barChart3Type = 'bar';
// lineChart5
public lineChart5Data: Array<any> = [
{
data: [4, 18, 9, 17, 34, 22, 11, 3, 15, 12, 18, 9],
label: 'Series A'
}
];
public lineChart5Labels: Array<any> = ['January', 'February', 'March', 'April', 'May', 'June', 'July'];
public lineChart5Options: any = {
maintainAspectRatio: false,
scales: {
xAxes: [{
display: false,
points: false,
}],
yAxes: [{
display: false,
}]
},
elements: { point: { radius: 0 } },
legend: {
display: false
}
};
public lineChart5Info: Array<any> = [
{
backgroundColor: 'transparent',
borderColor: this.brandInfo,
borderWidth: 2
}
];
public lineChart5Success: Array<any> = [
{
backgroundColor: 'transparent',
borderColor: this.brandInfo,
borderWidth: 2
}
];
public lineChart5Warning: Array<any> = [
{
backgroundColor: 'transparent',
borderColor: this.brandWarning,
borderWidth: 2
}
];
public lineChart5Legend = false;
public lineChart5Type = 'line';
}

14
src/app/widgets/widgets.module.ts
View file

@ -1,14 +0,0 @@
import { NgModule } from '@angular/core';
import { ChartsModule } from 'ng2-charts/ng2-charts';
import { WidgetsComponent } from './widgets.component';
import { WidgetsRoutingModule } from './widgets-routing.module';
@NgModule({
imports: [
WidgetsRoutingModule,
ChartsModule
],
declarations: [ WidgetsComponent ]
})
export class WidgetsModule { }