diff --git a/apps/red-ui/src/app/dialogs/manual-redaction-dialog/manual-annotation-dialog.component.html b/apps/red-ui/src/app/dialogs/manual-redaction-dialog/manual-annotation-dialog.component.html
index 1ef91cfa3..1793e4cf8 100644
--- a/apps/red-ui/src/app/dialogs/manual-redaction-dialog/manual-annotation-dialog.component.html
+++ b/apps/red-ui/src/app/dialogs/manual-redaction-dialog/manual-annotation-dialog.component.html
@@ -38,9 +38,12 @@
-
+
+ {{ displayedDictionaryLabel }}
{{ dictionary.label }}
+
+ {{ dictionaryDescriptions[dictionary.label] }}
diff --git a/apps/red-ui/src/app/dialogs/manual-redaction-dialog/manual-annotation-dialog.component.ts b/apps/red-ui/src/app/dialogs/manual-redaction-dialog/manual-annotation-dialog.component.ts
index 17e3fd101..94e114440 100644
--- a/apps/red-ui/src/app/dialogs/manual-redaction-dialog/manual-annotation-dialog.component.ts
+++ b/apps/red-ui/src/app/dialogs/manual-redaction-dialog/manual-annotation-dialog.component.ts
@@ -31,6 +31,13 @@ export class ManualAnnotationDialogComponent implements OnInit {
redactionDictionaries: TypeValue[] = [];
legalOptions: LegalBasisOption[] = [];
+ public dictionaryDescriptions = {
+ 'CBI Address': 'Laboratory Address: Redaction in combination with vertebrates',
+ 'CBI Author': 'Study Author: Redaction in combination with vertebrates',
+ 'CBI Sponsor': 'Batch Sponsor: Redaction in combination with "batches produced at"',
+ PII: 'Personal Identification Information: Employee name, email, phone, fax, ...'
+ };
+
get title() {
return this._manualAnnotationService.getTitle(this.manualRedactionEntryWrapper.type);
}
@@ -83,6 +90,14 @@ export class ManualAnnotationDialogComponent implements OnInit {
this.redactionDictionaries.sort((a, b) => a.label.localeCompare(b.label));
}
+ public get displayedDictionaryLabel() {
+ const dictType = this.redactionForm.get('dictionary').value;
+ if (dictType) {
+ return this.redactionDictionaries.find((d) => d.type === dictType).label;
+ }
+ return null;
+ }
+
handleAddRedaction() {
this._enhanceManualRedaction(this.manualRedactionEntryWrapper.manualRedactionEntry);
this._manualAnnotationService.addAnnotation(this.manualRedactionEntryWrapper.manualRedactionEntry).subscribe(
diff --git a/apps/red-ui/src/assets/styles/red-select.scss b/apps/red-ui/src/assets/styles/red-select.scss
index 720d6b8f1..1e5c2af1b 100644
--- a/apps/red-ui/src/assets/styles/red-select.scss
+++ b/apps/red-ui/src/assets/styles/red-select.scss
@@ -1,48 +1,18 @@
@import 'red-variables';
-.red-select {
- .mat-select-value-text {
- font-family: Inter, sans-serif;
- color: $grey-1;
- font-size: 13px;
- line-height: 14px;
- }
+.mat-select-panel.description-select mat-option.mat-option {
+ height: unset;
- .mat-form-field-infix {
- padding: 0;
- border: none;
- width: fit-content;
- }
+ .mat-option-text.mat-option-text {
+ white-space: normal;
+ line-height: 16px;
+ margin: 12px auto;
+ font-weight: 500;
- .mat-select-value {
- max-width: none;
- }
-
- .mat-select-arrow-wrapper {
- padding-left: 5px;
-
- .mat-select-arrow {
- color: $grey-1 !important;
- }
- }
-}
-
-.red-select-panel {
- border-radius: 0 !important;
-
- .mat-option {
- background: $white !important;
- font-family: Inter, sans-serif;
- color: $grey-1;
- font-size: 13px;
- line-height: 14px;
-
- &.mat-selected.mat-active {
- color: $primary;
- }
-
- &:hover {
- background: $grey-2 !important;
+ .description {
+ font-size: 12px;
+ font-weight: initial;
+ opacity: 0.6;
}
}
}