diff --git a/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.html b/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.html index c46ac716c..ac10fbf41 100644 --- a/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.html +++ b/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.html @@ -32,7 +32,7 @@ assignment
-
{{ dataset.profile }}
+
{{ dataset.profile }}
diff --git a/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.scss b/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.scss index 106c863eb..a3687c77a 100644 --- a/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.scss +++ b/dmp-frontend/src/app/ui/dataset/listing/listing-item/dataset-listing-item.component.scss @@ -29,6 +29,7 @@ h4 { .about-item { display: flex; + flex-wrap: wrap; } .about-item .length { diff --git a/dmp-frontend/src/app/ui/dmp/listing/listing-item/dmp-listing-item.component.html b/dmp-frontend/src/app/ui/dmp/listing/listing-item/dmp-listing-item.component.html index c737bbd90..3057be6f7 100644 --- a/dmp-frontend/src/app/ui/dmp/listing/listing-item/dmp-listing-item.component.html +++ b/dmp-frontend/src/app/ui/dmp/listing/listing-item/dmp-listing-item.component.html @@ -45,7 +45,7 @@ assignment
-
{{profile.label}}
+
{{profile.label}}

Published {{dmp.creationTime | date: "shortDate"}}

diff --git a/dmp-frontend/src/app/ui/dmp/listing/listing-item/dmp-listing-item.component.scss b/dmp-frontend/src/app/ui/dmp/listing/listing-item/dmp-listing-item.component.scss index 54ff403a2..e57862178 100644 --- a/dmp-frontend/src/app/ui/dmp/listing/listing-item/dmp-listing-item.component.scss +++ b/dmp-frontend/src/app/ui/dmp/listing/listing-item/dmp-listing-item.component.scss @@ -12,6 +12,7 @@ .about-item { display: flex; + flex-wrap: wrap; } .about-item .length { diff --git a/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.html b/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.html index 66094960f..fb792db7f 100644 --- a/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.html +++ b/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.html @@ -2,7 +2,7 @@
- {{dmp.projectabbreviation}} + {{dmp.projectAbbreviation}}
@@ -26,7 +26,7 @@ assignment
-
{{profile.label}}
+
{{profile.label}}

Published {{dmp.creationTime | date: "shortDate"}}

diff --git a/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.scss b/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.scss index 241ffa1b7..44b984514 100644 --- a/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.scss +++ b/dmp-frontend/src/app/ui/explore-dmp/listing-item/explore-dmp-listing-item.component.scss @@ -12,6 +12,7 @@ .about-item { display: flex; + flex-wrap: wrap; } .about-item .length { diff --git a/dmp-frontend/src/styles.scss b/dmp-frontend/src/styles.scss index a65b352e5..2680dea9e 100644 --- a/dmp-frontend/src/styles.scss +++ b/dmp-frontend/src/styles.scss @@ -58,7 +58,11 @@ $theme: mat-light-theme($primary, $accent); background-color: rgb(70, 135, 230); color: #fff; text-transform: uppercase; - font-weight: 500; + font-weight: 500; + max-width: 160px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } .bordered-chip { @@ -68,7 +72,11 @@ $theme: mat-light-theme($primary, $accent); background-color: rgb(236, 241, 249); color: rgb(68, 114, 196); text-transform: uppercase; - font-weight: 500; + font-weight: 500; + max-width: 160px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } .squared-chip { @@ -76,7 +84,11 @@ $theme: mat-light-theme($primary, $accent); border: 0.1em solid rgb(236, 241, 249); border-radius: 0.5em; background-color: rgb(246, 246, 246); - color: rgb(127, 127, 127); + color: rgb(127, 127, 127); + max-width: 160px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } mat-icon {