Merge branch 'Development' of code-repo.d4science.org:MaDgiK-CITE/argos into Development

dmp-backend/data/src/main/java/eu/eudat/data/entities/DMP.java

@@ -25,7 +25,12 @@ import java.util.stream.Collectors;
                 name = "fullyDetailed",
                 attributeNodes = {
                         @NamedAttributeNode("grant"), @NamedAttributeNode("profile"),
-                        @NamedAttributeNode("users"), @NamedAttributeNode("organisations"), @NamedAttributeNode("researchers")}),
+                        @NamedAttributeNode(value = "users", subgraph = "users"), @NamedAttributeNode("organisations"), @NamedAttributeNode("researchers")
+                },
+                subgraphs = {
+                        @NamedSubgraph(name = "users", attributeNodes = {@NamedAttributeNode("user")})
+                }
+        ),
         @NamedEntityGraph(
                 name = "dmpRecentActivity",
                 attributeNodes = {

dmp-backend/web/src/main/java/eu/eudat/logic/utilities/documents/word/WordBuilder.java

@@ -941,10 +941,14 @@ public class WordBuilder {
                         } else if(datasetEntity != null && text.contains("{ARGOS.DATASET.TITLE}")) {
                             text = text.replace("{ARGOS.DATASET.TITLE}", datasetEntity.getLabel());
                             r.setText(text, 0);
-                        } else if(datasetEntity != null && text.contains("{ARGOS.DATASET.DESCRIPTION}")) {
+                        } else if((dmpEntity != null && text.contains("{ARGOS.DMP.DESCRIPTION}")) || (datasetEntity != null && text.contains("{ARGOS.DATASET.DESCRIPTION}"))) {
                             descrParPos = parPos;
                             descrPar = p;
-                            text = text.replace("{ARGOS.DATASET.DESCRIPTION}", "");
+                            if(dmpEntity != null) {
+                                text = text.replace("{ARGOS.DMP.DESCRIPTION}", "");
+                            } else {
+                                text = text.replace("{ARGOS.DATASET.DESCRIPTION}", "");
+                            }
                             r.setText(text, 0);
                         } else if(text.equals("{ARGOS.DMP.RESEARCHERS}")) {
                             String researchersNames = "";
@@ -974,7 +978,14 @@ public class WordBuilder {
             }
             parPos++;
         }
-        if(descrParPos != -1 && datasetEntity.getDescription() != null) {
+        if(descrParPos != -1 && dmpEntity!=null && dmpEntity.getDescription() != null) {
+            XmlCursor cursor = descrPar.getCTP().newCursor();
+            cursor.toNextSibling();
+            Document htmlDoc = Jsoup.parse(((String)dmpEntity.getDescription()).replaceAll("\n", "<br>"));
+            HtmlToWorldBuilder htmlToWorldBuilder = new HtmlToWorldBuilder(descrPar, 0, cursor);
+            NodeTraversor.traverse(htmlToWorldBuilder, htmlDoc);
+        }
+        if(descrParPos != -1 && datasetEntity != null && datasetEntity.getDescription() != null) {
             XmlCursor cursor = descrPar.getCTP().newCursor();
             cursor.toNextSibling();
             Document htmlDoc = Jsoup.parse(((String)datasetEntity.getDescription()).replaceAll("\n", "<br>"));

dmp-backend/web/src/main/java/eu/eudat/publicapi/controllers/PublicDmpsDocumentation.java

@@ -47,6 +47,7 @@ public class PublicDmpsDocumentation extends BaseController {
             "4.6. version: integer, version of dmp\n" +
             "4.7. groupId: uuid, group id in which dmp belongs\n" +
             "4.8. users: list of UserInfoPublicModel, user who collaborated on the dmp\n" +
+            "4.9. researchers: list of ResearcherPublicModel, researchers involved in the dmp\n" +
             "4.9. finalizedAt: date, finalization date\n" +
             "4.10. publishedAt: date, publication date\n";
     private static final String getPagedResponseExample = "{\n" +
@@ -94,13 +95,16 @@ public class PublicDmpsDocumentation extends BaseController {
             " 1. periodStart: date, dmps created date greater than periodStart\n" +
             " 2. periodEnd: date, dmps created date less than periodEnd\n" +
             " 3. grants: list of uuids, dmps with the corresponding grants\n" +
-            " 4. funders: list of uuids, dmps with the corresponding funders\n" +
+            " 4. grantsLike: list of strings, dmps fetched having their grant matching any of the strings provided\n" +
-            " 5. datasetTemplates: list of uuids, dataset templates which are described in the dmps\n" +
+            " 5. funders: list of uuids, dmps with the corresponding funders\n" +
-            " 6. dmpOrganisations: list of strings, dmps belonging to these organisations\n" +
+            " 6. fundersLike: list of strings, dmps fetched having their funders matching any of the strings provided\n" +
-            " 7. collaborators: list of uuids, user who collaborated on the creation/modification of dmps\n" +
+            " 7. datasetTemplates: list of uuids, dataset templates which are described in the dmps\n" +
-            " 8. allVersions: boolean, if dmps should be fetched with all their versions\n" +
+            " 8. dmpOrganisations: list of strings, dmps belonging to these organisations\n" +
-            " 9. groupIds: list of uuids, in which groups the dmps are\n" +
+            " 9. collaborators: list of uuids, user who collaborated on the creation/modification of dmps\n" +
-            "10. like: string, dmps fetched have this string matched in their label or description\n";
+            "10. collaboratorsLike: list of strings, dmps fetched having their collaborators matching any of the strings provided\n" +
+            "11. allVersions: boolean, if dmps should be fetched with all their versions\n" +
+            "12. groupIds: list of uuids, in which groups the dmps are\n" +
+            "13. like: string, dmps fetched have this string matched in their label or description\n";
     private static final String getPagedRequestParamDescription = "The fieldsGroup is a string which indicates if the returned objects would have all their properties\n" +
             "There are two available values: 1) listing and 2) autocomplete\n" +
             "**listing**: returns objects with all their properties completed\n" +

dmp-backend/web/src/main/java/eu/eudat/publicapi/criteria/dmp/DataManagementPlanPublicCriteria.java

@@ -15,14 +15,20 @@ public class DataManagementPlanPublicCriteria extends Criteria<DMP> {
     private Date periodEnd;
     @ApiModelProperty(value = "grants", name = "grants", dataType = "List<UUID>", example = "[]")
     private List<UUID> grants;
+    @ApiModelProperty(value = "grantsLike", name = "grantsLike", dataType = "List<String>", example = "[]")
+    private List<String> grantsLike;
     @ApiModelProperty(value = "funders", name = "funders", dataType = "List<UUID>", example = "[]")
     private List<UUID> funders;
+    @ApiModelProperty(value = "fundersLike", name = "fundersLike", dataType = "List<String>", example = "[]")
+    private List<String> fundersLike;
     @ApiModelProperty(value = "datasetTemplates", name = "datasetTemplates", dataType = "List<UUID>", example = "[]")
     private List<UUID> datasetTemplates;
     @ApiModelProperty(value = "dmpOrganisations", name = "dmpOrganisations", dataType = "List<String>", example = "[]")
     private List<String> dmpOrganisations;
     @ApiModelProperty(value = "collaborators", name = "collaborators", dataType = "List<UUID>", example = "[]")
     private List<UUID> collaborators;
+    @ApiModelProperty(value = "collaboratorsLike", name = "collaboratorsLike", dataType = "List<String>", example = "[]")
+    private List<String> collaboratorsLike;
     @ApiModelProperty(value = "allVersions", name = "allVersions", dataType = "Boolean", example = "false")
     private boolean allVersions;
     @ApiModelProperty(value = "groupIds", name = "groupIds", dataType = "List<UUID>", example = "[]")
@@ -49,6 +55,13 @@ public class DataManagementPlanPublicCriteria extends Criteria<DMP> {
         this.grants = grants;
     }
 
+    public List<String> getGrantsLike() {
+        return grantsLike;
+    }
+    public void setGrantsLike(List<String> grantsLike) {
+        this.grantsLike = grantsLike;
+    }
+
     public List<UUID> getFunders() {
         return funders;
     }
@@ -56,6 +69,13 @@ public class DataManagementPlanPublicCriteria extends Criteria<DMP> {
         this.funders = funders;
     }
 
+    public List<String> getFundersLike() {
+        return fundersLike;
+    }
+    public void setFundersLike(List<String> fundersLike) {
+        this.fundersLike = fundersLike;
+    }
+
     public List<UUID> getDatasetTemplates() {
         return datasetTemplates;
     }
@@ -77,6 +97,13 @@ public class DataManagementPlanPublicCriteria extends Criteria<DMP> {
         this.collaborators = collaborators;
     }
 
+    public List<String> getCollaboratorsLike() {
+        return collaboratorsLike;
+    }
+    public void setCollaboratorsLike(List<String> collaboratorsLike) {
+        this.collaboratorsLike = collaboratorsLike;
+    }
+
     public boolean getAllVersions() {
         return allVersions;
     }

dmp-backend/web/src/main/java/eu/eudat/publicapi/managers/DataManagementPlanPublicManager.java

@@ -57,8 +57,6 @@ public class DataManagementPlanPublicManager {
             dataTable.setTotalCount(count);
         });
         CompletableFuture.allOf(itemsFuture, countFuture).join();
-        if(dataTable.getTotalCount() > dmpTableRequest.getLength())
-            dataTable.setTotalCount((long)dmpTableRequest.getLength());
 
         return dataTable;
     }

dmp-backend/web/src/main/java/eu/eudat/publicapi/managers/DatasetPublicManager.java

@@ -113,11 +113,7 @@ public class DatasetPublicManager {
                 select(this::mapPublicModel);
 
         dataTable.setData(datasetLists.stream().filter(Objects::nonNull).collect(Collectors.toList()));
-        if(count <= datasetTableRequest.getLength())
+        dataTable.setTotalCount(count);
-            dataTable.setTotalCount(count);
-        else
-            dataTable.setTotalCount((long)datasetTableRequest.getLength());
-        //CompletableFuture.allOf(countFuture).join();
         return dataTable;
     }
 

dmp-backend/web/src/main/java/eu/eudat/publicapi/models/listingmodels/DataManagementPlanPublicListingModel.java

@@ -3,12 +3,10 @@ package eu.eudat.publicapi.models.listingmodels;
 import eu.eudat.data.entities.DMP;
 import eu.eudat.data.entities.Grant;
 import eu.eudat.models.DataModel;
+import eu.eudat.publicapi.models.researcher.ResearcherPublicModel;
 import eu.eudat.publicapi.models.user.UserInfoPublicModel;
 
-import java.util.ArrayList;
+import java.util.*;
-import java.util.Date;
-import java.util.List;
-import java.util.UUID;
 import java.util.stream.Collectors;
 
 public class DataManagementPlanPublicListingModel implements DataModel<DMP, DataManagementPlanPublicListingModel> {
@@ -20,6 +18,7 @@ public class DataManagementPlanPublicListingModel implements DataModel<DMP, Data
     private int version;
     private UUID groupId;
     private List<UserInfoPublicModel> users;
+    private List<ResearcherPublicModel> researchers;
     private Date finalizedAt;
     private Date publishedAt;
 
@@ -79,6 +78,13 @@ public class DataManagementPlanPublicListingModel implements DataModel<DMP, Data
         this.users = users;
     }
 
+    public List<ResearcherPublicModel> getResearchers() {
+        return researchers;
+    }
+    public void setResearchers(List<ResearcherPublicModel> researchers) {
+        this.researchers = researchers;
+    }
+
     public Date getFinalizedAt() {
         return finalizedAt;
     }
@@ -125,9 +131,11 @@ public class DataManagementPlanPublicListingModel implements DataModel<DMP, Data
         this.modifiedAt = entity.getModified();
         try {
             this.users = entity.getUsers() != null ? entity.getUsers().stream().map(x -> new UserInfoPublicModel().fromDataModel(x)).collect(Collectors.toList()) : new ArrayList<>();
+            this.researchers = entity.getResearchers() != null ? entity.getResearchers().stream().map(x -> new ResearcherPublicModel().fromDataModel(x)).collect(Collectors.toList()) : new ArrayList<>();
         }
         catch(Exception ex){
             this.users = new ArrayList<>();
+            this.researchers = new ArrayList<>();
         }
         this.finalizedAt = entity.getFinalizedAt();
         this.publishedAt = entity.getPublishedAt();
@@ -151,11 +159,12 @@ public class DataManagementPlanPublicListingModel implements DataModel<DMP, Data
         grant.setLabel(this.getGrant());
         entity.setGrant(grant);
         entity.setUsers(this.getUsers().stream().map(UserInfoPublicModel::toDataModel).collect(Collectors.toSet()));
+        entity.setResearchers(this.getResearchers().stream().map(ResearcherPublicModel::toDataModel).collect(Collectors.toSet()));
         return entity;
     }
 
     @Override
     public String getHint() {
-        return "dataManagementPlanListingModel";
+        return "fullyDetailed";
     }
 }

dmp-backend/web/src/main/java/eu/eudat/publicapi/request/dmp/DataManagmentPlanPublicTableRequest.java

@@ -8,9 +8,9 @@ import eu.eudat.queryable.QueryableList;
 import eu.eudat.queryable.types.FieldSelectionType;
 import eu.eudat.queryable.types.SelectionField;
 
-import java.util.Arrays;
+import javax.persistence.criteria.Predicate;
-import java.util.Date;
+import java.util.*;
-import java.util.UUID;
+import java.util.stream.Collectors;
 
 public class DataManagmentPlanPublicTableRequest extends TableQuery<DataManagementPlanPublicCriteria, DMP, UUID> {
 
@@ -27,8 +27,36 @@ public class DataManagmentPlanPublicTableRequest extends TableQuery<DataManageme
             query.where((builder, root) -> builder.lessThan(root.get("created"), this.getCriteria().getPeriodEnd()));
         if (this.getCriteria().getGrants() != null && !this.getCriteria().getGrants().isEmpty())
             query.where(((builder, root) -> root.get("grant").get("id").in(this.getCriteria().getGrants())));
+        if (this.getCriteria().getGrantsLike() != null && !this.getCriteria().getGrantsLike().isEmpty()) {
+            query.where(((builder, root) -> {
+                List<Predicate> predicates = new ArrayList<>();
+                for(String grantLike: this.getCriteria().getGrantsLike()){
+                    String pattern = "%" + grantLike.toUpperCase() + "%";
+                    predicates.add(builder.like(builder.upper(root.get("grant").get("label")), pattern));
+                    predicates.add(builder.like(builder.upper(root.get("grant").get("abbreviation")), pattern));
+                    predicates.add(builder.like(builder.upper(root.get("grant").get("reference")), pattern));
+                    predicates.add(builder.like(builder.upper(root.get("grant").get("definition")), pattern));
+                    predicates.add(builder.like(builder.upper(root.get("grant").get("description")), pattern));
+                }
+                return builder.or(predicates.toArray(new Predicate[0]));
+            }
+            ));
+        }
         if (this.getCriteria().getFunders() != null && !this.getCriteria().getFunders().isEmpty())
             query.where(((builder, root) -> root.get("grant").get("funder").get("id").in(this.getCriteria().getFunders())));
+        if (this.getCriteria().getFundersLike() != null && !this.getCriteria().getFundersLike().isEmpty()) {
+            query.where(((builder, root) -> {
+                    List<Predicate> predicates = new ArrayList<>();
+                    for(String funderLike: this.getCriteria().getFundersLike()){
+                        String pattern = "%" + funderLike.toUpperCase() + "%";
+                        predicates.add(builder.like(builder.upper(root.get("grant").get("funder").get("label")), pattern));
+                        predicates.add(builder.like(builder.upper(root.get("grant").get("funder").get("reference")), pattern));
+                        predicates.add(builder.like(builder.upper(root.get("grant").get("funder").get("definition")), pattern));
+                    }
+                    return builder.or(predicates.toArray(new Predicate[0]));
+                }
+            ));
+        }
 
         //query.where((builder, root) -> builder.lessThan(root.get("grant").get("enddate"), new Date())); // GrantStateType.FINISHED
         query.where((builder, root) ->
@@ -41,6 +69,19 @@ public class DataManagmentPlanPublicTableRequest extends TableQuery<DataManageme
             query.where(((builder, root) -> root.join("organisations").get("reference").in(this.getCriteria().getDmpOrganisations())));
         if (this.getCriteria().getCollaborators() != null && !this.getCriteria().getCollaborators().isEmpty())
             query.where(((builder, root) -> root.join("researchers").get("id").in(this.getCriteria().getCollaborators())));
+        if (this.getCriteria().getCollaboratorsLike() != null && !this.getCriteria().getCollaboratorsLike().isEmpty()) {
+            query.where(((builder, root) -> {
+                List<Predicate> predicates = new ArrayList<>();
+                for(String collaboratorLike: this.getCriteria().getCollaboratorsLike()){
+                    String pattern = "%" + collaboratorLike.toUpperCase() + "%";
+                    predicates.add(builder.like(builder.upper(root.join("researchers").get("label")), pattern));
+                    predicates.add(builder.like(builder.upper(root.join("researchers").get("uri")), pattern));
+                    predicates.add(builder.like(builder.upper(root.join("researchers").get("primaryEmail")), pattern));
+                }
+                return builder.or(predicates.toArray(new Predicate[0]));
+            }
+            ));
+        }
         if (!this.getCriteria().getAllVersions()) {
             query.initSubQuery(String.class).where((builder, root) -> builder.equal(root.get("version"),
                     query.<String>subQueryMax((builder1, externalRoot, nestedRoot) -> builder1.and(builder1.equal(externalRoot.get("groupId"),
@@ -49,6 +90,7 @@ public class DataManagmentPlanPublicTableRequest extends TableQuery<DataManageme
         if (this.getCriteria().getGroupIds() != null && !this.getCriteria().getGroupIds().isEmpty()) {
             query.where((builder, root) -> root.get("groupId").in(this.getCriteria().getGroupIds()));
         }
+        query.where((builder, root) -> builder.notEqual(root.get("status"), DMP.DMPStatus.DELETED.getValue()));
         return query;
     }
 

dmp-frontend/angular.json

@@ -30,7 +30,6 @@
 						"scripts": [
 							"node_modules/cookieconsent/build/cookieconsent.min.js",
 							"node_modules/tinymce/tinymce.min.js"
-
 						],
 						"vendorChunk": true,
 						"extractLicenses": false,

dmp-frontend/src/app/core/services/configuration/configuration.service.ts

@@ -41,6 +41,11 @@ export class ConfigurationService extends BaseComponent {
 		return this._defaultLanguage;
 	}
 
+	private _availableLanguages: any[] = [];
+	get availableLanguages(): any[] {
+		return this._availableLanguages;
+	}
+
 	private _loginProviders: LoginProviders;
 	get loginProviders(): LoginProviders {
 		return this._loginProviders;
@@ -127,6 +132,7 @@ export class ConfigurationService extends BaseComponent {
 		this._helpService = HelpService.parseValue(config.HelpService);
 		this._defaultCulture = config.defaultCulture;
 		this._defaultLanguage = config.defaultLanguage;
+		this._availableLanguages = config.availableLanguages;
 		this._loginProviders = LoginProviders.parseValue(config.loginProviders);
 		this._logging = Logging.parseValue(config.logging);
 		this._lockInterval = config.lockInterval;

dmp-frontend/src/app/core/services/language/language.service.ts

@@ -7,8 +7,6 @@ import { BaseHttpService } from '../http/base-http.service';
 import { Language } from '@app/models/language/Language';
 import { ConfigurationService } from '../configuration/configuration.service';
 
-const availableLanguages: any[] = require('../../../../assets/resources/language.json');
-
 @Injectable()
 export class LanguageService {
 	private currentLanguage: string;
@@ -43,7 +41,7 @@ export class LanguageService {
 
 	public getCurrentLanguageName() {
 		let result: string = '';
-		availableLanguages.forEach(language => {
+		this.configurationService.availableLanguages.forEach(language => {
 			if (language.value === this.currentLanguage) {
 				result = this.translate.instant(language.label);
 			}

dmp-frontend/src/app/library/auto-complete/multiple/multiple-auto-complete.component.scss

@@ -65,7 +65,7 @@
 		margin: 0px 5px 0px 10px;
 	}
 	mat-icon:hover {
-		color: #129d99;
+		color: var(--primary-color);
 	}
 }
 

dmp-frontend/src/app/library/export-method-dialog/export-method-dialog.component.scss

@@ -10,7 +10,7 @@
 
 	button {
 		// background-color: #aaaaaa;
-		background-color: #00b29f;
+		background-color: var(--primary-color-3);
 		color: #ffffff;
 	}
 }

dmp-frontend/src/app/library/guided-tour/guided-tour.component.html

@@ -37,8 +37,7 @@
                 </div>
             </div>
             <div class="col-auto p-0 d-flex align-items-end">
-				<img src="../../../assets/splash/assets/img/2_Sign_in/Png/Sign In - Copy.png" width="190px" height="210px">
+				<img src="../../../assets/images/guided-tour-side.png">
-				<!-- <div class="argos-present-img"></div> -->
 			</div>
         </div>
     </div>

dmp-frontend/src/app/library/guided-tour/guided-tour.component.scss

@@ -211,9 +211,9 @@ ngx-guided-tour {
 				// float: right;
 				min-width: 133px;
 				height: 40px;
-				border: 1px solid #129d99;
+				border: 1px solid var(--primary-color);
 				background: #ffffff 0% 0% no-repeat padding-box;
-				color: #129d99;
+				color: var(--primary-color);
 			}
 
 			.next-button {
@@ -231,7 +231,7 @@ ngx-guided-tour {
 				padding-left: 1em;
 				padding-right: 1em;
 				min-width: 101px;
-				background: #129d99 0% 0% no-repeat padding-box;
+				background: var(--primary-color) 0% 0% no-repeat padding-box;
 			}
 
 			/*custom add*/
@@ -245,16 +245,5 @@ ngx-guided-tour {
 				border-radius: 30px;
 			}
 		}
-
-		/*custom add*/
-		.argos-present-img {
-			background: url("../../../assets/splash/assets/img/2_Sign_in/Svg/Sign\ In.svg") no-repeat;
-			min-width: 176px;
-			height: 220px;
-			position: relative;
-			top: 110px;
-			left: -85px;
-			border-top: none;
-		}
 	}
 }

dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/composite-field/dataset-profile-editor-composite-field.component.scss

@@ -15,7 +15,7 @@
 
 //Palete
 
-$blue-color : #129D99;
+$blue-color : var(--primary-color);
 $blue-color-light: #5cf7f2;
 
 .actions-list{

dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/field/dataset-profile-editor-field.component.scss

@@ -14,7 +14,7 @@ mat-radio-button{
 }
 
 li.list-inline-item{
-  color: #129D99;
+  color: var(--primary-color);
   .mat-icon{
     vertical-align: bottom;
   }
@@ -27,7 +27,7 @@ li.list-inline-item{
     color: #212121;
   }
   .mat-slide-toggle.mat-checked .mat-slide-toggle-thumb {
-    background-color:#129D99 ;
+    background-color:var(--primary-color) ;
   }
   .mat-slide-toggle.mat-checked .mat-slide-toggle-bar {
     background-color:rgba(0,178,159,0.34);

dmp-frontend/src/app/ui/admin/dataset-profile/editor/components/section-fieldset/dataset-profile-editor-section-fieldset.component.scss

@@ -1,4 +1,4 @@
-$blue-color : #129D99;
+$blue-color : var(--primary-color);
 $blue-color-light: #5cf7f2;
 
 
@@ -33,7 +33,7 @@ $blue-color-light: #5cf7f2;
 }
 .actions-list{
   //   border: 1px solid $blue-color;
-  // box-shadow: 0px 3px 12px #129D9999;
+  // box-shadow: 0px 3px 12px var(--primary-color)99;
   border-radius: 4px;
   // padding-top: 1rem;
   padding: 1em 0.9em;
@@ -59,7 +59,7 @@ $blue-color-light: #5cf7f2;
       margin-right: 0.5em;
       margin-left: -.09em;
       height: auto;
-      color: #129D99;;
+      color: var(--primary-color);;
     }
     .input_icon{
       width: 14px;

dmp-frontend/src/app/ui/admin/dataset-profile/editor/dataset-profile-editor.component.scss

@@ -72,7 +72,7 @@
 	transition-timing-function: ease-out;
 	transition-delay: 50ms;
 	box-shadow: 0px 1px 2px #bfbfbf;
-	background-color: #F7DD72;
+	background-color: var(--secondary-color);
 }
 #progress-container{
 	box-shadow: 1px 1px 6px #00000029;;
@@ -81,8 +81,8 @@
 // .import-btn {
 // 	background: #ffffff 0% 0% no-repeat padding-box;
 // 	border-radius: 30px;
-// 	// color: #129d99;
+// 	// color: var(--primary-color);
-// 	// border: 1px solid #129d99;
+// 	// border: 1px solid var(--primary-color);
 // 	padding-left: 2em;
 // 	padding-right: 2em;
 // 	color: #000;
@@ -90,7 +90,7 @@
 //   }
 .navigate-btn {
 	border-radius: 30px;
-	background-color: #f7dd72;
+	background-color: var(--secondary-color);
 	border: 1px solid transparent;
 	padding-left: 2em;
 	padding-right: 2em;
@@ -108,7 +108,7 @@ color: #FFF;
 
 .create-section-btn {
 	border-radius: 30px;
-	background-color: #f7dd72;
+	background-color: var(--secondary-color);
 	border: 1px solid transparent;
 	padding-left: 1em;
 	padding-right: 1em;
@@ -117,21 +117,21 @@ color: #FFF;
 }
 
 
-$blue-color : #129D99;
+$blue-color : var(--primary-color);
 $blue-color-light: #5cf7f2;
 
 .finalize-btn {
 	border-radius: 30px;
-	border: 1px solid #129D99;
+	border: 1px solid var(--primary-color);
 	background: transparent;
 	padding-left: 2em;
 	padding-right: 2em;
 	box-shadow: 0px 3px 6px #1E202029;
-	color: #129D99;
+	color: var(--primary-color);
 }
 .template_action_btn{
 	border-radius: 30px;
-	border: 1px solid #129D99;
+	border: 1px solid var(--primary-color);
 	background: transparent;
 	//padding-left: 2em;
 	//padding-right: 2em;
@@ -139,10 +139,10 @@ $blue-color-light: #5cf7f2;
 	min-width: 110px;
 	width: auto;
 	box-shadow: 0px 3px 6px #1E202029;
-	color: #129D99;
+	color: var(--primary-color);
 	flex: 0 0 auto;
 	&.save-btn{
-		background-color: #f7dd72;
+		background-color: var(--secondary-color);
 		border: 1px solid transparent;
 		//padding-left: 2em;
 		//padding-right: 2em;
@@ -196,7 +196,7 @@ $blue-color-light: #5cf7f2;
 
 .actions-list{
 	//   border: 1px solid $blue-color;
-	box-shadow: 0px 3px 12px #129D9999;
+	box-shadow: 0px 3px 12px var(--primary-color)99;
 	border-radius: 4px;
 	// padding-top: 1rem;
 	padding: 1em 0.9em;
@@ -220,7 +220,7 @@ $blue-color-light: #5cf7f2;
 			margin-right: 0.5em;
 			margin-left: -.09em;
 			height: auto;
-			color: #129D99;;
+			color: var(--primary-color);;
 		}
 		.input_icon{
 			width: 14px;
@@ -322,7 +322,7 @@ $blue-color-light: #5cf7f2;
 	position: fixed;
 	bottom: 20em;
 	right: 2em;
-	color: #129D99 !important;
+	color: var(--primary-color) !important;
 	cursor: pointer;
 	font-size: 1rem;
 	font-weight: 400;

dmp-frontend/src/app/ui/admin/dataset-profile/listing/criteria/dialog-confirmation-upload-profile/dialog-confirmation-upload-profiles.component.scss

@@ -15,12 +15,12 @@ min-width: 101px;
 
 .next-btn {
 	background: #ffffff 0% 0% no-repeat padding-box;
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
 	border-radius: 30px;
 	opacity: 1;
 min-width: 101px;
 	height: 43px;
-	color: #129d99;
+	color: var(--primary-color);
 	font-weight: 500;
 }
 
@@ -34,7 +34,7 @@ min-width: 101px;
 }
 
 .next-btn:not([disabled]):hover {
-	background-color: #129d99;
+	background-color: var(--primary-color);
 	color: #ffffff;
 }
 
@@ -86,15 +86,15 @@ min-width: 101px;
 	width: 156px;
 	height: 44px;
 	color: #ffffff;
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	box-shadow: 0px 3px 6px #1e202029;
 	border-radius: 30px;
 }
 
 .attach-file:hover {
 	background-color: #ffffff;
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
-	color: #129d99;
+	color: var(--primary-color);
 }
 
 .close-btn:hover{

dmp-frontend/src/app/ui/admin/dataset-profile/listing/dataset-profile-listing.component.scss

@@ -104,8 +104,8 @@ mat-row:hover {
 .import-btn {
   background: #ffffff 0% 0% no-repeat padding-box;
   border-radius: 30px;
-  // color: #129d99;
+  // color: var(--primary-color);
-  // border: 1px solid #129d99;
+  // border: 1px solid var(--primary-color);
   padding-left: 2em;
   padding-right: 2em;
   color: #000;
@@ -113,7 +113,7 @@ mat-row:hover {
 }
 .create-btn {
   border-radius: 30px;
-  background-color: #f7dd72;
+  background-color: var(--secondary-color);
   padding-left: 2em;
   padding-right: 2em;
 }

dmp-frontend/src/app/ui/admin/dataset-profile/table-of-contents/table-of-contents-internal-section/table-of-contents-internal-section.scss

@@ -83,9 +83,9 @@
 
 
 
-$blue-color : #129D99;
+$blue-color : var(--primary-color);
 $blue-color-light: #5cf7f2;
-$yellow: #f7dd72;
+$yellow: var(--secondary-color);
 .badge-ball{
   display: inline-block;
   border-radius: 50%;

dmp-frontend/src/app/ui/admin/dmp-profile/editor/dmp-profile-editor.component.scss

@@ -20,7 +20,7 @@
 }
 
 ::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
-	background-color: #00b29f;
+	background-color: var(--primary-color-3);
 	// background-color: #0070c0;
 }
 
@@ -30,12 +30,12 @@
 
 .finalize-btn {
 	border-radius: 30px;
-	border: 1px solid #129D99;
+	border: 1px solid var(--primary-color);
 	background: transparent;
 	padding-left: 2em;
 	padding-right: 2em;
 	box-shadow: 0px 3px 6px #1E202029;
-	color: #129D99;
+	color: var(--primary-color);
   &:disabled{
 		background-color: #CBCBCB;
 		color: #FFF;
@@ -45,7 +45,7 @@
 
 .action-btn {
 	border-radius: 30px;
-	background-color: #f7dd72;
+	background-color: var(--secondary-color);
 	border: 1px solid transparent;
 	padding-left: 2em;
 	padding-right: 2em;

dmp-frontend/src/app/ui/admin/dmp-profile/listing/criteria/dialog-confirmation-upload-profile/dialog-confirmation-upload-profiles.component.scss

@@ -15,12 +15,12 @@ min-width: 101px;
 
 .next-btn {
 	background: #ffffff 0% 0% no-repeat padding-box;
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
 	border-radius: 30px;
 	opacity: 1;
 min-width: 101px;
 	height: 43px;
-	color: #129d99;
+	color: var(--primary-color);
 	font-weight: 500;
 }
 
@@ -34,7 +34,7 @@ min-width: 101px;
 }
 
 .next-btn:not([disabled]):hover {
-	background-color: #129d99;
+	background-color: var(--primary-color);
 	color: #ffffff;
 }
 
@@ -86,15 +86,15 @@ min-width: 101px;
 	width: 156px;
 	height: 44px;
 	color: #ffffff;
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	box-shadow: 0px 3px 6px #1e202029;
 	border-radius: 30px;
 }
 
 .attach-file:hover {
 	background-color: #ffffff;
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
-	color: #129d99;
+	color: var(--primary-color);
 }
 
 .close-btn:hover{

dmp-frontend/src/app/ui/admin/dmp-profile/listing/dmp-profile-listing.component.scss

@@ -37,7 +37,7 @@
 }
 .create-btn {
   border-radius: 30px;
-  background-color: #f7dd72;
+  background-color: var(--secondary-color);
   padding-left: 2em;
   padding-right: 2em;
   // color: #000;
@@ -50,8 +50,8 @@
 .import-btn {
   background: #ffffff 0% 0% no-repeat padding-box;
   border-radius: 30px;
-  // color: #129d99;
+  // color: var(--primary-color);
-  // border: 1px solid #129d99;
+  // border: 1px solid var(--primary-color);
   padding-left: 2em;
   padding-right: 2em;
   color: #000;

dmp-frontend/src/app/ui/admin/user/listing/criteria/user-criteria.component.scss

@@ -14,7 +14,7 @@
 	}
 
 	.search-form mat-icon {
-		color: #129d99;
+		color: var(--primary-color);
 	}
 }
 

dmp-frontend/src/app/ui/admin/user/listing/role-editor/user-role-editor.component.scss

@@ -20,7 +20,7 @@
 	}
 
 	.row-action {
-		color: #129d99;
+		color: var(--primary-color);
 		cursor: pointer;
 	}
 	.user-role{

dmp-frontend/src/app/ui/admin/user/listing/user-listing.component.scss

@@ -50,8 +50,8 @@
 		background: #ffffff 0% 0% no-repeat padding-box;
 		border-radius: 30px;
 		width: 145px;
-		color: #129d99;
+		color: var(--primary-color);
-		border: 1px solid #129d99;
+		border: 1px solid var(--primary-color);
 	}
 
 	.export-icon {

dmp-frontend/src/app/ui/auth/login/login.component.scss

@@ -32,13 +32,13 @@
   font: Bold 38px/82px Roboto;
   height: 60px;
   letter-spacing: -0.95px;
-  color: #23bcba;
+  color: var(--primary-color-2);
   margin-top: 11px;
   margin-bottom: 21px;
 }
 
 .line {
-  border-top: 5px solid #23bcba;
+  border-top: 5px solid var(--primary-color-2);
   width: 116px;
   margin-bottom: 97px;
 }
@@ -261,7 +261,7 @@ span.twitterIcon {
 .openaireIconButton:hover,
 .orcidIconMediumButton:hover,
 .iconmediumButton:hover {
-  //   background-color: #129d993b;
+  //   background-color: var(--primary-color)3b;
   background-color: #ececec;
   border-radius: 60%;
 }
@@ -341,8 +341,7 @@ span.zenodoIcon {
 // }
 
 .laptop-img {
-  //   background: url("../../../../assets/splash/assets/img/laptop.png") no-repeat;
+  background: url("../../../../assets/images/login-bottom-image.png") no-repeat;
-  background: url("../../../../assets/splash/assets/img/1_Main/Png/Who\ \ \ Benefits\ Small.png") no-repeat;
   width: 164px;
   height: 200px;
   position: relative;

dmp-frontend/src/app/ui/contact/contact-content/contact-content.component.scss

@@ -25,12 +25,12 @@ img {
 
 .send-btn {
 	background: #ffffff 0% 0% no-repeat padding-box;
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
 	border-radius: 30px;
 	opacity: 1;
 	min-width: 101px;
 	height: 43px;
-	color: #129d99;
+	color: var(--primary-color);
 	font-weight: 500;
 }
 

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

@@ -20,14 +20,12 @@
 							<div class="row d-flex align-items-center">
 								<div *ngIf="!this.hasDmps()" class="col-auto add-dataset-btn d-flex">
 									<button type="button" class="col-auto align-self-center normal-btn" (click)="openNewDmpDialog()">{{'DASHBOARD.START-YOUR-FIRST-DMP' | translate}}</button>
-									<!-- <img class="col-auto ml-auto laptop-img" src="../../../assets/splash/assets/img/1_Main/Png/Who   Benefits copy.png" width="116" height="139"> -->
-									<!-- <img class="col-auto ml-auto laptop-img"> -->
 								</div>
 								<div *ngIf="this.hasDmps()" class="new-dataset-tour add-dataset-btn col-auto d-flex">
 									<button mat-raised-button type="button" class="col-auto align-self-center yellow-btn" (click)="addNewDataset()">{{'DASHBOARD.ACTIONS.ADD-DATASET-DESCRIPTION' | translate}}</button>
 								</div>
 								<span class="col-auto ml-auto">
-									<img class="laptop-img\6" src="../../../assets/splash/assets/img/1_Main/Png/Who   Benefits copy.png" width="116" height="139">
+									<img class="laptop-img\6" src="../../../assets/images/dashboard-popup.png">
 								</span>
 							</div>
 						</div>
@@ -120,7 +118,7 @@
 									</div>
 									<div class="d-flex">
 										<!-- <button type="button" class="col-auto align-self-center normal-btn" (click)="openNewDmpDialog()">{{'DASHBOARD.START-YOUR-FIRST-DMP' | translate}}</button> -->
-										<img class="col-auto ml-auto laptop-img" src="../../../assets/splash/assets/img/1_Main/Png/Who   Benefits copy.png" width="116" height="139">
+										<img class="col-auto ml-auto laptop-img" src="../../../assets/images/dashboard-popup.png">
 										<!-- <img class="col-auto ml-auto laptop-img"> -->
 									</div>
 								</div>

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

@@ -64,7 +64,7 @@
 	max-width: 256px;
 	height: 40px;
 	cursor: pointer;
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	box-shadow: 0px 3px 6px #1e202029;
 	border-radius: 30px;
 	border: none;
@@ -81,7 +81,7 @@
 	//max-width: 256px;
 	height: 40px;
 	cursor: pointer;
-	background: #f7dd72 0% 0% no-repeat padding-box;
+	background: var(--secondary-color) 0% 0% no-repeat padding-box;
 	border-radius: 30px;
 	opacity: 1;
 	border: none;
@@ -197,7 +197,7 @@ input[type="text"] {
 }
 
 .dmp-label {
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	opacity: 1;
 	min-width: 67px;
@@ -210,7 +210,7 @@ input[type="text"] {
 	//   width: 158px;
 	width: auto;
 	height: 37px;
-	background: #f7dd72 0% 0% no-repeat padding-box;
+	background: var(--secondary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	text-align: left;
 	line-height: 2.8;
@@ -292,7 +292,7 @@ input[type="text"] {
 
 .dataset-card-actions a:hover,
 .dmp-card-actions a:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .dmp-dataset-descriptions-title {
@@ -313,7 +313,7 @@ input[type="text"] {
 }
 
 .show-more:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .btn-load-more {
@@ -354,7 +354,7 @@ input[type="text"] {
 .add-dataset {
 	width: 142px;
 	height: 40px;
-	background: #f7dd72 0% 0% no-repeat padding-box;
+	background: var(--secondary-color) 0% 0% no-repeat padding-box;
 	box-shadow: 0px 3px 6px #1e202029;
 	border-radius: 30px;
 	opacity: 1;
@@ -401,7 +401,7 @@ input[type="text"] {
 
 :host ::ng-deep .mat-tab-group.mat-primary .mat-ink-bar,
 .mat-tab-nav-bar.mat-primary .mat-ink-bar {
-	background: #129d99;
+	background: var(--primary-color);
 	height: 5px;
 }
 
@@ -444,14 +444,6 @@ input[type="text"] {
 	flex-grow: 1;
   } */
 
-// .header-image {
-//   background: url("/assets/images/new-dashboard-bg.png") no-repeat;
-//   background-size: cover;
-//   margin-top: 70px;
-//   min-height: 20em;
-//   position: relative;
-// }
-
 // .header-text-container {
 //   background: rgba(255, 255, 255, 0.7);
 //   position: absolute;

dmp-frontend/src/app/ui/dashboard/dataset-info-counter/dataset-info-counter.component.css

@@ -38,7 +38,7 @@
 }
 
 .about-item .length {
-	color: #00b29f;
+	color: var(--primary-color-3);
 	/* color: #089dbb; */
 }
 

dmp-frontend/src/app/ui/dashboard/drafts/drafts.component.css

@@ -47,7 +47,7 @@ input[type="text"] {
 }
 
 .dmp-label {
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	opacity: 1;
 	min-width: 67px;
@@ -59,7 +59,7 @@ input[type="text"] {
 .dataset-label {
 	width: auto;
 	height: 37px;
-	background: #f7dd72 0% 0% no-repeat padding-box;
+	background: var(--secondary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	text-align: left;
 	line-height: 2.8;
@@ -130,7 +130,7 @@ input[type="text"] {
 
 .dataset-card-actions a:hover,
 .dmp-card-actions a:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .dmp-dataset-descriptions-title {
@@ -151,7 +151,7 @@ input[type="text"] {
 }
 
 .show-more:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .btn-load-more {
@@ -183,7 +183,7 @@ input[type="text"] {
 }
 
 .search-form mat-icon {
-	color: #129d99;
+	color: var(--primary-color);
 }
 
 ::ng-deep .search-form .mat-form-field-wrapper {

dmp-frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.css

@@ -47,7 +47,7 @@ input[type="text"] {
 }
 
 .dmp-label {
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	opacity: 1;
 	min-width: 67px;
@@ -59,7 +59,7 @@ input[type="text"] {
 .dataset-label {
 	width: auto;
 	height: 37px;
-	background: #f7dd72 0% 0% no-repeat padding-box;
+	background: var(--secondary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	text-align: left;
 	line-height: 2.8;
@@ -139,7 +139,7 @@ input[type="text"] {
 
 .dataset-card-actions a:hover,
 .dmp-card-actions a:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .dmp-dataset-descriptions-title {
@@ -160,7 +160,7 @@ input[type="text"] {
 }
 
 .show-more:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .btn-load-more {
@@ -192,7 +192,7 @@ input[type="text"] {
 }
 
 .search-form mat-icon {
-	color: #129d99;
+	color: var(--primary-color);
 }
 
 ::ng-deep .search-form .mat-form-field-wrapper {
@@ -234,9 +234,9 @@ a {
 .is-public {
   padding-left: 5px;
   padding-right: 5px;
-  border: 1px solid #00b29f3b;
+  border: 1px solid var(--primary-color-3)3b;
-  color: #00b29f;
+  color: var(--primary-color-3);
-  background-color: #00b29f0f;
+  background-color: var(--primary-color-3)0f;
   border-radius: 10em;
   text-align: center;
 }

dmp-frontend/src/app/ui/dashboard/recent-edited-dataset-activity/recent-edited-dataset-activity.component.scss

@@ -47,7 +47,7 @@ input[type="text"] {
 }
 
 .dmp-label {
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	opacity: 1;
 	min-width: 67px;
@@ -59,7 +59,7 @@ input[type="text"] {
 .dataset-label {
 	width: auto;
 	height: 37px;
-	background: #f7dd72 0% 0% no-repeat padding-box;
+	background: var(--secondary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	text-align: left;
 	line-height: 2.8;
@@ -141,7 +141,7 @@ input[type="text"] {
 
 .dataset-card-actions a:hover,
 .dmp-card-actions a:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .dmp-dataset-descriptions-title {
@@ -162,7 +162,7 @@ input[type="text"] {
 }
 
 .show-more:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .btn-load-more {
@@ -194,7 +194,7 @@ input[type="text"] {
 }
 
 .search-form mat-icon {
-	color: #129d99;
+	color: var(--primary-color);
 }
 
 ::ng-deep .search-form .mat-form-field-wrapper {

dmp-frontend/src/app/ui/dashboard/recent-edited-dmp-activity/recent-edited-dmp-activity.component.css

@@ -46,7 +46,7 @@ input[type="text"] {
 }
 
 .dmp-label {
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	opacity: 1;
 	min-width: 67px;
@@ -58,7 +58,7 @@ input[type="text"] {
 .dataset-label {
 	width: auto;
 	height: 37px;
-	background: #f7dd72 0% 0% no-repeat padding-box;
+	background: var(--secondary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	text-align: left;
 	line-height: 2.8;
@@ -123,7 +123,7 @@ input[type="text"] {
 }
 
 .dataset-card-actions a:hover, .dmp-card-actions a:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .dmp-dataset-descriptions-title {
@@ -144,7 +144,7 @@ input[type="text"] {
 }
 
 .show-more:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .btn-load-more {
@@ -176,7 +176,7 @@ input[type="text"] {
 }
 
 .search-form mat-icon {
-	color: #129d99;
+	color: var(--primary-color);
 }
 
 ::ng-deep .search-form .mat-form-field-wrapper {
@@ -204,9 +204,9 @@ a {
 .is-public {
   padding-left: 5px;
   padding-right: 5px;
-  border: 1px solid #00b29f3b;
+  border: 1px solid var(--primary-color-3)3b;
-  color: #00b29f;
+  color: var(--primary-color-3);
-  background-color: #00b29f0f;
+  background-color: var(--primary-color-3)0f;
   border-radius: 10em;
   text-align: center;
 }

dmp-frontend/src/app/ui/dashboard/recent-visited-activity/recent-visited-activity.component.css

@@ -5,9 +5,9 @@ th {
 .is-public {
 	padding-left: 5px;
 	padding-right: 5px;
-	border: 1px solid #00b29f3b;
+	border: 1px solid var(--primary-color-3)3b;
-	color: #00b29f;
+	color: var(--primary-color-3);
-	background-color: #00b29f0f;
+	background-color: var(--primary-color-3)0f;
 	border-radius: 10em;
 	text-align: center;
 }

dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-copy-dialogue/dataset-copy-dialogue.component.scss

@@ -22,17 +22,17 @@ min-width: 101px;
 
 .confirm-btn {
 	background: #ffffff 0% 0% no-repeat padding-box;
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
 	border-radius: 30px;
 	opacity: 1;
 min-width: 101px;
 	height: 43px;
-	color: #129d99;
+	color: var(--primary-color);
 	font-weight: 500;
 }
 
 .confirm-btn:hover {
-	background-color: #129d99;
+	background-color: var(--primary-color);
 	color: #ffffff;
 }
 

dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-editor/dataset-editor.component.scss

@@ -53,7 +53,7 @@
   }
 
   .input-btn :hover {
-    color: #00b29f !important;
+    color: var(--primary-color-3) !important;
   }
 
   .dmp-link {

dmp-frontend/src/app/ui/dataset/dataset-wizard/dataset-wizard.component.scss

@@ -104,7 +104,7 @@
   }
 
   .more-icon :hover {
-    color: #00b29f;
+    color: var(--primary-color-3);
   }
 
   .new-dataset {
@@ -120,8 +120,8 @@
 
   .dataset-editor-header {
     height: 113px;
-    background: var(--unnamed-color-129d99) 0% 0% no-repeat padding-box;
+    background: var(--unnamed-color-var(--primary-color)) 0% 0% no-repeat padding-box;
-    background: #f7dd72 0% 0% no-repeat padding-box;
+    background: var(--secondary-color) 0% 0% no-repeat padding-box;
     box-shadow: 0px 3px 6px #00000029;
     padding: 0.6rem;
     margin: 30px 0px 0px 0px;
@@ -192,7 +192,7 @@
     justify-content: center;
     align-items: center;
     font-weight: 700;
-    color: #129d99;
+    color: var(--primary-color);
   }
 
   .dataset-discard-btn {
@@ -227,7 +227,7 @@
     text-align: left;
     font-size: 1rem;
     font-weight: 700;
-    color: #129d99;
+    color: var(--primary-color);
     line-height: 25px;
   }
 
@@ -238,7 +238,7 @@
   .dmp-label {
     min-width: 67px;
     height: 37px;
-    background: #129d99 0% 0% no-repeat padding-box;
+    background: var(--primary-color) 0% 0% no-repeat padding-box;
     color: white;
     border-radius: 4px;
     opacity: 1;
@@ -264,7 +264,7 @@
     opacity: 0.75;
   }
   .open-in-new-icon:hover {
-    color: #129d99;
+    color: var(--primary-color);
   }
 
   .dataset-stepper {
@@ -347,7 +347,7 @@
       width: 100%;
       height: 27px;
       line-height: 27px;
-      background-color: #f7dd72;
+      background-color: var(--secondary-color);
       color: #5d5d5d;
       border-radius: 4px;
       font-weight: 400;
@@ -423,7 +423,7 @@
   }
 
   .add-dataset-btn {
-	background: #f7dd72 0% 0% no-repeat padding-box;
+	background: var(--secondary-color) 0% 0% no-repeat padding-box;
 	box-shadow: 0px 3px 6px #1e202029;
 	font-weight: 500;
 	word-wrap: break-word;
@@ -432,7 +432,7 @@
   }
 
   .next {
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	color: white;
 	box-shadow: 0px 3px 6px #1e202029;
 	font-weight: 400;
@@ -440,7 +440,7 @@
   }
 
   .dataset-next {
-	background: #f7dd72 0% 0% no-repeat padding-box;
+	background: var(--secondary-color) 0% 0% no-repeat padding-box;
 	color: #212121;
 	box-shadow: 0px 3px 6px #1e202029;
 	font-weight: 700;
@@ -500,7 +500,7 @@ mat-icon.size-18 {
 // }
 
 // ::ng-deep .mat-ink-bar {
-//   background-color: #00b29f !important;
+//   background-color: var(--primary-color-3) !important;
 //   //   background-color: #0070c0 !important;
 // }
 

dmp-frontend/src/app/ui/dataset/dataset-wizard/prefill-dataset/prefill-dataset.component.scss

@@ -3,7 +3,7 @@
 		display: flex;
 		width: 100%;
 		height: 60px;
-		background-color: #f7dd72;
+		background-color: var(--secondary-color);
 		color: #212121;
 		font-size: 1.25rem;
 	}
@@ -33,8 +33,8 @@
 	}
 
 	.empty-btn, .prefill-btn {
-		background: #f7dd72 0 0 no-repeat padding-box;
+		background: var(--secondary-color) 0 0 no-repeat padding-box;
-		border: 1px solid #f7dd72;
+		border: 1px solid var(--secondary-color);
 		border-radius: 30px;
 		opacity: 1;
 	min-width: 101px;

dmp-frontend/src/app/ui/dataset/listing/criteria/dataset-criteria.component.scss

@@ -34,7 +34,7 @@
 .filters-title {
 	width: 93px;
 	//   color: #089dbb;
-	color: #23bcba;
+	color: var(--primary-color-2);
 	background-color: white;
 	padding: 0px 20px;
 	margin-top: -10px;

dmp-frontend/src/app/ui/dataset/listing/dataset-listing.component.html

@@ -11,7 +11,7 @@
 						<button mat-raised-button class="add-dataset align-self-center yellow-btn" (click)="addNewDataset()">
 							{{'DASHBOARD.ACTIONS.ADD-DATASET' | translate}}
 						</button>
-						<img class="col-auto ml-auto laptop-img" src="../../../assets/splash/assets/img/1_Main/Png/Who   Benefits copy.png" width="116" height="139">
+						<img class="col-auto ml-auto laptop-img" src="../../../assets/images/dashboard-popup.png">
 					</div>
 				</div>
 			</div>

dmp-frontend/src/app/ui/dataset/listing/dataset-listing.component.scss

@@ -102,7 +102,7 @@
   max-width: 256px;
   height: 40px;
   cursor: pointer;
-  background: #129d99 0% 0% no-repeat padding-box;
+  background: var(--primary-color) 0% 0% no-repeat padding-box;
   box-shadow: 0px 3px 6px #1e202029;
   border-radius: 30px;
   border: none;
@@ -119,7 +119,7 @@
   max-width: 256px;
   height: 40px;
   cursor: pointer;
-  background: #f7dd72 0% 0% no-repeat padding-box;
+  background: var(--secondary-color) 0% 0% no-repeat padding-box;
   border-radius: 30px;
   opacity: 1;
   border: none;
@@ -148,7 +148,7 @@
 
 .filter-btn button {
   color: white;
-  background-color: #23bcba;
+  background-color: var(--primary-color-2);
   width: 37px;
   height: 45px;
 }
@@ -173,7 +173,7 @@
 }
 
 .search-form mat-icon {
-  color: #129d99;
+  color: var(--primary-color);
 }
 
 .empty-list {
@@ -186,7 +186,7 @@
 }
 
 .pointer:hover {
-  color: #00b29f;
+  color: var(--primary-color-3);
 }
 
 ::ng-deep .search-form .mat-form-field-wrapper {
@@ -250,12 +250,12 @@
 
 ::ng-deep .mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle {
   border-color: #777777;
-  // border-color: #00b29f;
+  // border-color: var(--primary-color-3);
 }
 
 ::ng-deep .mat-radio-button.mat-accent .mat-radio-inner-circle {
-  //   color: #00b29f;
+  //   color: var(--primary-color-3);
-  //   background-color: #00b29f;
+  //   background-color: var(--primary-color-3);
   color: #777777;
   background-color: #777777;
 }

dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.scss

@@ -18,7 +18,7 @@
 }
 
 .container-header :hover {
-  color: #00b29f;
+  color: var(--primary-color-3);
 }
 
 h4 {
@@ -42,11 +42,11 @@ h4 > span {
 }
 
 .links :hover {
-  color: #00b29f;
+  color: var(--primary-color-3);
 }
 
 .about-item .length {
-  color: #00b29f;
+  color: var(--primary-color-3);
 }
 
 .about-item .title {
@@ -66,7 +66,7 @@ p {
 }
 
 .storage :hover {
-  color: #00b29f;
+  color: var(--primary-color-3);
 }
 
 .draft-bookmark {
@@ -115,7 +115,7 @@ input[type="text"] {
 }
 
 .dmp-label {
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	opacity: 1;
 	min-width: 67px;
@@ -127,7 +127,7 @@ input[type="text"] {
 .dataset-label {
 	width: auto;
 	height: 37px;
-	background: #f7dd72 0% 0% no-repeat padding-box;
+	background: var(--secondary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	text-align: left;
 	line-height: 2.8;
@@ -209,7 +209,7 @@ input[type="text"] {
 
 .dataset-card-actions a:hover,
 .dmp-card-actions a:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .dmp-dataset-descriptions-title {
@@ -230,7 +230,7 @@ input[type="text"] {
 }
 
 .show-more:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .btn-load-more {

dmp-frontend/src/app/ui/dataset/overview/dataset-overview.component.scss

@@ -17,7 +17,7 @@
   width: 2.5em;
   height: 2.5em;
   color: #212121;
-  background-color: #f7dd72;
+  background-color: var(--secondary-color);
 }
 
 .mat-mini-fab-icon,
@@ -27,7 +27,7 @@
 
 .actions-btn:hover,
 .finalize-btn:hover {
-  background-color: #129d99;
+  background-color: var(--primary-color);
   color: #ffffff;
 }
 
@@ -63,7 +63,7 @@
 .dmp-btn {
   width: 35em;
   min-height: 2.3em;
-  background-color: #129d99;
+  background-color: var(--primary-color);
   border-radius: 4px;
   flex-direction: row;
   justify-content: space-between;
@@ -80,7 +80,7 @@
   width: 31.6em;
   padding: 0 1em;
   background-color: #ffffff00;
-  color: #129d99;
+  color: var(--primary-color);
   font-weight: 700;
 }
 
@@ -91,7 +91,7 @@
 }
 
 .finalize-btn {
-  //   border: 1px solid #F7DD72;
+  //   border: 1px solid var(--secondary-color);
   background: #f5db71;
 }
 
@@ -129,7 +129,7 @@
 .dataset-logo {
   width: 6em;
   height: 2.6em;
-  background: #f7dd72;
+  background: var(--secondary-color);
   border-radius: 4px;
   font-size: 0.875em;
   // color: #212121;

dmp-frontend/src/app/ui/dmp/clone/clone-dialog/clone-dialog.component.scss

@@ -45,14 +45,14 @@
 		min-width: 84px;
 		height: 43px;
 		background: #ffffff;
-		color: #129d99;
+		color: var(--primary-color);
-		border: 1px solid #129d99;
+		border: 1px solid var(--primary-color);
 		border-radius: 30px;
 		opacity: 1;
 	}
 
 	.confirm-btn:hover {
-		background-color: #129d99;
+		background-color: var(--primary-color);
 		color: #ffffff;
 	}
 }

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

@@ -7,7 +7,7 @@ a {
 }
 
 a:hover {
-  color: #00b29f;
+  color: var(--primary-color-3);
 }
 
 .main-content {
@@ -23,8 +23,8 @@ a:hover {
 
 .editor-header {
   height: 64px;
-  background: var(--unnamed-color-129d99) 0% 0% no-repeat padding-box;
+  background: var(--unnamed-color-var(--primary-color)) 0% 0% no-repeat padding-box;
-  background: #129d99 0% 0% no-repeat padding-box;
+  background: var(--primary-color) 0% 0% no-repeat padding-box;
   box-shadow: 0px 3px 6px #00000029;
   padding: 0.6rem;
   margin: 30px 0px 0px 0px;
@@ -41,8 +41,8 @@ a:hover {
 
 .dataset-editor-header {
   height: 113px;
-  background: var(--unnamed-color-129d99) 0% 0% no-repeat padding-box;
+  background: var(--unnamed-color-var(--primary-color)) 0% 0% no-repeat padding-box;
-  background: #f7dd72 0% 0% no-repeat padding-box;
+  background: var(--secondary-color) 0% 0% no-repeat padding-box;
   box-shadow: 0px 3px 6px #00000029;
   padding: 0.6rem;
   margin: 30px 0px 0px 0px;
@@ -135,7 +135,7 @@ a:hover {
   justify-content: center;
   align-items: center;
   font-weight: 700;
-  color: #129d99;
+  color: var(--primary-color);
   cursor: pointer;
 }
 
@@ -241,7 +241,7 @@ a:hover {
   .dataset-tag {
     width: 73px;
     height: 27px;
-    background-color: #f7dd72;
+    background-color: var(--secondary-color);
     color: #5d5d5d;
     border-radius: 4px;
     font-weight: 400;
@@ -286,7 +286,7 @@ a:hover {
 }
 
 .next {
-  background: #129d99 0% 0% no-repeat padding-box;
+  background: var(--primary-color) 0% 0% no-repeat padding-box;
   color: white;
   box-shadow: 0px 3px 6px #1e202029;
   font-weight: 400;
@@ -294,7 +294,7 @@ a:hover {
 }
 
 .dataset-next {
-  background: #f7dd72 0% 0% no-repeat padding-box;
+  background: var(--secondary-color) 0% 0% no-repeat padding-box;
   color: #212121;
   box-shadow: 0px 3px 6px #1e202029;
   font-weight: 700;
@@ -322,7 +322,7 @@ a:hover {
 .dmp-label {
   min-width: 67px;
   height: 37px;
-  background: #129d99 0% 0% no-repeat padding-box;
+  background: var(--primary-color) 0% 0% no-repeat padding-box;
   color: white;
   border-radius: 4px;
   opacity: 1;
@@ -372,7 +372,7 @@ a:hover {
 // }
 
 ::ng-deep .mat-ink-bar {
-  background-color: #00b29f !important;
+  background-color: var(--primary-color-3) !important;
   //   background-color: #0070c0 !important;
 }
 
@@ -405,7 +405,7 @@ a:hover {
 // }
 
 // .more-icon :hover {
-//   color: #00b29f;
+//   color: var(--primary-color-3);
 // }
 
 // ::ng-deep .mat-tab-labels {
@@ -417,5 +417,5 @@ a:hover {
 // }
 
 // ::ng-deep .mat-ink-bar {
-//   background-color: #00b29f !important;
+//   background-color: var(--primary-color-3) !important;
 // }

dmp-frontend/src/app/ui/dmp/dataset-preview/dataset-preview-dialog.component.scss

@@ -3,7 +3,7 @@
 		display: flex;
 		width: 100%;
 		height: 89px;
-		background-color: #129D99;
+		background-color: var(--primary-color);
 		color: #FFFFFF;
 		font-size: 1.25rem;
 	}
@@ -33,8 +33,8 @@
 	}
 
 	.start-btn {
-		background: #129d99 0% 0% no-repeat padding-box;
+		background: var(--primary-color) 0% 0% no-repeat padding-box;
-		border: 1px solid #129d99;
+		border: 1px solid var(--primary-color);
 		border-radius: 30px;
 		opacity: 1;
 	min-width: 101px;

dmp-frontend/src/app/ui/dmp/dmp-to-dataset/dmp-to-dataset-dialog.component.html

@@ -19,6 +19,6 @@
 				</div>
 			</div>
 		</div>
-		<img class="col-auto ml-auto laptop-img" src="../../../assets/splash/assets/img/2_Sign_in/Png/Sign In - Copy.png" width="116" height="139">
+		<img class="col-auto ml-auto laptop-img" src="../../../assets/images/guided-tour-side.png" width="116" height="139">
 	</div>
 </div>

dmp-frontend/src/app/ui/dmp/dmp-to-dataset/dmp-to-dataset-dialog.component.scss

@@ -38,8 +38,8 @@
 }
 
 .start-btn {
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
 	border-radius: 30px;
 	opacity: 1;
 	min-width: 101px;
@@ -49,7 +49,7 @@
 }
 
 .color-green {
-	color: #129d99;
+	color: var(--primary-color);
 	font-weight: 500;
 }
 

dmp-frontend/src/app/ui/dmp/editor/dataset-editor-details/dataset-editor-details.component.scss

@@ -57,7 +57,7 @@
   }
 
   .input-btn :hover {
-    color: #00b29f !important;
+    color: var(--primary-color-3) !important;
   }
 
   .dmp-link {

dmp-frontend/src/app/ui/dmp/editor/dataset-info/dataset-info.component.scss

@@ -56,7 +56,7 @@
   }
 
   .input-btn :hover {
-    color: #00b29f !important;
+    color: var(--primary-color-3) !important;
   }
 
   .not-found {

dmp-frontend/src/app/ui/dmp/editor/datasets-tab/datasets-tab.component.scss

@@ -45,7 +45,7 @@
 
 .show-more {
   background-color: #ffffff00;
-  color: #00b29f;
+  color: var(--primary-color-3);
   font-weight: 700;
   justify-self: center;
 }

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

@@ -18,7 +18,7 @@ a {
 }
 
 a:hover {
-  color: #00b29f;
+  color: var(--primary-color-3);
 }
 
 .main-content {
@@ -40,7 +40,7 @@ a:hover {
 }
 
 .more-icon :hover {
-  color: #00b29f;
+  color: var(--primary-color-3);
 }
 
 .export-btn {
@@ -56,8 +56,8 @@ a:hover {
 
 .editor-header {
   height: 64px;
-  background: var(--unnamed-color-129d99) 0% 0% no-repeat padding-box;
+  background: var(--unnamed-color-var(--primary-color)) 0% 0% no-repeat padding-box;
-  background: #129d99 0% 0% no-repeat padding-box;
+  background: var(--primary-color) 0% 0% no-repeat padding-box;
   box-shadow: 0px 3px 6px #00000029;
   padding: 0.6rem;
   margin: 30px 0px 0px 0px;
@@ -74,8 +74,8 @@ a:hover {
 
 .dataset-editor-header {
   height: 113px;
-  background: var(--unnamed-color-129d99) 0% 0% no-repeat padding-box;
+  background: var(--unnamed-color-var(--primary-color)) 0% 0% no-repeat padding-box;
-  background: #f7dd72 0% 0% no-repeat padding-box;
+  background: var(--secondary-color) 0% 0% no-repeat padding-box;
   box-shadow: 0px 3px 6px #00000029;
   padding: 0.6rem;
   margin: 30px 0px 0px 0px;
@@ -167,7 +167,7 @@ a:hover {
   justify-content: center;
   align-items: center;
   font-weight: 700;
-  color: #129d99;
+  color: var(--primary-color);
 }
 
 .dataset-discard-btn {
@@ -278,7 +278,7 @@ a:hover {
     width: 100%;
     height: 27px;
     line-height: 27px;
-    background-color: #f7dd72;
+    background-color: var(--secondary-color);
     color: #5d5d5d;
     border-radius: 4px;
     font-weight: 400;
@@ -344,7 +344,7 @@ mat-icon.size-16 {
 }
 
 .add-dataset-btn {
-  background: #f7dd72 0% 0% no-repeat padding-box;
+  background: var(--secondary-color) 0% 0% no-repeat padding-box;
   box-shadow: 0px 3px 6px #1e202029;
   font-weight: 500;
   white-space: normal;
@@ -361,7 +361,7 @@ mat-icon.size-16 {
 }
 
 .next {
-  background: #129d99 0% 0% no-repeat padding-box;
+  background: var(--primary-color) 0% 0% no-repeat padding-box;
   color: white;
   box-shadow: 0px 3px 6px #1e202029;
   font-weight: 400;
@@ -369,7 +369,7 @@ mat-icon.size-16 {
 }
 
 .dataset-next {
-  background: #f7dd72 0% 0% no-repeat padding-box;
+  background: var(--secondary-color) 0% 0% no-repeat padding-box;
   color: #212121;
   box-shadow: 0px 3px 6px #1e202029;
   font-weight: 700;
@@ -391,8 +391,8 @@ mat-icon.size-16 {
 }
 
 // .add-dataset-btn:hover {
-//   color: #129d99 !important;
+//   color: var(--primary-color) !important;
-//   border: 1px solid #129d99;
+//   border: 1px solid var(--primary-color);
 // }
 
 .dataset-list {
@@ -403,7 +403,7 @@ mat-icon.size-16 {
 .dmp-label {
   min-width: 67px;
   height: 37px;
-  background: #129d99 0% 0% no-repeat padding-box;
+  background: var(--primary-color) 0% 0% no-repeat padding-box;
   color: white;
   border-radius: 4px;
   opacity: 1;
@@ -462,6 +462,6 @@ mat-icon.size-16 {
 // }
 
 ::ng-deep .mat-ink-bar {
-  background-color: #00b29f !important;
+  background-color: var(--primary-color-3) !important;
   //   background-color: #0070c0 !important;
 }

dmp-frontend/src/app/ui/dmp/editor/dmp-finalize-dialog/dmp-finalize-dialog.component.scss

@@ -66,7 +66,7 @@
 }
 
 .datasets span {
-	color: #00b29f;
+	color: var(--primary-color-3);
 }
 
 .emptyList {
@@ -75,7 +75,7 @@
 }
 
 .save-btn {
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	border-radius: 30px;
 	opacity: 1;
 	width: auto;
@@ -92,8 +92,8 @@
 	min-width: 84px;
 	height: 43px;
 	background: #ffffff;
-	color: #129d99;
+	color: var(--primary-color);
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
 	border-radius: 30px;
 	opacity: 1;
 }
@@ -103,7 +103,7 @@
 }
 
 .submit-btn:not([disabled]):hover {
-	background-color: #129d99;
+	background-color: var(--primary-color);
     color: #ffffff;
 }
 

dmp-frontend/src/app/ui/dmp/editor/funding-info/funding-info.component.scss

@@ -56,12 +56,12 @@
   }
 
   .input-btn :hover {
-    color: #00b29f !important;
+    color: var(--primary-color-3) !important;
   }
 
   .insert {
 	text-decoration: underline;
-	color: #00b29f;
+	color: var(--primary-color-3);
 	cursor: pointer;
 	font-size: 1rem;
 	font-weight: 400;

dmp-frontend/src/app/ui/dmp/editor/general-tab/general-tab.component.scss

@@ -6,7 +6,7 @@
 }
 
 .input-btn :hover {
-  color: #00b29f !important;
+  color: var(--primary-color-3) !important;
 }
 
 // .icon-btn {
@@ -31,7 +31,7 @@
 }
 
 .version-menu mat-icon {
-  color: #00b29f;
+  color: var(--primary-color-3);
 }
 
 ::ng-deep .mat-form-field-appearance-legacy .mat-form-field-wrapper {

dmp-frontend/src/app/ui/dmp/editor/grant-tab/grant-tab.component.scss

@@ -5,7 +5,7 @@
   align-self: center;
   padding-bottom: 1em;
   cursor: pointer;
-  color: #00b29f;
+  color: var(--primary-color-3);
 }
 
 .add-entity:after {
@@ -16,7 +16,7 @@
   height: 2px;
   left: 50%;
   position: absolute;
-  background: #00b29f;
+  background: var(--primary-color-3);
   //   background: #0070c0;
   transition: width 0.3s ease 0s, left 0.3s ease 0s;
   width: 0;

dmp-frontend/src/app/ui/dmp/editor/license-info/license-info.component.scss

@@ -56,7 +56,7 @@
   }
 
   .input-btn :hover {
-    color: #00b29f !important;
+    color: var(--primary-color-3) !important;
   }
 }
 

dmp-frontend/src/app/ui/dmp/editor/main-info/main-info.component.scss

@@ -62,12 +62,12 @@
 	}
 
 	.input-btn :hover {
-		color: #00b29f !important;
+		color: var(--primary-color-3) !important;
 	}
 
 	.insert-manually {
 		text-decoration: underline;
-		color: #00b29f;
+		color: var(--primary-color-3);
 		cursor: pointer;
 		font-size: 1rem;
 		font-weight: 400;

dmp-frontend/src/app/ui/dmp/invitation/dmp-invitation-dialog.component.scss

@@ -95,12 +95,12 @@
 
 .invite-btn {
 	background: #ffffff 0% 0% no-repeat padding-box;
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
 	border-radius: 30px;
 	opacity: 1;
 	min-width: 101px;
 	height: 43px;
-	color: #129d99;
+	color: var(--primary-color);
 	font-weight: 500;
 }
 
@@ -118,7 +118,7 @@
 }
 
 .invite-btn:hover {
-	background: #129d99;
+	background: var(--primary-color);
 	color: #ffffff;
 }
 

dmp-frontend/src/app/ui/dmp/listing/criteria/dmp-criteria.component.scss

@@ -48,7 +48,7 @@
 .filters-title {
   width: 93px;
   //   color: #089dbb;
-  color: #23bcba;
+  color: var(--primary-color-2);
   background-color: white;
   padding: 0px 20px;
   margin-top: -10px;
@@ -65,7 +65,7 @@
 // }
 
 // ::ng-deep .mat-focused .mat-form-field-label {
-//   color: #00b29f !important;
+//   color: var(--primary-color-3) !important;
 // }
 
 // ::ng-deep.mat-form-field-underline {
@@ -73,7 +73,7 @@
 // }
 
 // ::ng-deep.mat-form-field-ripple {
-//   background-color: #00b29f !important;
+//   background-color: var(--primary-color-3) !important;
 // }
 
 // ::ng-deep .mat-checkbox {
@@ -90,7 +90,7 @@
 .mat-accent .mat-pseudo-checkbox-indeterminate,
 .mat-pseudo-checkbox-checked,
 .mat-pseudo-checkbox-indeterminate {
-  background-color: #00b29f;
+  background-color: var(--primary-color-3);
 }
 
 ::ng-deep .mat-ripple-element {
@@ -108,14 +108,14 @@
 
 ::ng-deep .mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle {
   border-color: #777777;
-  // border-color: #00b29f;
+  // border-color: var(--primary-color-3);
 }
 
 ::ng-deep .mat-radio-button.mat-accent .mat-radio-inner-circle {
   color: #777777;
   background-color: #777777;
-  // color: #00b29f;
+  // color: var(--primary-color-3);
-  // background-color: #00b29f;
+  // background-color: var(--primary-color-3);
 }
 
 .mat-radio-button.mat-accent .mat-radio-ripple .mat-ripple-element {

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

@@ -9,7 +9,7 @@
 					<p class="mt-4 pt-2">{{'DMP-LISTING.TEXT-INFO-QUESTION' | translate}} <a class="zenodo-link" href="https://zenodo.org/communities/liber-dmp-cat/?page=1&size=20" target="_blank">{{'DMP-LISTING.LINK-ZENODO' | translate}}</a> {{'DMP-LISTING.GET-IDEA' | translate}}</p>
 					<div class="d-flex">
 						<div *ngIf="!isPublic" class="col left-content" (click)="restartTour()">{{ 'GENERAL.ACTIONS.TAKE-A-TOUR'| translate }}</div>
-						<img class="col-auto ml-auto laptop-img" src="../../../assets/splash/assets/img/1_Main/Png/Who   Benefits copy.png" width="116" height="139">
+						<img class="col-auto ml-auto laptop-img" src="../../../assets/images/dashboard-popup.png">
 					</div>
 				</div>
 			</div>

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

@@ -69,7 +69,7 @@
 }
 
 .more-icon :hover {
-  color: #00b29f;
+  color: var(--primary-color-3);
 }
 
 .header-image {
@@ -163,7 +163,7 @@
   max-width: 256px;
   height: 40px;
   cursor: pointer;
-  background: #129d99 0% 0% no-repeat padding-box;
+  background: var(--primary-color) 0% 0% no-repeat padding-box;
   box-shadow: 0px 3px 6px #1e202029;
   border-radius: 30px;
   border: none;
@@ -180,7 +180,7 @@
   max-width: 256px;
   height: 40px;
   cursor: pointer;
-  background: #f7dd72 0% 0% no-repeat padding-box;
+  background: var(--secondary-color) 0% 0% no-repeat padding-box;
   border-radius: 30px;
   opacity: 1;
   border: none;
@@ -211,7 +211,7 @@
 
 .filter-btn button {
   color: white;
-  background-color: #23bcba;
+  background-color: var(--primary-color-2);
   width: 37px;
   height: 45px;
 }
@@ -223,7 +223,7 @@
 }
 
 .search-form mat-icon {
-  color: #129d99;
+  color: var(--primary-color);
 }
 
 .empty-list {
@@ -242,7 +242,7 @@
 
 .pointer:hover,
 .zenodo-link:hover {
-  color: #00b29f;
+  color: var(--primary-color-3);
 }
 
 ::ng-deep .search-form .mat-form-field-wrapper {

dmp-frontend/src/app/ui/dmp/listing/listing-item/dmp-listing-item.component.scss

@@ -17,7 +17,7 @@
 }
 
 .container-header :hover {
-  color: #00b29f;
+  color: var(--primary-color-3);
 }
 
 h4 {
@@ -45,7 +45,7 @@ h4 > span {
 }
 
 .datasets-counter :hover {
-  color: #00b29f !important;
+  color: var(--primary-color-3) !important;
 }
 
 .about-item .title {
@@ -149,7 +149,7 @@ input[type="text"] {
 }
 
 .dmp-label {
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	opacity: 1;
 	min-width: 67px;
@@ -161,7 +161,7 @@ input[type="text"] {
 .dataset-label {
 	width: auto;
 	height: 37px;
-	background: #f7dd72 0% 0% no-repeat padding-box;
+	background: var(--secondary-color) 0% 0% no-repeat padding-box;
 	border-radius: 4px 0px;
 	text-align: left;
 	line-height: 2.8;
@@ -240,7 +240,7 @@ input[type="text"] {
 
 .dataset-card-actions a:hover,
 .dmp-card-actions a:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .dmp-dataset-descriptions-title {
@@ -261,7 +261,7 @@ input[type="text"] {
 }
 
 .show-more:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .btn-load-more {

dmp-frontend/src/app/ui/dmp/listing/upload-dialogue/dmp-upload-dialogue.component.scss

@@ -37,12 +37,12 @@ min-width: 101px;
 
 .next-btn {
 	background: #ffffff 0% 0% no-repeat padding-box;
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
 	border-radius: 30px;
 	opacity: 1;
 min-width: 101px;
 	height: 43px;
-	color: #129d99;
+	color: var(--primary-color);
 	font-weight: 500;
 }
 
@@ -56,7 +56,7 @@ min-width: 101px;
 }
 
 .next-btn:not([disabled]):hover {
-	background-color: #129d99;
+	background-color: var(--primary-color);
 	color: #ffffff;
 }
 
@@ -70,7 +70,7 @@ min-width: 101px;
 // }
 
 // .next-btn:hover {
-// 	background: #129d99;
+// 	background: var(--primary-color);
 // 	color: #ffffff;
 // }
 
@@ -82,15 +82,15 @@ min-width: 101px;
 	min-width: 156px;
 	height: 44px;
 	color: #ffffff;
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	box-shadow: 0px 3px 6px #1e202029;
 	border-radius: 30px;
 }
 
 .attach-file:hover {
 	background-color: #ffffff;
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
-	color: #129d99;
+	color: var(--primary-color);
 }
 
 .drop-file {

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

@@ -16,7 +16,7 @@
 .mat-mini-fab {
 	width: 2.5em;
 	height: 2.5em;
-	background-color: #129d99;
+	background-color: var(--primary-color);
 	color: white;
 }
 
@@ -45,7 +45,7 @@
 .dataset-btn {
 	width: 36.1em;
 	padding: 0 1.1em;
-	background-color: #f7dd72;
+	background-color: var(--secondary-color);
 	border-radius: 4px;
 	justify-content: space-between;
 	color: #212121;
@@ -65,7 +65,7 @@
 	width: 31.6em;
 	padding: 0 1em;
 	background-color: #ffffff00;
-	color: #129d99;
+	color: var(--primary-color);
 	font-weight: 700;
 }
 
@@ -75,8 +75,8 @@
 }
 
 .finalize-btn {
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
-	color: #129d99;
+	color: var(--primary-color);
 }
 
 .grant-title {
@@ -125,7 +125,7 @@
 	padding: 10px;
 	min-width: 4.8em;
 	height: 2.6em;
-	background: #129d99;
+	background: var(--primary-color);
 	border-radius: 4px;
 	font-size: 0.875em;
 	color: #ffffff;
@@ -237,7 +237,7 @@
 }
 
 .finalize-txt {
-	color: #129d99;
+	color: var(--primary-color);
 }
 
 .frame-txt,
@@ -305,7 +305,7 @@
 }
 
 .add-dataset-btn:hover {
-	color: #129d99 !important;
+	color: var(--primary-color) !important;
 }
 
 .show-more-btn {
@@ -356,7 +356,7 @@
 // }
 
 // .more-icon :hover {
-//   color: #00b29f;
+//   color: var(--primary-color-3);
 // }
 
 // .export-btn {
@@ -453,7 +453,7 @@
 // }
 
 // .container-header :hover {
-//   color: #00b29f;
+//   color: var(--primary-color-3);
 // }
 
 // .dataset-card {
@@ -480,13 +480,13 @@
 
 // .show-more {
 //   background-color: #ffffff00;
-//   color: #00b29f;
+//   color: var(--primary-color-3);
 //   font-weight: 700;
 //   justify-self: center;
 // }
 
 // .visit-website {
-//   background-color: #00b29f;
+//   background-color: var(--primary-color-3);
 //   color: #ffffff;
 // }
 
@@ -550,7 +550,7 @@
 // }
 
 // .datasets-counter :hover {
-//   color: #00b29f !important;
+//   color: var(--primary-color-3) !important;
 // }
 
 // .total-info {
@@ -594,5 +594,5 @@
 // }
 
 // .interact-icon :hover {
-// 	color: #00b29f !important;
+// 	color: var(--primary-color-3) !important;
 // }

dmp-frontend/src/app/ui/dmp/start-new-dataset-dialogue/start-new-dataset-dialog.component.scss

@@ -63,17 +63,17 @@ min-width: 101px;
 
 .next-btn {
 	background: #ffffff 0% 0% no-repeat padding-box;
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
 	border-radius: 30px;
 	opacity: 1;
 min-width: 101px;
 	height: 43px;
-	color: #129d99;
+	color: var(--primary-color);
 	font-weight: 500;
 }
 
 .next-btn:hover {
-	background-color: #129d99;
+	background-color: var(--primary-color);
 	color: white;
 }
 

dmp-frontend/src/app/ui/dmp/wizard/editor/dmp-wizard-editor.component.scss

@@ -14,7 +14,7 @@
 }
 
 .input-btn :hover {
-  color: #00b29f !important;
+  color: var(--primary-color-3) !important;
 }
 
 .table-card .mat-grid-tile {

dmp-frontend/src/app/ui/explore-dataset/filters/explore-dataset-filters.component.scss

@@ -32,7 +32,7 @@
 .filters-title {
   width: 90px;
   //   color: #089dbb;
-  color: #23bcba;
+  color: var(--primary-color-2);
   background-color: white;
   padding: 0px 20px;
   margin-top: -10px;
@@ -49,7 +49,7 @@
 // }
 
 // ::ng-deep .mat-focused .mat-form-field-label {
-//   color: #00b29f !important;
+//   color: var(--primary-color-3) !important;
 // }
 
 // ::ng-deep.mat-form-field-underline {
@@ -57,7 +57,7 @@
 // }
 
 // ::ng-deep.mat-form-field-ripple {
-//   background-color: #00b29f !important;
+//   background-color: var(--primary-color-3) !important;
 // }
 
 // ::ng-deep .mat-checkbox {
@@ -74,7 +74,7 @@
 .mat-accent .mat-pseudo-checkbox-indeterminate,
 .mat-pseudo-checkbox-checked,
 .mat-pseudo-checkbox-indeterminate {
-  background-color: #00b29f;
+  background-color: var(--primary-color-3);
 }
 
 ::ng-deep .mat-ripple-element {
@@ -92,14 +92,14 @@
 
 ::ng-deep .mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle {
   border-color: #777777;
-  //   border-color: #00b29f;
+  //   border-color: var(--primary-color-3);
 }
 
 ::ng-deep .mat-radio-button.mat-accent .mat-radio-inner-circle {
   color: #777777;
   background-color: #777777;
-  //   color: #00b29f;
+  //   color: var(--primary-color-3);
-  //   background-color: #00b29f;
+  //   background-color: var(--primary-color-3);
 }
 
 .mat-radio-button.mat-accent .mat-radio-ripple .mat-ripple-element {

dmp-frontend/src/app/ui/explore-dataset/listing-item/explore-dataset-listing-item.component.scss

@@ -34,7 +34,7 @@ h4 {
 }
 
 .about-item .length {
-  color: #00b29f;
+  color: var(--primary-color-3);
   //   color: #089dbb;
 }
 

dmp-frontend/src/app/ui/explore-dmp/dmp-explore-filters/explore-dmp-filters.component.scss

@@ -32,7 +32,7 @@
 .filters-title {
   width: 93px;
   //   color: #089dbb;
-  color: #23bcba;
+  color: var(--primary-color-2);
   background-color: white;
   padding: 0px 20px;
   margin-top: -10px;
@@ -49,7 +49,7 @@
 // }
 
 // ::ng-deep .mat-focused .mat-form-field-label {
-//   color: #00b29f !important;
+//   color: var(--primary-color-3) !important;
 // }
 
 // ::ng-deep.mat-form-field-underline {
@@ -57,7 +57,7 @@
 // }
 
 // ::ng-deep.mat-form-field-ripple {
-//   background-color: #00b29f !important;
+//   background-color: var(--primary-color-3) !important;
 // }
 
 // ::ng-deep .mat-checkbox {
@@ -74,7 +74,7 @@
 .mat-accent .mat-pseudo-checkbox-indeterminate,
 .mat-pseudo-checkbox-checked,
 .mat-pseudo-checkbox-indeterminate {
-  background-color: #00b29f;
+  background-color: var(--primary-color-3);
 }
 
 ::ng-deep .mat-ripple-element {
@@ -92,14 +92,14 @@
 
 ::ng-deep .mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle {
   border-color: #777777;
-  //   border-color: #00b29f;
+  //   border-color: var(--primary-color-3);
 }
 
 ::ng-deep .mat-radio-button.mat-accent .mat-radio-inner-circle {
   color: #777777;
   background-color: #777777;
-  //   color: #00b29f;
+  //   color: var(--primary-color-3);
-  //   background-color: #00b29f;
+  //   background-color: var(--primary-color-3);
 }
 
 .mat-radio-button.mat-accent .mat-radio-ripple .mat-ripple-element {

dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.scss

@@ -22,7 +22,7 @@
 }
 
 .about-item .length {
-  color: #00b29f;
+  color: var(--primary-color-3);
   // color: #089dbb;
 }
 

dmp-frontend/src/app/ui/grant/listing/criteria/grant-criteria.component.scss

@@ -46,7 +46,7 @@
 .filters-title {
   width: 90px;
   //   color: #089dbb;
-  color: #23bcba;
+  color: var(--primary-color-2);
   background-color: white;
   padding: 0px 20px;
   margin-top: -10px;
@@ -63,7 +63,7 @@
 //   }
 
 //   ::ng-deep .mat-focused .mat-form-field-label {
-// 	color: #00b29f !important;
+// 	color: var(--primary-color-3) !important;
 //   }
 
 //   ::ng-deep.mat-form-field-underline {
@@ -71,7 +71,7 @@
 //   }
 
 //   ::ng-deep.mat-form-field-ripple {
-// 	background-color: #00b29f !important;
+// 	background-color: var(--primary-color-3) !important;
 //   }
 
 ::ng-deep .mat-checkbox {
@@ -88,7 +88,7 @@
 .mat-accent .mat-pseudo-checkbox-indeterminate,
 .mat-pseudo-checkbox-checked,
 .mat-pseudo-checkbox-indeterminate {
-  background-color: #00b29f;
+  background-color: var(--primary-color-3);
 }
 
 ::ng-deep .mat-ripple-element {
@@ -106,14 +106,14 @@
 
 ::ng-deep .mat-radio-button.mat-accent.mat-radio-checked .mat-radio-outer-circle {
   border-color: #777777;
-  // border-color: #00b29f;
+  // border-color: var(--primary-color-3);
 }
 
 ::ng-deep .mat-radio-button.mat-accent .mat-radio-inner-circle {
   color: #777777;
   background-color: #777777;
-  // color: #00b29f;
+  // color: var(--primary-color-3);
-  // background-color: #00b29f;
+  // background-color: var(--primary-color-3);
 }
 
 .mat-radio-button.mat-accent .mat-radio-ripple .mat-ripple-element {

dmp-frontend/src/app/ui/language/language-content/language.component.ts

@@ -5,8 +5,7 @@ import { LanguageService } from '@app/core/services/language/language.service';
 import { UserService } from '@app/core/services/user/user.service';
 import { takeUntil } from 'rxjs/operators';
 import { BaseComponent } from '@common/base/base.component';
-
+import { ConfigurationService } from '@app/core/services/configuration/configuration.service';
-const availableLanguages: any[] = require('../../../../assets/resources/language.json');
 
 @Component({
 	selector: 'app-language',
@@ -16,14 +15,18 @@ const availableLanguages: any[] = require('../../../../assets/resources/language
 export class LanguageComponent extends BaseComponent implements OnInit {
 
 	@Output() languageChange: EventEmitter<any> = new EventEmitter();
-	languages = availableLanguages;
+	languages = [];
 
 	constructor(
 		private router: Router,
 		private authentication: AuthService,
 		private languageService: LanguageService,
-		private userService: UserService
+		private userService: UserService,
-	) { super(); }
+		private configurationService:ConfigurationService
+	) {
+		super();
+		this.languages = this.configurationService.availableLanguages;
+	}
 
 	ngOnInit() {
 		this.languageChange.emit(this.getCurrentLanguage().value)

dmp-frontend/src/app/ui/misc/breadcrumb/breadcrumb.component.scss

@@ -44,7 +44,7 @@
   }
 
   .active {
-    color: #00b29f;
+    color: var(--primary-color-3);
   }
 
   .icon {

dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-composite-title/form-composite-title.component.scss

@@ -24,7 +24,7 @@ h6 {
 
 .more {
 	text-decoration: underline;
-	color: #F7DD72;
+	color: var(--secondary-color);
 	cursor: pointer;
 	font-size: 1rem;
 	font-weight: 400;

dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-field/form-field.component.scss

@@ -38,15 +38,15 @@
 	min-width: 156px;
 	height: 44px;
 	color: #ffffff;
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	box-shadow: 0px 3px 6px #1e202029;
 	border-radius: 30px;
 }
 
 .attach-file-btn:hover {
 	background-color: #ffffff;
-	border: 1px solid #129d99;
+	border: 1px solid var(--primary-color);
-	color: #129d99;
+	color: var(--primary-color);
 }
 
 .attach-file-btn.mat-button-disabled, .attach-file-btn.mat-button-disabled:hover {

dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section-inner/form-section-inner.component.scss

@@ -9,7 +9,7 @@
 	.addOneFieldButton {
 		margin-top: -15px;
 		margin-left: -11px;
-		color: #129d99;
+		color: var(--primary-color);
 	}
 	.panel-title,
 	.panel-desc {

dmp-frontend/src/app/ui/misc/dataset-description-form/components/form-section/form-section.component.scss

@@ -9,7 +9,7 @@
 	.addOneFieldButton {
 		margin-top: -15px;
 		margin-left: -11px;
-		color: #129d99;
+		color: var(--primary-color);
 	}
 	.panel-title,
 	.panel-desc {

dmp-frontend/src/app/ui/misc/dataset-description-form/dataset-description-form.component.scss

@@ -27,5 +27,5 @@
 .mat-step-header .mat-step-icon-selected,
 .mat-step-header .mat-step-icon-state-done,
 .mat-step-header .mat-step-icon-state-edit {
-  background-color: #129d99 !important;
+  background-color: var(--primary-color) !important;
 }

dmp-frontend/src/app/ui/misc/dataset-description-form/dataset-description.component.scss

@@ -43,5 +43,5 @@
 // ::ng-deep .mat-step-header .mat-step-icon-selected,
 // .mat-step-header .mat-step-icon-state-done,
 // .mat-step-header .mat-step-icon-state-edit {
-// 	background-color: #129d99 !important;
+// 	background-color: var(--primary-color) !important;
 // }

dmp-frontend/src/app/ui/misc/navigation/user-dialog/user-dialog.component.scss

@@ -50,7 +50,7 @@ $mat-card-header-size: 40px !default;
 }
 
 .check-icon {
-  color: #129D99;
+  color: var(--primary-color);
   transform: scale(0.7);
 }
 

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

@@ -1,13 +1,13 @@
 <ng-container>
 	<nav class="navbar navbar-expand-lg fixed-navbar">
-		<div class="container-fluid">
+		<div class="container-fluid h-100">
 
 			<div class="hamburger change" id="hamburger" (click)="toggleMyNav($event)">
 				<div class="icon-bar1"></div>
 				<div class="icon-bar2"></div>
 				<div class="icon-bar3"></div>
 			</div>
-			<a class="logo" [routerLink]="['home']"><img src="../../../assets/splash/assets/img/argos-logo-2.svg"></a>
+			<a class="logo" [routerLink]="['home']"><img class="logo-image" src="../../../assets/images/nav-logo.png"></a>
 
 			<button class="navbar-toggler ml-auto" type="button" [matMenuTriggerFor]="toggleMenu">
 				<img *ngIf="this.isAuthenticated();else loginoption" mat-card-avatar class="my-mat-card-avatar" [src]="this.getPrincipalAvatar()" (error)="this.applyFallbackAvatar($event)">

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

@@ -30,10 +30,11 @@ $mat-card-header-size: 40px !default;
 }
 
 .logo {
-  // width: 98px;
-  // height: 37px;
-  margin-top: 15px;
   margin-left: 5px;
+  height: 100%;
+}
+.logo-image {
+	height: 100%;
 }
 
 .faq-title {
@@ -48,7 +49,7 @@ $mat-card-header-size: 40px !default;
 
 .faq-title:hover,
 .lang:hover {
-  color: #23bcba !important;
+  color: var(--primary-color-2) !important;
 }
 
 .lang {

dmp-frontend/src/app/ui/navbar/navbar.component.ts

@@ -1,29 +1,24 @@
 import { Location } from '@angular/common';
+import { HttpClient } from '@angular/common/http';
 import { Component, ElementRef, EventEmitter, OnInit, Output, ViewChild } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
 import { MatMenuTrigger } from '@angular/material/menu';
 import { Router } from '@angular/router';
 import { AppRole } from '@app/core/common/enum/app-role';
+import { UserListingModel } from '@app/core/model/user/user-listing';
 import { AuthService } from '@app/core/services/auth/auth.service';
+import { ConfigurationService } from '@app/core/services/configuration/configuration.service';
+import { LanguageService } from '@app/core/services/language/language.service';
+import { MatomoService } from '@app/core/services/matomo/matomo-service';
 import { ProgressIndicationService } from '@app/core/services/progress-indication/progress-indication-service';
+import { SideNavService } from '@app/core/services/sidenav/side-nav.sevice';
+import { UserService } from '@app/core/services/user/user.service';
 import { BaseComponent } from '@common/base/base.component';
 import { takeUntil } from 'rxjs/operators';
+import { StartNewDmpDialogComponent } from '../dmp/start-new-dmp-dialogue/start-new-dmp-dialog.component';
+import { FaqDialogComponent } from '../faq/dialog/faq-dialog.component';
 import { UserDialogComponent } from '../misc/navigation/user-dialog/user-dialog.component';
 import { DATASETS_ROUTES, DMP_ROUTES, GENERAL_ROUTES } from '../sidebar/sidebar.component';
-import { LanguageService } from '@app/core/services/language/language.service';
-import { UserService } from '@app/core/services/user/user.service';
-import { FaqDialogComponent } from '../faq/dialog/faq-dialog.component';
-import { DmpInvitationDialogComponent } from '../dmp/invitation/dmp-invitation-dialog.component';
-import { StartNewDmpDialogComponent } from '../dmp/start-new-dmp-dialogue/start-new-dmp-dialog.component';
-import { UserListingModel } from '@app/core/model/user/user-listing';
-import { Principal } from '@app/core/model/auth/principal';
-import { MatomoService } from '@app/core/services/matomo/matomo-service';
-import { HttpClient } from '@angular/common/http';
-import { SideNavService } from '@app/core/services/sidenav/side-nav.sevice';
-import { ConfigurationService } from '@app/core/services/configuration/configuration.service';
-
-const availableLanguages: any[] = require('../../../assets/resources/language.json');
-
 @Component({
 	selector: 'app-navbar',
 	templateUrl: './navbar.component.html',
@@ -36,8 +31,7 @@ export class NavbarComponent extends BaseComponent implements OnInit {
 	mobile_menu_visible: any = 0;
 	private toggleButton: any;
 	private sidebarVisible: boolean;
-	languages = availableLanguages;
+	languages = [];
-	language = this.languages[0];
 	currentRoute: string;
 	selectedLanguage: string;
 	private user: UserListingModel;
@@ -60,6 +54,7 @@ export class NavbarComponent extends BaseComponent implements OnInit {
 		super();
 		this.location = location;
 		this.sidebarVisible = false;
+		this.languages = this.configurationService.availableLanguages;
 		this.selectedLanguage = this.configurationService.defaultLanguage || 'en';
 	}
 
@@ -266,7 +261,7 @@ export class NavbarComponent extends BaseComponent implements OnInit {
 		this.sidebarToggled.emit(event);
 	}
 
-	toggleMyNav(event){
+	toggleMyNav(event) {
 		this.sidenavService.toggle();
 	}
 

dmp-frontend/src/app/ui/sidebar/sidebar-footer/sidebar-footer.component.css

@@ -17,7 +17,7 @@
 }
 
 .sidebar-footer .option:hover {
-	color: #00b29f;
+	color: var(--primary-color-3);
 }
 
 .sidebar-footer .vl {
@@ -26,5 +26,5 @@
 }
 
 .option-active {
-	color: #00b29f !important;
+	color: var(--primary-color-3) !important;
 }

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

@@ -34,7 +34,7 @@ $mat-card-header-size: 30px !default;
 }
 
 .active a i {
-  color: #23bcba;
+  color: var(--primary-color-2);
 }
 
 .inner-line {

dmp-frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.scss

@@ -3,7 +3,7 @@
 		display: flex;
 		width: 100%;
 		height: 89px;
-		background-color: #129d99;
+		background-color: var(--primary-color);
 		color: #ffffff;
 		font-size: 1.25rem;
 	}
@@ -42,14 +42,14 @@
 		width: 84px;
 		height: 43px;
 		background: #ffffff;
-		color: #129d99;
+		color: var(--primary-color);
-		border: 1px solid #129d99;
+		border: 1px solid var(--primary-color);
 		border-radius: 30px;
 		opacity: 1;
 	}
 
 	.add-btn:hover {
-		background-color: #129d99;
+		background-color: var(--primary-color);
 		color: #ffffff;
 	}
 }

dmp-frontend/src/app/ui/user-profile/user-profile-editor.model.ts

@@ -2,7 +2,6 @@ import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms'
 import { RoleOrganizationType } from '@app/core/common/enum/role-organization-type';
 import { OrganizationModel } from '@app/core/model/organisation/organization';
 import { UserListingModel } from '@app/core/model/user/user-listing';
-const availableLanguages: any[] = require('../../../assets/resources/language.json');
 
 export class UserProfileEditorModel {
 	public id: String;
@@ -25,7 +24,7 @@ export class UserProfileEditorModel {
 		return this;
 	}
 
-	buildForm(): FormGroup {
+	buildForm(availableLanguages: any[]): FormGroup {
 		const formGroup = new FormBuilder().group({
 			id: new FormControl(this.id),
 			name: new FormControl(this.name),

dmp-frontend/src/app/ui/user-profile/user-profile.component.scss

@@ -10,7 +10,7 @@
 }
 .clickable:hover {
 	//text-decoration: underline; //Alternative
-	color: #00b29f !important;
+	color: var(--primary-color-3) !important;
 }
 // .two-line-mat-option {
 // 	height: 3.5em;
@@ -66,7 +66,7 @@
 	}
 
 	.name {
-		color: #129d99;
+		color: var(--primary-color);
 		font-weight: 500;
 		font-size: 1.25rem;
 		line-height: 3rem;
@@ -77,7 +77,7 @@
 	}
 
 	.mail {
-		color: #129d99;
+		color: var(--primary-color);
 		font-weight: 500;
 	}
 
@@ -114,7 +114,7 @@
 }
 
 .save-btn {
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	border-radius: 30px;
 	opacity: 1;
 	width: auto;
@@ -151,13 +151,13 @@
     min-width: 162px;
     max-width: 256px;
     height: 40px;
-    color: #129d99;
+    color: var(--primary-color);
     font-size: 0.87rem;
     font-weight: 500;
 }
 
 .vertical-line {
-	border-left: 2px solid #129d99;
+	border-left: 2px solid var(--primary-color);
 }
 
 .email-title {
@@ -179,7 +179,7 @@
 // }
 
 .check-icon {
-	color: #129d99;
+	color: var(--primary-color);
 	transform: scale(0.75);
 	padding: 0.4rem;
 }
@@ -205,7 +205,7 @@
 	cursor: pointer;
 
 	mat-icon {
-		color: #129d99;
+		color: var(--primary-color);
 		display: inline-flex;
 		vertical-align: middle;
 	}

dmp-frontend/src/app/ui/user-profile/user-profile.component.ts

@@ -31,9 +31,7 @@ import { FormValidationErrorsDialogComponent } from '@common/forms/form-validati
 import { SnackBarNotificationLevel, UiNotificationService } from '@app/core/services/notification/ui-notification-service';
 import { MatomoService } from '@app/core/services/matomo/matomo-service';
 import { HttpClient } from '@angular/common/http';
-import {PopupNotificationDialogComponent} from "@app/library/notification/popup/popup-notification.component";
+import { PopupNotificationDialogComponent } from "@app/library/notification/popup/popup-notification.component";
-
-const availableLanguages: any[] = require('../../../assets/resources/language.json');
 
 @Component({
 	selector: 'app-user-profile',
@@ -49,7 +47,7 @@ export class UserProfileComponent extends BaseComponent implements OnInit, OnDes
 	cultures: Observable<CultureInfo[]>;
 	timezones: Observable<any[]>;
 	editMode = false;
-	languages = availableLanguages;
+	languages = [];
 	zenodoToken: string;
 	zenodoEmail: String;
 	roleOrganizationEnum = RoleOrganizationType;
@@ -86,7 +84,10 @@ export class UserProfileComponent extends BaseComponent implements OnInit, OnDes
 		private mergeEmailConfirmation: MergeEmailConfirmationService,
 		private httpClient: HttpClient,
 		private matomoService: MatomoService
-	) { super(); }
+	) {
+		super();
+		this.languages = this.configurationService.availableLanguages;
+	}
 
 	ngOnInit() {
 		this.matomoService.trackPageView('User Profile');
@@ -101,7 +102,7 @@ export class UserProfileComponent extends BaseComponent implements OnInit, OnDes
 					this.zenodoEmail = result['zenodoEmail'];
 
 					this.userProfileEditorModel = new UserProfileEditorModel().fromModel(result);
-					this.formGroup = this.userProfileEditorModel.buildForm();
+					this.formGroup = this.userProfileEditorModel.buildForm(this.configurationService.availableLanguages);
 					// this.formGroup = new FormBuilder().group({
 					// 	language: new FormControl(result['language'] ? availableLanguages.filter(x => x.value === result['language']['value']).pop() : '', [Validators.required]),
 					// 	timezone: new FormControl(result['timezone'], [Validators.required]),

dmp-frontend/src/assets/config/config.json

@@ -8,6 +8,48 @@
 	},
 	"defaultCulture": "en-US",
 	"defaultLanguage": "en",
+	"availableLanguages": [
+		{
+			"label": "GENERAL.LANGUAGES.ENGLISH",
+			"value": "en"
+		},
+		{
+			"label": "GENERAL.LANGUAGES.GREEK",
+			"value": "gr"
+		},
+		{
+			"label": "GENERAL.LANGUAGES.SPANISH",
+			"value": "es"
+		},
+		{
+			"label": "GENERAL.LANGUAGES.GERMAN",
+			"value": "de"
+		},
+		{
+			"label": "GENERAL.LANGUAGES.TURKISH",
+			"value": "tr"
+		},
+		{
+			"label": "GENERAL.LANGUAGES.SLOVAK",
+			"value": "sk"
+		},
+		{
+			"label": "GENERAL.LANGUAGES.SERBIAN",
+			"value": "sr"
+		},
+		{
+			"label": "GENERAL.LANGUAGES.PORTUGUESE",
+			"value": "pt"
+		},
+		{
+			"label": "GENERAL.LANGUAGES.CROATIAN",
+			"value": "hr"
+		},
+		{
+			"label": "GENERAL.LANGUAGES.POLISH",
+			"value": "pl"
+		}
+	],
 	"loginProviders": {
 		"enabled": [1, 2, 3, 4, 5, 6, 7, 8],
 		"facebookConfiguration": { "clientId": "" },

dmp-frontend/src/assets/css/demo.css

@@ -78,7 +78,7 @@ h6 {
 }
 
 .sidebar[data-color="danger"] li.active>a {
-	background-color: rgb(0, 178, 159);
+	background-color: var(--primary-color-1);
 	/* -webkit-box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(255, 255, 255, 0.4); */
 	/* box-shadow: 0 4px 20px 0px rgba(0, 0, 0, 0.14), 0 7px 10px -5px rgba(255, 255, 255, 0.4); */
 	box-shadow: none;
@@ -353,7 +353,7 @@ table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .
 }
 
 .attach-file :hover {
-	color: #00b29f
+	color: var(--primary-color-3)
 }
 
 .normal-btn {
@@ -361,7 +361,7 @@ table>thead>tr>th, .table>tbody>tr>th, .table>tfoot>tr>th, .table>thead>tr>td, .
 	max-width: 256px;
 	height: 40px;
 	cursor: pointer;
-	background: #129d99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	box-shadow: 0px 3px 6px #1e202029;
 	border-radius: 30px;
 	border: none;
@@ -416,7 +416,7 @@ p {
 }
 
 p a {
-	color: #23BCBA;
+	color: var(--primary-color-2);
 }
 
 .bootstrap-overrides a {
@@ -425,7 +425,7 @@ p a {
 }
 
 .bootstrap-overrides a:hover {
-	color: #23BCBA;
+	color: var(--primary-color-2);
 	text-decoration: none;
 }
 
@@ -566,7 +566,7 @@ hr {
 	max-width: 256px;
 	height: 40px;
 	cursor: pointer;
-	background: #129D99 0% 0% no-repeat padding-box;
+	background: var(--primary-color) 0% 0% no-repeat padding-box;
 	box-shadow: 0px 3px 6px #1E202029;
 	border-radius: 30px;
 	border: none;
@@ -599,7 +599,7 @@ hr {
 	width: 894px;
 	height: 221px;
 	background: #FFFFFF 0% 0% no-repeat padding-box;
-	border: 1px solid #23BCBA;
+	border: 1px solid var(--primary-color-2);
 	border-radius: 37px;
 	opacity: 1;
 	margin: 3.75rem 0rem;

dmp-frontend/src/assets/i18n/hr.json

@@ -125,7 +125,7 @@
 			"TERMS": "Uvjeti korištenja",
 			"COOKIES-POLICY": "Politika kolačića",
 			"PLANS": "Moji Planovi",
-			"EXPLORE-PLANS": "Objavljeni Planovi",
+			"EXPLORE-PLANS": "Objavljeni Planovi upravljanja podacima",
 			"QUICK-WIZARD": "Novi Plan (Čarobnjak)",
 			"PLANS-NEW": "Novi Plan (Napredno)",
 			"DMP-NEW": "Novi Plan",
@@ -1245,7 +1245,7 @@
 			"NEW": "Novi Plan upravljanja podacima",
 			"EDIT": "Uredite",
 			"INTRO": "Nalazite se na sučelju za uređivanje Plana upravljanja podacima. Odgovorite na pitanja koja opisuju aktivnosti upravljanja Vašim podacima.",
-			"INTRO-TIP": "Kako biste izbjegli nejasne ili pomiješane informacije različitih vrsta podataka, predlažemo da za svaku vrstu podataka unesete novi Opis skupa podataka."
+			"INTRO-TIP": "Kako biste izbjegli nejasne informacije o različitim vrstama podataka, predlažemo da za svaku vrstu podataka unesete novi Opis skupa podataka."
 		},
 		"FIELDS": {
 			"NAME": "Naziv skupa podataka",
@@ -1264,7 +1264,7 @@
 			"EXTERNAL-DATASET-INFO": "Informacije o vanjskom skupu podataka",
 			"DATAREPOSITORIES-INFO": "Informacije o podatkovnom repozitoriju",
 			"EXTERNAL-LINK": "Vanjska poveznica",
-			"TAGS": "Oznake",
+			"TAGS": "Ključne riječi",
 			"CREATE": "Kreirajte novo"
 		},
 		"ACTIONS": {
@@ -1550,8 +1550,8 @@
 		}
 	},
 	"ABOUT": {
-		"TITLE-DASHED": "- Više o -",
+		"TITLE-DASHED": "- O Argosu -",
-		"TITLE": "Više o",
+		"TITLE": "O Argosu",
 		"MAIN-CONTENT": "Naš cilj je da pohranjeni podaci budu u skladu s FAIR načelima tj. da budu pretraživi (engl. findable), dostupni (engl. accessible), interoperabilni (engl. interoperable) i ponovo upotrebljivi (engl. re-usable). FAIR načela su neophodna za implementaciju Plana upravljanja podacima (eng. Data Management Plan) i ne zahtijevaju primjenu specifičnih tehnologija, standarda ili rješenja.",
 		"CONTRIBUTORS": "Suradnici",
 		"WELCOME": "Dobrodošli u ARGOS",
@@ -1563,7 +1563,7 @@
 		"GUIDE": "Upute za korisnike",
 		"GLOSSARY": "Rječnik",
 		"TERMS-OF-SERVICE": "Uvjeti korištenja",
-		"ABOUT": "Više o",
+		"ABOUT": "O Argosu",
 		"COOKIES-POLICY": "Politika kolačića",
 		"PRIVACY-POLICY": "Politika privatnosti"
 	},