From ce3a7fd1fa2e60f08cd5dd67dd4af6abd2186686 Mon Sep 17 00:00:00 2001
From: Anris Ceta <anris.ceta@mni.thm.de>
Date: Sun, 14 Apr 2019 23:07:08 +0200
Subject: [PATCH] move scss colors to variables
---
src/app/app.component.scss | 2 +-
.../content-edit/content-edit.component.scss | 6 +--
.../content-choice-creator.component.scss | 4 +-
.../content-likert-creator.component.scss | 4 +-
.../content-list/content-list.component.scss | 6 +--
.../content-presentation.component.scss | 4 +-
.../room-creator-page.component.scss | 4 +-
.../home/home-page/home-page.component.scss | 2 +-
.../room-participant-page.component.scss | 4 +-
.../statistic-help.component.scss | 10 ++--
.../comment-list/comment-list.component.scss | 14 +++---
.../shared/comment/comment.component.scss | 22 ++++-----
.../content-groups.component.scss | 4 +-
.../shared/footer/footer.component.scss | 8 ++--
.../list-statistic.component.scss | 28 +++++------
.../shared/room-list/room-list.component.scss | 12 ++---
.../shared/statistic/statistic.component.scss | 4 +-
.../statistics-page.component.scss | 2 +-
src/styles.scss | 6 +--
src/theme/arsnova-theme.const.ts | 15 ++----
src/theme/{ => dark-Theme}/_dark-theme.scss | 2 +-
src/theme/dark-Theme/darkTheme.const.ts | 46 +++++++++++++++++++
src/theme/{ => default-Theme}/_form.scss | 0
src/theme/{ => default-Theme}/_theme.scss | 6 +--
src/theme/{ => default-Theme}/_util.scss | 0
src/theme/{ => default-Theme}/_variables.scss | 2 +-
src/theme/default-Theme/defaultTheme.const.ts | 46 +++++++++++++++++++
27 files changed, 176 insertions(+), 87 deletions(-)
rename src/theme/{ => dark-Theme}/_dark-theme.scss (92%)
create mode 100644 src/theme/dark-Theme/darkTheme.const.ts
rename src/theme/{ => default-Theme}/_form.scss (100%)
rename src/theme/{ => default-Theme}/_theme.scss (58%)
rename src/theme/{ => default-Theme}/_util.scss (100%)
rename src/theme/{ => default-Theme}/_variables.scss (91%)
create mode 100644 src/theme/default-Theme/defaultTheme.const.ts
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
index 526e030fe..f9a76fe6e 100644
--- a/src/app/app.component.scss
+++ b/src/app/app.component.scss
@@ -1,4 +1,4 @@
-@import '../theme/_variables.scss';
+@import '../theme/default-Theme/_variables.scss';
.app-component {
padding: 4%;
diff --git a/src/app/components/creator/_dialogs/content-edit/content-edit.component.scss b/src/app/components/creator/_dialogs/content-edit/content-edit.component.scss
index eba525c7c..0ac29857b 100644
--- a/src/app/components/creator/_dialogs/content-edit/content-edit.component.scss
+++ b/src/app/components/creator/_dialogs/content-edit/content-edit.component.scss
@@ -9,14 +9,14 @@ textarea {
}
mat-row {
- background-color: #bbdefb;
- border-color: #bbdefb;
+ background-color: var(--mat-row);
+ border-color: var(--mat-row);
}
h4 {
margin: 0px !important;
padding-bottom: 10px;
- color: #4db6ac;
+ color: var(--heading-4);
}
mat-cell {
diff --git a/src/app/components/creator/content-choice-creator/content-choice-creator.component.scss b/src/app/components/creator/content-choice-creator/content-choice-creator.component.scss
index 4d0f4e714..cffc26f8d 100644
--- a/src/app/components/creator/content-choice-creator/content-choice-creator.component.scss
+++ b/src/app/components/creator/content-choice-creator/content-choice-creator.component.scss
@@ -3,11 +3,11 @@ form > button {
}
mat-header-cell {
- background-color: #ffe0b2;
+ background-color: var(--content-creator-cell);
}
mat-row {
- background-color: #ffecb3;
+ background-color: var(--content-creator-row);
}
.addIcon {
diff --git a/src/app/components/creator/content-likert-creator/content-likert-creator.component.scss b/src/app/components/creator/content-likert-creator/content-likert-creator.component.scss
index 3d0e678f5..21391e600 100644
--- a/src/app/components/creator/content-likert-creator/content-likert-creator.component.scss
+++ b/src/app/components/creator/content-likert-creator/content-likert-creator.component.scss
@@ -3,9 +3,9 @@ form > button {
}
mat-header-cell {
- background-color: #ffe0b2;
+ background-color: var(--content-creator-cell);
}
mat-cell {
- background-color: #ffecb3;
+ background-color: var(--content-creator-row);
}
diff --git a/src/app/components/creator/content-list/content-list.component.scss b/src/app/components/creator/content-list/content-list.component.scss
index d81402038..e140afc51 100644
--- a/src/app/components/creator/content-list/content-list.component.scss
+++ b/src/app/components/creator/content-list/content-list.component.scss
@@ -1,7 +1,7 @@
mat-card {
width: 800px;
max-width: 90%;
- background-color: #fff8e1;
+ background-color:var(--content-mat-card);
}
mat-card-content > :first-child {
@@ -9,7 +9,7 @@ mat-card-content > :first-child {
}
mat-expansion-panel {
- background-color: #bbdefb;
+ background-color: var(--content-mat-expansion-panel);
margin-bottom: 5px;
}
@@ -21,7 +21,7 @@ mat-panel-title {
}
mat-expansion-panel-header {
- background-color: #bbdefb !important;
+ background-color: var(--content-mat-expansion-panel) !important;
padding-left: 3%;
padding-right: 3%;
}
diff --git a/src/app/components/creator/content-presentation/content-presentation.component.scss b/src/app/components/creator/content-presentation/content-presentation.component.scss
index 8b0580e3b..9db9db9e9 100644
--- a/src/app/components/creator/content-presentation/content-presentation.component.scss
+++ b/src/app/components/creator/content-presentation/content-presentation.component.scss
@@ -11,12 +11,12 @@ mat-card {
width: 800px;
max-width: 90%;
margin-top: 20px;
- background-color: #fff8e1;
+ background-color: var(--content-mat-card);
}
h3 {
font-size: 150%;
- color: #26a69a;
+ color: var(--content-prasentation-header);
}
h4 {
diff --git a/src/app/components/creator/room-creator-page/room-creator-page.component.scss b/src/app/components/creator/room-creator-page/room-creator-page.component.scss
index 9a4764ae3..b7434dc41 100644
--- a/src/app/components/creator/room-creator-page/room-creator-page.component.scss
+++ b/src/app/components/creator/room-creator-page/room-creator-page.component.scss
@@ -2,7 +2,7 @@
mat-card {
width: 800px;
- background-color: #fff8e1 !important;
+ background-color: var(--content-mat-card)!important;
}
mat-card-content > :first-child {
@@ -73,6 +73,6 @@ mat-grid-tile {
}
mat-expansion-panel {
- background-color: #fff8e1!important;
+ background-color: var(--content-mat-card)!important;
min-width: 200px;
}
diff --git a/src/app/components/home/home-page/home-page.component.scss b/src/app/components/home/home-page/home-page.component.scss
index 91512460d..cb1f733c9 100644
--- a/src/app/components/home/home-page/home-page.component.scss
+++ b/src/app/components/home/home-page/home-page.component.scss
@@ -3,7 +3,7 @@
.outer {
width: 90%;
max-width: 500px;
- background-color: #bbdefb;
+ background-color: var(--home-page-outer);
}
.main-heading-primary {
diff --git a/src/app/components/participant/room-participant-page/room-participant-page.component.scss b/src/app/components/participant/room-participant-page/room-participant-page.component.scss
index a3a11c062..10a40082b 100644
--- a/src/app/components/participant/room-participant-page/room-participant-page.component.scss
+++ b/src/app/components/participant/room-participant-page/room-participant-page.component.scss
@@ -3,7 +3,7 @@
mat-card {
width: 100%;
max-width: 800px;
- background-color: #fff8e1 !important;
+ background-color: var(--content-mat-card)!important;
}
mat-card-content>:first-child {
@@ -61,7 +61,7 @@ mat-card-subtitle {
}
mat-expansion-panel {
- background-color: #fff8e1!important;
+ background-color: var(--content-mat-card)!important;
min-width: 200px;
}
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 effb29236..d1ebb3266 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
@@ -1,21 +1,21 @@
.positiveC {
- background-color: #AED581;
+ background-color: var(--positiveC);
}
.negativeC {
- background-color: #FF8A65;
+ background-color: var(--negativeC);
}
.okayC {
- background-color: #FFD54F;
+ background-color: var(--okayC);
}
.emptyC {
- background-color: #E0E0E0;
+ background-color: var(--emptyC);
}
mat-chip {
- width: 130px!important;
+ width: 130px !important;
display: flex;
justify-content: center;
}
diff --git a/src/app/components/shared/comment-list/comment-list.component.scss b/src/app/components/shared/comment-list/comment-list.component.scss
index c1bb2f055..de8b30c93 100644
--- a/src/app/components/shared/comment-list/comment-list.component.scss
+++ b/src/app/components/shared/comment-list/comment-list.component.scss
@@ -1,6 +1,6 @@
mat-card {
margin-bottom: 10px;
- background-color: #4db6ac;
+ background-color: var(--comment-list-bg);
}
app-comment {
@@ -12,7 +12,7 @@ input {
box-sizing: border-box;
padding: 0 10px 0 5px;
width: 90%;
- background-color: #80cbc4;
+ background-color: var(--input-search-cl);
border: none;
outline: none;
min-height: 60px;
@@ -20,15 +20,15 @@ input {
border-radius: 5px;
}
-#search-container{
+#search-container {
border-radius: 5px;
- background-color: #80cbc4;
+ background-color: var(--input-search-cl);
margin-bottom: 10px;
}
.add-button {
- width: 44px!important;
- height: 44px!important;
+ width: 44px !important;
+ height: 44px !important;
text-align: center;
}
@@ -36,7 +36,7 @@ input {
font-size: 45px;
height: 45px;
width: 45px;
- line-height: 100%!important;
+ line-height: 100% !important;
}
.search-icon {
diff --git a/src/app/components/shared/comment/comment.component.scss b/src/app/components/shared/comment/comment.component.scss
index 808445234..8453fdf41 100644
--- a/src/app/components/shared/comment/comment.component.scss
+++ b/src/app/components/shared/comment/comment.component.scss
@@ -1,6 +1,6 @@
mat-card {
margin-bottom: 20px;
- background-color: #4dd0e1;
+ background-color: var(--comment-mat-card);
cursor: pointer;
padding-bottom: 10px;
padding-top: 10px;
@@ -14,46 +14,46 @@ mat-card-content > :first-child {
mat-toolbar {
border-radius: 10px;
margin-bottom: 20px;
- background-color: #bbdefb;
+ background-color: var(--comment-mat-toolbar);
}
.voting-icon {
width: 35px;
height: 35px;
font-size: 35px;
- line-height: 100%!important;
+ line-height: 100% !important;
}
.upvoted {
- color: #66bb6a;
+ color: var(--upvoted);
}
.downvoted {
- color: #FF8A65;
+ color: var(--downvoted);
}
.incorrect-icon {
- color: #c8e6c9;
+ color: var(--incorrect-icon);
}
.correct-icon {
- color: #66bb6a;
+ color: var(--correct-icon);
}
.read-icon {
- color: #1e88e5;
+ color: var(--read-icon);
}
.unread-icon {
- color: #e3f2fd;
+ color: var(--unread-icon);
}
.favorite-icon {
- color: #fdd835;
+ color: var(--favorite-icon);
}
.not-favorite-icon {
- color: #fffde7;
+ color: var(--not-favorite-icon);
}
.proffessor-icon {
diff --git a/src/app/components/shared/content-groups/content-groups.component.scss b/src/app/components/shared/content-groups/content-groups.component.scss
index 4d3c7ce28..f22daac06 100644
--- a/src/app/components/shared/content-groups/content-groups.component.scss
+++ b/src/app/components/shared/content-groups/content-groups.component.scss
@@ -1,7 +1,7 @@
-@import '../../../../theme/_variables.scss';
+@import '../../../../theme/default-Theme/_variables.scss';
.mat-card {
- background-color: #bbdefb;
+ background-color: var(--content-group-card);
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
overflow: hidden;
position: relative;
diff --git a/src/app/components/shared/footer/footer.component.scss b/src/app/components/shared/footer/footer.component.scss
index d3f2b1f8f..cd52b2f2c 100644
--- a/src/app/components/shared/footer/footer.component.scss
+++ b/src/app/components/shared/footer/footer.component.scss
@@ -1,13 +1,15 @@
footer {
- overflow-y: auto;
+ overflow-y: auto;
}
mat-toolbar {
- background-color: rgb(240, 240, 240);
+ background-color: var(--footer-bg-color);
height: auto;
+
&:first-child {
padding-left: 0px;
}
+
&:last-child {
padding-right: 0px;
}
@@ -16,7 +18,7 @@ mat-toolbar {
button {
min-height: 28px;
font-size: 12px;
- color: #80cbc4;
+ color: var(--footer-button);
}
mat-icon {
diff --git a/src/app/components/shared/list-statistic/list-statistic.component.scss b/src/app/components/shared/list-statistic/list-statistic.component.scss
index fba3ef597..02d37e27a 100644
--- a/src/app/components/shared/list-statistic/list-statistic.component.scss
+++ b/src/app/components/shared/list-statistic/list-statistic.component.scss
@@ -1,4 +1,4 @@
-table{
+table {
width: 100%;
}
@@ -24,50 +24,50 @@ table{
}
mat-header-cell {
- color: #4db6ac;
- background-color: #e0e0e0;
+ color: var(--list-st-hCell);
+ background-color: var(--list-st-hCell-bg);
}
mat-cell {
- background-color: #E0E0E0;
+ background-color: var(--list-st-mCell-bg);
}
mat-toolbar {
height: 20px;
- background-color: #fff8e1;
+ background-color: var(--list-st-toolbar-bg);
}
.positiveC {
- background-color: #AED581;
+ background-color: var(--positiveC);
}
.negativeC {
- background-color: #FF8A65;
+ background-color: var(--negativeC);
}
.okayC {
- background-color: #FFD54F;
+ background-color: var(--okayC);
}
.positiveP {
- background-color: #AED581 !important;
+ background-color: var(--positiveP) !important;
}
.negativeP {
- background-color: #FF8A65 !important;
+ background-color: var(--negativeP) !important;
}
.okayP {
- background-color: #FFB74D !important;
+ background-color: var(--okayP) !important;
}
.emptyC {
- color: #E0E0E0;
- background: #E0E0E0;
+ color: var(--emptyC-color);
+ background: var(--emptyC-color);
pointer-events: none;
}
.emptyCC {
- background: #E0E0E0;
+ background: var(--emptyCC) ;
pointer-events: none;
}
diff --git a/src/app/components/shared/room-list/room-list.component.scss b/src/app/components/shared/room-list/room-list.component.scss
index a269ce031..13f3ac469 100644
--- a/src/app/components/shared/room-list/room-list.component.scss
+++ b/src/app/components/shared/room-list/room-list.component.scss
@@ -8,17 +8,17 @@ button {
}
.matPanel {
- background-color: #cfd8dc;
+ background-color: var(--room-list-mPanel);
margin-bottom: 5px;
}
.matPanelHeader {
- background-color: #bbdefb;
+ background-color: var(--room-list-mPHeader);
margin-bottom: 5px;
}
.matPanelListHeader {
- background-color: #cfd8dc !important;
+ background-color: var(--room-list-mPLHeader) !important;
}
mat-panel-title {
@@ -28,7 +28,7 @@ mat-panel-title {
}
.headerTitle {
- width: 8%!important;
+ width: 8% !important;
}
mat-card-title {
@@ -36,6 +36,6 @@ mat-card-title {
}
mat-card {
- background-color: #cfd8dc;
- color: #4db6ac;
+ background-color: var(--room-list-card-bg);
+ color: var(--room-list-card-color);
}
diff --git a/src/app/components/shared/statistic/statistic.component.scss b/src/app/components/shared/statistic/statistic.component.scss
index d07ab6d24..080ec42e7 100644
--- a/src/app/components/shared/statistic/statistic.component.scss
+++ b/src/app/components/shared/statistic/statistic.component.scss
@@ -1,12 +1,12 @@
mat-card {
width: 800px;
max-width: 90%;
- background-color: #fff8e1 !important;
+ background-color: var(--statistic-bg-color) !important;
}
mat-toolbar {
height: 15px;
- background-color: #fff8e1;
+ background-color: var(--statistic-bg-color);
}
.mat-icon-button {
diff --git a/src/app/components/shared/statistics-page/statistics-page.component.scss b/src/app/components/shared/statistics-page/statistics-page.component.scss
index 08972d1c0..e342d80d6 100644
--- a/src/app/components/shared/statistics-page/statistics-page.component.scss
+++ b/src/app/components/shared/statistics-page/statistics-page.component.scss
@@ -2,5 +2,5 @@ mat-card {
width: 800px;
max-width: 90%;
min-height: 300px;
- background-color: #fff8e1 !important;
+ background-color: var(--statistic-bg-color) !important;
}
diff --git a/src/styles.scss b/src/styles.scss
index fdfdd9810..9d8295a06 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -1,5 +1,5 @@
-@import 'theme/_variables.scss';
-@import "theme/_dark-theme.scss";
+@import 'theme/default-Theme/_variables.scss';
+@import "theme/dark-Theme/dark-theme";
// Plus imports for other components in your app.
// Include the common styles for Angular Material. We include this here so that you only
@@ -18,4 +18,4 @@
}
-@import 'theme/_theme.scss';
+@import 'theme/default-Theme/theme';
diff --git a/src/theme/arsnova-theme.const.ts b/src/theme/arsnova-theme.const.ts
index 311968dcc..91ae0b442 100644
--- a/src/theme/arsnova-theme.const.ts
+++ b/src/theme/arsnova-theme.const.ts
@@ -1,12 +1,7 @@
+import { dark } from './dark-Theme/darkTheme.const';
+import { defaultTheme } from './default-Theme/defaultTheme.const';
+
export const themes = {
- arsnovaTheme: {
- '--button-color': '#80cbc4',
- '--background-color': '#b2dfdb',
- '--black-color' : '#000000'
- },
- dark: {
- '--button-color': '#80cbc4',
- '--background-color': '#000000',
- '--black-color' : '#000000'
- }
+ arsnovaTheme: defaultTheme,
+ dark: dark
};
diff --git a/src/theme/_dark-theme.scss b/src/theme/dark-Theme/_dark-theme.scss
similarity index 92%
rename from src/theme/_dark-theme.scss
rename to src/theme/dark-Theme/_dark-theme.scss
index b633de8a8..f94f53fd3 100644
--- a/src/theme/_dark-theme.scss
+++ b/src/theme/dark-Theme/_dark-theme.scss
@@ -1,4 +1,4 @@
-@import '~@angular/material/theming';
+@import '../../../node_modules/@angular/material/theming';
html, body {
font-family: 'Roboto', 'Helvetica Neue', sans-serif;
diff --git a/src/theme/dark-Theme/darkTheme.const.ts b/src/theme/dark-Theme/darkTheme.const.ts
new file mode 100644
index 000000000..24b2d59e9
--- /dev/null
+++ b/src/theme/dark-Theme/darkTheme.const.ts
@@ -0,0 +1,46 @@
+export const dark = {
+ '--background-color': '#000000', // app.component.scss
+ '--mat-row': '#bbdefb', // creator/_dialogs/content-edit.component.scss
+ '--heading-4': '#4db6ac', // creator/_dialogs/content-edit.component.scss
+ '--content-creator-cell': '#ffe0b2', // creator/content-choice-creator.component.scss & creator/content-likert-creator.component.scss
+ '--content-creator-row': '#ffecb3', // creator/content-choice-creator.component.scss & creator/content-likert-creator.component.scss
+ '--content-mat-card': '#fff8e1', // creator/content-list.component.scss & creator/content-presentation.component.scss
+ // & creator/room-creator-page.component.scss & room-participant-page.component.scss
+ '--content-mat-expansion-panel': '#bbdefb', // creator/content-list.component.scss
+ '--content-prasentation-header': '#26a69a', // creator/content-presentation.component.scss
+ '--home-page-outer': '#bbdefb', // home/home-page.component.scss
+ '--positiveC': '#AED581', // shared/_dialogs/statistic-help.component.scss
+ '--negativeC': '#FF8A65', // shared/_dialogs/statistic-help.component.scss
+ '--okayC': '#FFD54F', // shared/_dialogs/statistic-help.component.scss
+ '--emptyC': '#E0E0E0', // shared/_dialogs/statistic-help.component.scss
+ '--comment-mat-card': '#4dd0e1', // shared/comment.component.scss
+ '--comment-mat-toolbar': '#bbdefb', // shared/comment.component.scss
+ '--upvoted': '#66bb6a', // shared/comment.component.scss
+ '--downvoted': '#FF8A65', // shared/comment.component.scss
+ '--incorrect-icon': '#c8e6c9', // shared/comment.component.scss
+ '--correct-icon': '#66bb6a', // shared/comment.component.scss
+ '--read-icon': '#1e88e5', // shared/comment.component.scss
+ '--unread-icon': '#e3f2fd', // shared/comment.component.scss
+ '--favorite-icon': '#fdd835', // shared/comment.component.scss
+ '--not-favorite-icon': '#fffde7', // shared/comment.component.scss
+ '--comment-list-bg': '#4db6ac', // shared/comment-list.component.scss
+ '--input-search-cl': '#80cbc4', // shared/comment-list.component.scss
+ '--content-group-card': '#bbdefb', // shared/content-groups.component.scss
+ '--footer-bg-color': 'rgb(240, 240, 240)', // shared/footer.component.scss
+ '--footer-button': '#80cbc4', // shared/footer.component.scss
+ '--list-st-hCell': '#4db6ac', // shared/list-statistic.component.scss
+ '--list-st-hCell-bg': '#e0e0e0', // shared/list-statistic.component.scss
+ '--list-st-mCell-bg': '#E0E0E0', // shared/list-statistic.component.scss
+ '--list-st-toolbar-bg': '#fff8e1', // shared/list-statistic.component.scss
+ '--positiveP': '#AED581', // shared/list-statistic.component.scss
+ '--negativeP': '#FF8A65 ', // shared/list-statistic.component.scss
+ '--okayP': '#FFB74D', // shared/list-statistic.component.scss
+ '--emptyC-color': '#E0E0E0', // shared/list-statistic.component.scss
+ '--emptyCC': '#E0E0E0', // shared/list-statistic.component.scss
+ '--room-list-mPanel': '#cfd8dc', // shared/room-list.component.scss
+ '--room-list-mPLHeader': '#cfd8dc', // shared/room-list.component.scss
+ '--room-list-mPHeader': '#bbdefb', // shared/room-list.component.scss
+ '--room-list-card-bg': '#cfd8dc', // shared/room-list.component.scss
+ '--room-list-card-color': '#4db6ac', // shared/room-list.component.scss
+ '--statistic-bg-color' : '#fff8e1', // shared/statistic.component.scss & shared/statistics-page.component.scss
+};
diff --git a/src/theme/_form.scss b/src/theme/default-Theme/_form.scss
similarity index 100%
rename from src/theme/_form.scss
rename to src/theme/default-Theme/_form.scss
diff --git a/src/theme/_theme.scss b/src/theme/default-Theme/_theme.scss
similarity index 58%
rename from src/theme/_theme.scss
rename to src/theme/default-Theme/_theme.scss
index 33dd1ada5..58ebcc5b6 100644
--- a/src/theme/_theme.scss
+++ b/src/theme/default-Theme/_theme.scss
@@ -1,4 +1,4 @@
-@import '~@angular/material/theming';
+@import './../../../node_modules/@angular/material/theming';
html, body {
font-family: 'Roboto', 'Helvetica Neue', sans-serif;
@@ -8,6 +8,6 @@ html, body {
height: 100%;
}
-@import '_util.scss';
-@import '_form.scss';
+@import 'util';
+@import 'form';
diff --git a/src/theme/_util.scss b/src/theme/default-Theme/_util.scss
similarity index 100%
rename from src/theme/_util.scss
rename to src/theme/default-Theme/_util.scss
diff --git a/src/theme/_variables.scss b/src/theme/default-Theme/_variables.scss
similarity index 91%
rename from src/theme/_variables.scss
rename to src/theme/default-Theme/_variables.scss
index 18e71b8b2..81c04ab7c 100644
--- a/src/theme/_variables.scss
+++ b/src/theme/default-Theme/_variables.scss
@@ -1,4 +1,4 @@
-@import '~@angular/material/theming';
+@import './../../../node_modules/@angular/material/theming';
// Define the palettes for your theme using the Material Design palettes available in palette.scss
// (imported above). For each palette, you can optionally specify a default, lighter, and darker
// hue. Available color palettes: https://www.google.com/design/spec/style/color.html
diff --git a/src/theme/default-Theme/defaultTheme.const.ts b/src/theme/default-Theme/defaultTheme.const.ts
new file mode 100644
index 000000000..b8835a3d8
--- /dev/null
+++ b/src/theme/default-Theme/defaultTheme.const.ts
@@ -0,0 +1,46 @@
+export const defaultTheme = {
+ '--background-color': '#b2dfdb', // app.component.scss
+ '--mat-row': '#bbdefb', // creator/_dialogs/content-edit.component.scss
+ '--heading-4': '#4db6ac', // creator/_dialogs/content-edit.component.scss
+ '--content-creator-cell': '#ffe0b2', // creator/content-choice-creator.component.scss & creator/content-likert-creator.component.scss
+ '--content-creator-row': '#ffecb3', // creator/content-choice-creator.component.scss & creator/content-likert-creator.component.scss
+ '--content-mat-card': '#fff8e1', // creator/content-list.component.scss & creator/content-presentation.component.scss
+ // & creator/room-creator-page.component.scss & room-participant-page.component.scss
+ '--content-mat-expansion-panel': '#bbdefb', // creator/content-list.component.scss
+ '--content-prasentation-header': '#26a69a', // creator/content-presentation.component.scss
+ '--home-page-outer': '#bbdefb', // home/home-page.component.scss
+ '--positiveC': '#AED581', // shared/_dialogs/statistic-help.component.scss
+ '--negativeC': '#FF8A65', // shared/_dialogs/statistic-help.component.scss
+ '--okayC': '#FFD54F', // shared/_dialogs/statistic-help.component.scss
+ '--emptyC': '#E0E0E0', // shared/_dialogs/statistic-help.component.scss
+ '--comment-mat-card': '#4dd0e1', // shared/comment.component.scss
+ '--comment-mat-toolbar': '#bbdefb', // shared/comment.component.scss
+ '--upvoted': '#66bb6a', // shared/comment.component.scss
+ '--downvoted': '#FF8A65', // shared/comment.component.scss
+ '--incorrect-icon': '#c8e6c9', // shared/comment.component.scss
+ '--correct-icon': '#66bb6a', // shared/comment.component.scss
+ '--read-icon': '#1e88e5', // shared/comment.component.scss
+ '--unread-icon': '#e3f2fd', // shared/comment.component.scss
+ '--favorite-icon': '#fdd835', // shared/comment.component.scss
+ '--not-favorite-icon': '#fffde7', // shared/comment.component.scss
+ '--comment-list-bg': '#4db6ac', // shared/comment-list.component.scss
+ '--input-search-cl': '#80cbc4', // shared/comment-list.component.scss
+ '--content-group-card': '#bbdefb', // shared/content-groups.component.scss
+ '--footer-bg-color': 'rgb(240, 240, 240)', // shared/footer.component.scss
+ '--footer-button': '#80cbc4', // shared/footer.component.scss
+ '--list-st-hCell': '#4db6ac', // shared/list-statistic.component.scss
+ '--list-st-hCell-bg': '#e0e0e0', // shared/list-statistic.component.scss
+ '--list-st-mCell-bg': '#E0E0E0', // shared/list-statistic.component.scss
+ '--list-st-toolbar-bg': '#fff8e1', // shared/list-statistic.component.scss
+ '--positiveP': '#AED581', // shared/list-statistic.component.scss
+ '--negativeP': '#FF8A65 ', // shared/list-statistic.component.scss
+ '--okayP': '#FFB74D', // shared/list-statistic.component.scss
+ '--emptyC-color': '#E0E0E0', // shared/list-statistic.component.scss
+ '--emptyCC': '#E0E0E0', // shared/list-statistic.component.scss
+ '--room-list-mPanel': '#cfd8dc', // shared/room-list.component.scss
+ '--room-list-mPLHeader': '#cfd8dc', // shared/room-list.component.scss
+ '--room-list-mPHeader': '#bbdefb', // shared/room-list.component.scss
+ '--room-list-card-bg': '#cfd8dc', // shared/room-list.component.scss
+ '--room-list-card-color': '#4db6ac', // shared/room-list.component.scss
+ '--statistic-bg-color': '#fff8e1', // shared/statistic.component.scss & shared/statistics-page.component.scss
+};
--
GitLab