public dashboard

dmp-frontend/src/app/ui/dashboard/dashboard.component.html

@@ -1,175 +1,60 @@
+<div class="header-image">
+	<div class="header-text-container">
+		<h3>Welcome to OpenDMP</h3>
+		<h4>Lorem ipsum dolor sit amet concectetum lorem ipsum</h4>
+	</div>
+</div>
 <div class="main-content">
-	<div class="container-fluid">
+	<div *ngIf="this.isAuthenticated()" class="container-fluid">
-
 		<div class="row" *ngIf="this.isAuthenticated()">
 			<div class="col-sm-6 col-md-6 col-lg-6">
-				<app-wizard
+				<app-wizard title="{{'QUICKWIZARD.CREATE-ADD.CREATE.TITLE' | translate}}" subtitle="Follow the steps of the wizard" routerLink="/quick-wizard" icon="play_circle_outline"></app-wizard>
-					title="{{'QUICKWIZARD.CREATE-ADD.CREATE.TITLE' | translate}}"
-					subtitle="Follow the steps of the wizard"
-					routerLink="/quick-wizard"
-					icon="play_circle_outline"
-				></app-wizard>
 			</div>
 			<div class="col-sm-6 col-md-6 col-lg-6">
-				<app-wizard
+				<app-wizard title="{{'QUICKWIZARD.CREATE-ADD.ADD.TITLE' | translate}}" subtitle="Follow the steps of the wizard" routerLink="/datasetcreatewizard" icon="play_circle_outline"></app-wizard>
-					title="{{'QUICKWIZARD.CREATE-ADD.ADD.TITLE' | translate}}"
-					subtitle="Follow the steps of the wizard"
-					routerLink="/datasetcreatewizard"
-					icon="play_circle_outline"
-				></app-wizard>
 			</div>
 		</div>
-
 		<div class="row">
 			<div class="col-md-9">
-
 				<div class="row">
 					<div class="col-lg-3 col-md-6 col-sm-6">
-						<app-info-counter
+						<app-info-counter [title]="'DASHBOARD.MY-DMPS'" [subtitle]="dashboardStatisticsData?.totalDataManagementPlanCount" routerLink='/plans' buttonRedirectLink="/plans/new" icon="view_agenda"></app-info-counter>
-							[title]="this.isAuthenticated() ? 'DASHBOARD.MY-DMPS' : 'DASHBOARD.DMPS'"
-							[subtitle]="dashboardStatisticsData?.totalDataManagementPlanCount"
-							routerLink='/plans' buttonRedirectLink="/plans/new"
-							icon="view_agenda"
-						></app-info-counter>
 					</div>
 					<div class="col-lg-3 col-md-6 col-sm-6">
-						<app-info-counter
+						<app-info-counter [title]="'DASHBOARD.MY-DATASETS'" [subtitle]="dashboardStatisticsData?.totalDataSetCount" routerLink='/datasets' buttonRedirectLink="/datasets/new" icon="library_books"></app-info-counter>
-							[title]="this.isAuthenticated() ? 'DASHBOARD.MY-DATASETS' : 'DASHBOARD.DATASETS'"
-							[subtitle]="dashboardStatisticsData?.totalDataSetCount"
-							routerLink='/datasets' buttonRedirectLink="/datasets/new"
-							icon="library_books"
-						></app-info-counter>
 					</div>
 					<div class="col-lg-3 col-md-6 col-sm-6">
-						<app-info-counter
+						<app-info-counter [title]="'DASHBOARD.MY-PROJECTS'" [subtitle]="dashboardStatisticsData?.totalProjectCount" routerLink='/projects' buttonRedirectLink="/projects/new" icon="work_outline"></app-info-counter>
-							[title]="this.isAuthenticated() ? 'DASHBOARD.MY-PROJECTS' : 'DASHBOARD.PROJECTS'"
-							[subtitle]="dashboardStatisticsData?.totalProjectCount"
-							routerLink='/projects' buttonRedirectLink="/projects/new"
-							icon="work_outline"
-						></app-info-counter>
 					</div>
 					<div class="col-lg-3 col-md-6 col-sm-6">
