From cc1b5c35c9f69fe320fe4aa3752c2823a1369e8a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Lukas=20Mau=C3=9F?= <lukas.mauss@mni.thm.de>
Date: Tue, 26 Feb 2019 13:03:04 +0100
Subject: [PATCH] Explain colors in statistic-help-dialog
---
.../statistic-help.component.html | 23 ++++++++++++++++---
.../statistic-help.component.scss | 17 ++++++++++++++
2 files changed, 37 insertions(+), 3 deletions(-)
diff --git a/src/app/components/shared/_dialogs/statistic-help/statistic-help.component.html b/src/app/components/shared/_dialogs/statistic-help/statistic-help.component.html
index d646663a6..f1efc0029 100644
--- a/src/app/components/shared/_dialogs/statistic-help/statistic-help.component.html
+++ b/src/app/components/shared/_dialogs/statistic-help/statistic-help.component.html
@@ -1,3 +1,20 @@
-<p>
- statistic-help works!
-</p>
+<mat-chip-list class="mat-chip-list-stacked">
+ <div fxLayout="row" fxLayoutAlign="center center" fxLayoutGap="20px">
+ <mat-chip class="positiveC">
+ Good
+ </mat-chip>
+ <h3> > 85 % </h3>
+ </div>
+ <div fxLayout="row" fxLayoutAlign="center center" fxLayoutGap="20px">
+ <mat-chip class="okayC">
+ Okay
+ </mat-chip>
+ <h3> > 50 % </h3>
+ </div>
+ <div fxLayout="row" fxLayoutAlign="center center" fxLayoutGap="20px">
+ <mat-chip class="negativeC">
+ Improvable
+ </mat-chip>
+ <h3> < 50 % </h3>
+ </div>
+</mat-chip-list>
diff --git a/src/app/components/shared/_dialogs/statistic-help/statistic-help.component.scss b/src/app/components/shared/_dialogs/statistic-help/statistic-help.component.scss
index e69de29bb..d1a486c7a 100644
--- a/src/app/components/shared/_dialogs/statistic-help/statistic-help.component.scss
+++ b/src/app/components/shared/_dialogs/statistic-help/statistic-help.component.scss
@@ -0,0 +1,17 @@
+.positiveC {
+ background-color: #AED581;
+}
+
+.negativeC {
+ background-color: #FF8A65;
+}
+
+.okayC {
+ background-color: #FFD54F;
+}
+
+mat-chip {
+ width: 100px!important;
+ display: flex;
+ justify-content: center;
+}
--
GitLab