-						<app-info-counter
+						<app-info-counter title="Related Organizations" [subtitle]="dashboardStatisticsData?.totalOrganisationCount" icon="scatter_plot"></app-info-counter>
-							title="Related Organizations"
-							[subtitle]="dashboardStatisticsData?.totalOrganisationCount"
-							icon="scatter_plot"
-						></app-info-counter>
 					</div>
 				</div>
-
-				<!-- <div class="row">
-					<div class="col-lg-12 col-md-12">
-						<app-recent-visited-activity></app-recent-visited-activity>
-					</div>
-				</div> -->
 				<div class="row">
 					<div class="col-lg-12 col-md-12">
 						<app-recent-edited-activity></app-recent-edited-activity>
 					</div>
 				</div>
-
 			</div>
-
 			<div class="col-md-3">
 				<app-drafts></app-drafts>
 			</div>
-
+		</div>
+	</div>
+	<div *ngIf="!this.isAuthenticated()" class="container-fluid">
+		<div class="row">
+			<div class="col-lg-3 col-md-6 col-sm-6">
+				<app-info-counter [title]="'DASHBOARD.DMPS'" [subtitle]="dashboardStatisticsData?.totalDataManagementPlanCount" routerLink='/plans' buttonRedirectLink="/plans/new" icon="view_agenda"></app-info-counter>
+			</div>
+			<div class="col-lg-3 col-md-6 col-sm-6">
+				<app-info-counter [title]="'DASHBOARD.DATASETS'" [subtitle]="dashboardStatisticsData?.totalDataSetCount" routerLink='/datasets' buttonRedirectLink="/datasets/new" icon="library_books"></app-info-counter>
+			</div>
+			<div class="col-lg-3 col-md-6 col-sm-6">
+				<app-info-counter [title]="'DASHBOARD.PROJECTS'" [subtitle]="dashboardStatisticsData?.totalProjectCount" routerLink='/projects' buttonRedirectLink="/projects/new" icon="work_outline"></app-info-counter>
+			</div>
+			<div class="col-lg-3 col-md-6 col-sm-6">
+				<app-info-counter title="Related Organizations" [subtitle]="dashboardStatisticsData?.totalOrganisationCount" icon="scatter_plot"></app-info-counter>
+			</div>
 		</div>
 	</div>
 </div>
-
-<!-- <div class="dashboard" id="main-panel">
-	<div>
-		<div class="row" style="margin-top: 30px">
-			<div class="col"></div>
-			<div class="col-auto">
-				<h3 *ngIf="!this.isAuthenticated()">{{ 'HOMEPAGE.OPEN-DMPS.STATS' | translate }}</h3>
-				<h3 *ngIf="this.isAuthenticated()">{{ 'HOMEPAGE.MY-DMPS.STATS' | translate }}</h3>
-			</div>
-			<div class="col"></div>
-		</div>
-
-		<div class="row" style="margin-top: 30px" *ngIf="this.isAuthenticated()">
-			<div class="col-1"></div>
-			<div class="col">
-				<app-quick-wizard-create-add-component></app-quick-wizard-create-add-component>
-			</div>
-			<div class="col-1"></div>
-		</div>
-
-
-	</div>
-	<div class="row" style="margin-top: 30px">
-		<div class="col"></div>
-		<div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
-			<app-dashboard-card title={{dashboardStatisticsData?.totalDataManagementPlanCount}} headerIcon="mode_edit" [category]="this.isAuthenticated() ? 'DASHBOARD.MY-DMPS' : 'DASHBOARD.DMPS' " routelLink='/plans' buttonRedirectLink="/plans/new" buttonTitle="Create New DMP" footerIcon="open_in_new" linearColor="linear-gradient(60deg, #ef5350, #e53935)" boxShadow="0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(244, 67, 54, 0.4)">
-			</app-dashboard-card>
-			<mat-card *ngIf="this.isAuthenticated()" class="example-card">
-				<mat-card-header>
-					<mat-card-title>
-						{{'RECENT-ACTIVITY.MY-TITLE-DMP' | translate}}
-					</mat-card-title>
-				</mat-card-header>
-				<mat-card-content>
-					<mat-nav-list *ngIf="dmpActivities!=null">
-						<mat-list-item (click)="redirect(activity.id, recentActivityTypeEnum.Dmp)" *ngFor="let activity of dmpActivities">
-							<p mat-line>
-								{{activity.label}}
-							</p>
-							<p mat-line>
-								{{activity.timestamp | date:'shortDate'}}
-							</p>
-						</mat-list-item>
-					</mat-nav-list>
-				</mat-card-content>
-			</mat-card>
-		</div>
-		<div class="col-lg-3 col-md-3 col-sm-6 col-xs-12 ">
-			<app-dashboard-card title={{dashboardStatisticsData?.totalProjectCount}} headerIcon="list" [category]="this.isAuthenticated() ? 'DASHBOARD.MY-PROJECTS' : 'DASHBOARD.PROJECTS' " routelLink='/projects' buttonRedirectLink="/projects/new" buttonTitle="Create New Project" footerIcon="open_in_new" linearColor="linear-gradient(60deg, #ffa726, #fb8c00)" boxShadow="0 4px 20px 0 rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(255, 152, 0, 0.4)">
-			</app-dashboard-card>
-			<mat-card *ngIf="this.isAuthenticated()" class="example-card">
-				<mat-card-header>
-					<mat-card-title>
-						{{'RECENT-ACTIVITY.MY-TITLE-PROJECT' | translate}}
-					</mat-card-title>
-				</mat-card-header>
-				<mat-card-content>
-					<mat-nav-list *ngIf="projectActivities!=null">
-						<mat-list-item (click)="redirect(activity.id, recentActivityTypeEnum.Project)" *ngFor="let activity of projectActivities">
-							<p mat-line>
-								{{activity.label}}
-							</p>
-							<p mat-line>
-								{{activity.timestamp | date:'shortDate'}}
-							</p>
-						</mat-list-item>
-					</mat-nav-list>
-				</mat-card-content>
-			</mat-card>
-		</div>
-		<div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
-			<app-dashboard-card title={{dashboardStatisticsData?.totalDataSetCount}} headerIcon="subject" [category]="this.isAuthenticated() ? 'DASHBOARD.MY-DATASETS' : 'DASHBOARD.DATASETS'" routelLink='/datasets' buttonRedirectLink="/datasets/new" buttonTitle="Create New Dataset" footerIcon="open_in_new" linearColor="linear-gradient(60deg, #26c6da, #00acc1)" boxShadow="0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(0, 188, 212, 0.4)">
-			</app-dashboard-card>
-			<mat-card *ngIf="this.isAuthenticated()" class="example-card">
-				<mat-card-header>
-					<mat-card-title>
-						{{'RECENT-ACTIVITY.MY-TITLE-DATASET' | translate}}
-					</mat-card-title>
-				</mat-card-header>
-				<mat-card-content>
-					<mat-nav-list *ngIf="datasetActivities!=null">
-						<mat-list-item (click)="redirect(activity.id, recentActivityTypeEnum.Dataset)" *ngFor="let activity of datasetActivities">
-							<p mat-line>
-								{{activity.label}}
-							</p>
-							<p mat-line>
-								{{activity.timestamp | date:'shortDate'}}
-							</p>
-						</mat-list-item>
-					</mat-nav-list>
-				</mat-card-content>
-			</mat-card>
-		</div>
-		<div class="col"></div>
-	</div>
-</div> -->

dmp-frontend/src/app/ui/dashboard/dashboard.component.scss

@@ -1,3 +1,21 @@
+.header-image {
+	background: url('/assets/images/dashboard-bg.png') no-repeat;
+	background-size: cover;
+	margin-top: 70px;
+	min-height: 15em;
+	position: relative;
+}
+
+.header-text-container {
+	background: rgba(255, 255, 255, 0.7);
+	position: absolute;
+	bottom: 0px;
+	padding-left: 5em;
+	padding-right: 10em;
+	padding-top: 2em;
+	padding-bottom: 2em;
+}
+
 .dashboard {
 	.card {
 		padding: 25px 20px 20px 20px;

dmp-frontend/src/app/ui/sidebar/sidebar.component.html

@@ -1,5 +1,5 @@
 <div class="logo">
-	<a href="/home">
+	<a [routerLink]=" ['/home']">
 		<div class="logo-img">
 			<img src="/assets/images/OpenDMP.png" />
 		</div>