From c513dd8e5d2efa564472ca94c74b0a67924b0fc4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adina=20=C8=9Aeudan?= Date: Mon, 14 Dec 2020 12:09:40 +0200 Subject: [PATCH 1/4] Top navigation down arrow --- .../src/app/screens/base-screen/base-screen.component.html | 1 + apps/red-ui/src/assets/i18n/en.json | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/apps/red-ui/src/app/screens/base-screen/base-screen.component.html b/apps/red-ui/src/app/screens/base-screen/base-screen.component.html index 7e7ded941..3833b550c 100644 --- a/apps/red-ui/src/app/screens/base-screen/base-screen.component.html +++ b/apps/red-ui/src/app/screens/base-screen/base-screen.component.html @@ -38,6 +38,7 @@ {{ 'top-bar.navigation-items.back-to-projects' | translate }} + Date: Mon, 14 Dec 2020 12:49:42 +0200 Subject: [PATCH 2/4] File actions order & icons, assign dialog fixes --- .../file-actions/file-actions.component.html | 113 +++++++++--------- .../file-actions/file-actions.component.ts | 4 +- .../assign-owner-dialog.component.html | 2 +- .../assign-owner-dialog.component.scss | 2 +- .../assign-owner-dialog.component.ts | 5 + apps/red-ui/src/app/dialogs/dialog.service.ts | 4 +- apps/red-ui/src/app/icons/icons.module.ts | 2 + .../file/service/file-action.service.ts | 18 +-- .../src/assets/icons/general/approved.svg | 13 ++ .../icons/general/ready-for-approval.svg | 7 ++ apps/red-ui/src/assets/icons/general/undo.svg | 33 +++-- 11 files changed, 117 insertions(+), 86 deletions(-) create mode 100644 apps/red-ui/src/assets/icons/general/approved.svg create mode 100644 apps/red-ui/src/assets/icons/general/ready-for-approval.svg diff --git a/apps/red-ui/src/app/common/file-actions/file-actions.component.html b/apps/red-ui/src/app/common/file-actions/file-actions.component.html index a2179d019..eb2505a8b 100644 --- a/apps/red-ui/src/app/common/file-actions/file-actions.component.html +++ b/apps/red-ui/src/app/common/file-actions/file-actions.component.html @@ -4,9 +4,9 @@ (action)="openDeleteFileDialog($event, fileStatus)" *ngIf="permissionsService.canDeleteFile(fileStatus)" [tooltipPosition]="tooltipPosition" - tooltip="project-overview.delete.action" - icon="red:trash" [type]="buttonType" + icon="red:trash" + tooltip="project-overview.delete.action" > @@ -14,50 +14,9 @@ - - - - - - - - - - - - - @@ -66,12 +25,12 @@ @@ -80,9 +39,55 @@ (action)="downloadFile($event, fileStatus)" *ngIf="permissionsService.canDownloadRedactedFile(fileStatus)" [tooltipPosition]="tooltipPosition" - tooltip="project-overview.download-redacted-file" - icon="red:download" [type]="buttonType" + icon="red:download" + tooltip="project-overview.download-redacted-file" + > + + + + + + + + + + + + + + + + + + @@ -91,10 +96,10 @@ (action)="reanalyseFile($event, fileStatus)" *ngIf="permissionsService.canReanalyseFile(fileStatus) && screen === 'file-preview'" [tooltipPosition]="'before'" - tooltip="file-preview.reanalyse-notification" - type="warn" - tooltipClass="warn small" icon="red:refresh" + tooltip="file-preview.reanalyse-notification" + tooltipClass="warn small" + type="warn" > @@ -103,8 +108,8 @@ (action)="reanalyseFile($event, fileStatus)" *ngIf="permissionsService.canReanalyseFile(fileStatus) && screen === 'project-overview'" [tooltipPosition]="tooltipPosition" - tooltip="project-overview.reanalyse.action" icon="red:refresh" + tooltip="project-overview.reanalyse.action" type="dark-bg" > diff --git a/apps/red-ui/src/app/common/file-actions/file-actions.component.ts b/apps/red-ui/src/app/common/file-actions/file-actions.component.ts index 6dca70ad1..1d7918d17 100644 --- a/apps/red-ui/src/app/common/file-actions/file-actions.component.ts +++ b/apps/red-ui/src/app/common/file-actions/file-actions.component.ts @@ -85,12 +85,12 @@ export class FileActionsComponent implements OnInit { }); } - setFileUnderReview($event: MouseEvent, fileStatus: FileStatusWrapper) { + setFileUnderReview($event: MouseEvent, fileStatus: FileStatusWrapper, ignoreDialogChanges = false) { $event.stopPropagation(); // this._fileActionService.setFileUnderReview(fileStatus).subscribe(() => { // this.reloadProjects('set-review'); // }); - this._fileActionService.assignProjectReviewer(fileStatus, () => this.actionPerformed.emit('assign-reviewer')); + this._fileActionService.assignProjectReviewer(fileStatus, () => this.actionPerformed.emit('assign-reviewer'), ignoreDialogChanges); } reloadProjects(action: string) { diff --git a/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.html b/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.html index 25c33a2a0..838dddd18 100644 --- a/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.html +++ b/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.html @@ -2,7 +2,7 @@
-
+
{{ 'assign-' + data.type + '-owner.dialog.single-user' | translate }} diff --git a/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.scss b/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.scss index 250f30687..ff164192c 100644 --- a/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.scss +++ b/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.scss @@ -1,6 +1,6 @@ @import '../../../assets/styles/red-mixins'; -.dialog-content { +.no-padding-bottom { padding-bottom: 0; } diff --git a/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.ts b/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.ts index f486f9186..2a2ffa7f1 100644 --- a/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.ts +++ b/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.ts @@ -12,6 +12,7 @@ class DialogData { type: 'file' | 'project'; project?: ProjectWrapper; files?: FileStatusWrapper[]; + ignoreChanged?: boolean; } @Component({ @@ -132,6 +133,10 @@ export class AssignOwnerDialogComponent { } public get changed(): boolean { + if (this.data.ignoreChanged) { + return true; + } + if (this.data.type === 'project') { if (this.data.project.ownerId !== this.selectedSingleUser) { return true; diff --git a/apps/red-ui/src/app/dialogs/dialog.service.ts b/apps/red-ui/src/app/dialogs/dialog.service.ts index bbdd81c2d..b95f6f3b4 100644 --- a/apps/red-ui/src/app/dialogs/dialog.service.ts +++ b/apps/red-ui/src/app/dialogs/dialog.service.ts @@ -204,10 +204,10 @@ export class DialogService { return ref; } - public openAssignFileReviewerDialog(file: FileStatus, cb?: Function): MatDialogRef { + public openAssignFileReviewerDialog(file: FileStatus, cb?: Function, ignoreDialogChanges = false): MatDialogRef { const ref = this._dialog.open(AssignOwnerDialogComponent, { ...dialogConfig, - data: { type: 'file', files: [file] } + data: { type: 'file', files: [file], ignoreChanged: ignoreDialogChanges } }); ref.afterClosed().subscribe(() => { diff --git a/apps/red-ui/src/app/icons/icons.module.ts b/apps/red-ui/src/app/icons/icons.module.ts index 5c91fccf8..bfc4b3585 100644 --- a/apps/red-ui/src/app/icons/icons.module.ts +++ b/apps/red-ui/src/app/icons/icons.module.ts @@ -13,6 +13,7 @@ export class IconsModule { const icons = [ 'add', 'analyse', + 'approved', 'arrow-down', 'arrow-up', 'arrow-right', @@ -49,6 +50,7 @@ export class IconsModule { 'preview', 'radio-indeterminate', 'radio-selected', + 'ready-for-approval', 'refresh', 'report', 'search', diff --git a/apps/red-ui/src/app/screens/file/service/file-action.service.ts b/apps/red-ui/src/app/screens/file/service/file-action.service.ts index 6c1833727..7d3c938cb 100644 --- a/apps/red-ui/src/app/screens/file/service/file-action.service.ts +++ b/apps/red-ui/src/app/screens/file/service/file-action.service.ts @@ -44,13 +44,17 @@ export class FileActionService { }); } - public assignProjectReviewer(file?: FileStatus, callback?: Function) { - this._dialogService.openAssignFileReviewerDialog(file ? file : this._appStateService.activeFile, async () => { - await this._appStateService.reloadActiveProjectFiles(); - if (callback) { - callback(); - } - }); + public assignProjectReviewer(file?: FileStatus, callback?: Function, ignoreDialogChanges = false) { + this._dialogService.openAssignFileReviewerDialog( + file ? file : this._appStateService.activeFile, + async () => { + await this._appStateService.reloadActiveProjectFiles(); + if (callback) { + callback(); + } + }, + ignoreDialogChanges + ); } public async assignToMe(file?: FileStatus, callback?: Function) { diff --git a/apps/red-ui/src/assets/icons/general/approved.svg b/apps/red-ui/src/assets/icons/general/approved.svg new file mode 100644 index 000000000..0240a82e8 --- /dev/null +++ b/apps/red-ui/src/assets/icons/general/approved.svg @@ -0,0 +1,13 @@ + + + 163F9A92-B60D-42FF-80C8-1135F4B95ECC + + + + + + + + + + diff --git a/apps/red-ui/src/assets/icons/general/ready-for-approval.svg b/apps/red-ui/src/assets/icons/general/ready-for-approval.svg new file mode 100644 index 000000000..24be62ca8 --- /dev/null +++ b/apps/red-ui/src/assets/icons/general/ready-for-approval.svg @@ -0,0 +1,7 @@ + + + ready_for_approval + + + + diff --git a/apps/red-ui/src/assets/icons/general/undo.svg b/apps/red-ui/src/assets/icons/general/undo.svg index 82bf73bef..13567f137 100644 --- a/apps/red-ui/src/assets/icons/general/undo.svg +++ b/apps/red-ui/src/assets/icons/general/undo.svg @@ -1,20 +1,15 @@ - - - - + + + B3EA3E95-AC5D-4F73-ACEB-7F071103E161 + + + + + + + + + + + From 40f41c70ecc45bf3af7050bf7b6525d46b3a7347 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Adina=20=C8=9Aeudan?= Date: Mon, 14 Dec 2020 13:10:51 +0200 Subject: [PATCH 3/4] Project overview actions order --- .../bulk-actions/bulk-actions.component.html | 36 +++++++++---------- .../bulk-actions/bulk-actions.component.ts | 1 + .../project-overview-screen.component.html | 16 ++++----- 3 files changed, 26 insertions(+), 27 deletions(-) diff --git a/apps/red-ui/src/app/screens/project-overview-screen/bulk-actions/bulk-actions.component.html b/apps/red-ui/src/app/screens/project-overview-screen/bulk-actions/bulk-actions.component.html index 2980c7283..6c988e287 100644 --- a/apps/red-ui/src/app/screens/project-overview-screen/bulk-actions/bulk-actions.component.html +++ b/apps/red-ui/src/app/screens/project-overview-screen/bulk-actions/bulk-actions.component.html @@ -15,22 +15,6 @@ icon="red:assign" > - - - - - + + + + + diff --git a/apps/red-ui/src/app/screens/project-overview-screen/bulk-actions/bulk-actions.component.ts b/apps/red-ui/src/app/screens/project-overview-screen/bulk-actions/bulk-actions.component.ts index f0cb2ffb3..0e997fbb4 100644 --- a/apps/red-ui/src/app/screens/project-overview-screen/bulk-actions/bulk-actions.component.ts +++ b/apps/red-ui/src/app/screens/project-overview-screen/bulk-actions/bulk-actions.component.ts @@ -87,6 +87,7 @@ export class BulkActionsComponent { public get canSetToUnderReview() { return this.selectedFiles.reduce((acc, file) => acc && this._permissionsService.canSetUnderReview(file), true); } + public setToUnderReview() { const promises = this.selectedFiles.map((file) => this._fileActionService.setFileUnderReview(file).toPromise()); diff --git a/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html b/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html index 0a353e0d5..b7a623045 100644 --- a/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html +++ b/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html @@ -60,6 +60,13 @@ tooltipPosition="below" icon="red:report" > + - - - Date: Mon, 14 Dec 2020 16:52:16 +0200 Subject: [PATCH 4/4] UI updates --- .../add-edit-project-dialog.component.html | 21 +++++++-- .../add-edit-project-dialog.component.ts | 7 ++- .../assign-owner-dialog.component.html | 2 +- .../assign-owner-dialog.component.scss | 5 ++ .../manual-annotation-dialog.component.html | 2 +- .../manual-annotation-dialog.component.ts | 8 +++- .../add-edit-dictionary-dialog.component.html | 13 +++-- .../add-edit-dictionary-dialog.component.scss | 14 ------ .../watermark-screen.component.html | 35 +++++++++----- .../watermark-screen.component.scss | 10 ++++ .../watermark-screen.component.ts | 18 +++++-- .../project-listing-screen.component.html | 2 +- .../project-overview-screen.component.html | 8 +++- apps/red-ui/src/assets/i18n/en.json | 12 +++-- apps/red-ui/src/assets/styles/red-input.scss | 47 +++++++++++++++++-- apps/red-ui/src/assets/styles/red-mixins.scss | 1 - .../src/assets/styles/red-text-styles.scss | 11 ++++- 17 files changed, 163 insertions(+), 53 deletions(-) diff --git a/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.html b/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.html index f98ba2b58..b99461ad6 100644 --- a/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.html +++ b/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.html @@ -7,8 +7,13 @@
- - + +
@@ -23,8 +28,16 @@
- - + +
diff --git a/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.ts b/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.ts index f5e3ab52e..7632a6acd 100644 --- a/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.ts +++ b/apps/red-ui/src/app/dialogs/add-edit-project-dialog/add-edit-project-dialog.component.ts @@ -1,4 +1,4 @@ -import { Component, Inject } from '@angular/core'; +import { Component, ElementRef, Inject, ViewChild } from '@angular/core'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { Project } from '@redaction/red-ui-http'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; @@ -14,6 +14,7 @@ import * as moment from 'moment'; export class AddEditProjectDialogComponent { public projectForm: FormGroup; public hasDueDate = true; + @ViewChild('textarea') private _textarea: ElementRef; constructor( private readonly _appStateService: AppStateService, @@ -29,6 +30,10 @@ export class AddEditProjectDialogComponent { this.hasDueDate = !!this.project?.dueDate; } + public get hasScrollbar() { + return this._textarea?.nativeElement.clientHeight < this._textarea?.nativeElement.scrollHeight; + } + public get changed() { if (!this.project) { return true; diff --git a/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.html b/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.html index 838dddd18..f3ab9efcf 100644 --- a/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.html +++ b/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.html @@ -6,7 +6,7 @@
{{ 'assign-' + data.type + '-owner.dialog.single-user' | translate }} - + {{ userService.getNameForId(userId) }} diff --git a/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.scss b/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.scss index ff164192c..ca9aa7cb3 100644 --- a/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.scss +++ b/apps/red-ui/src/app/dialogs/assign-owner-dialog/assign-owner-dialog.component.scss @@ -7,6 +7,11 @@ .search-container { width: 560px; margin-top: 16px; + + input { + width: 100%; + max-width: 100%; + } } .members-list { 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 f59de3b1d..dc4b4c8f8 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 @@ -32,7 +32,7 @@
- +
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 a51197fc5..b0e129025 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 @@ -1,4 +1,4 @@ -import { Component, Inject, OnInit } from '@angular/core'; +import { Component, ElementRef, Inject, OnInit, ViewChild } from '@angular/core'; import { FormBuilder, FormGroup, Validators } from '@angular/forms'; import { AppStateService } from '../../state/app-state.service'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; @@ -31,6 +31,8 @@ export class ManualAnnotationDialogComponent implements OnInit { legalOptions: LegalBasisOption[] = []; + @ViewChild('textarea') private _textarea: ElementRef; + constructor( private readonly _appStateService: AppStateService, private readonly _userService: UserService, @@ -77,6 +79,10 @@ export class ManualAnnotationDialogComponent implements OnInit { } } + public get hasScrollbar() { + return this._textarea?.nativeElement.clientHeight < this._textarea?.nativeElement.scrollHeight; + } + handleAddRedaction() { this._enhanceManualRedaction(this.manualRedactionEntryWrapper.manualRedactionEntry); this._manualAnnotationService.addAnnotation(this.manualRedactionEntryWrapper.manualRedactionEntry).subscribe( diff --git a/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/add-edit-dictionary-dialog/add-edit-dictionary-dialog.component.html b/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/add-edit-dictionary-dialog/add-edit-dictionary-dialog.component.html index 6521a7792..45b1b5915 100644 --- a/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/add-edit-dictionary-dialog/add-edit-dictionary-dialog.component.html +++ b/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/add-edit-dictionary-dialog/add-edit-dictionary-dialog.component.html @@ -6,7 +6,7 @@
-
+
-
+
+ > + +
-
+
diff --git a/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/add-edit-dictionary-dialog/add-edit-dictionary-dialog.component.scss b/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/add-edit-dictionary-dialog/add-edit-dictionary-dialog.component.scss index 404b84fe2..9bec5b50c 100644 --- a/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/add-edit-dictionary-dialog/add-edit-dictionary-dialog.component.scss +++ b/apps/red-ui/src/app/screens/admin/dictionary-listing-screen/add-edit-dictionary-dialog/add-edit-dictionary-dialog.component.scss @@ -1,15 +1,5 @@ @import '../../../../../assets/styles/red-variables'; -.w-300 { - max-width: 300px; - width: 300px; -} - -.w-150 { - max-width: 150px; - width: 150px; -} - .first-row { display: flex; @@ -33,7 +23,3 @@ transition: background-color 0.25s ease; color: $white; } - -.hex-color-input { - padding-right: 40px; -} diff --git a/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.html b/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.html index 489689f81..23418b272 100644 --- a/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.html +++ b/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.html @@ -22,47 +22,60 @@
- -
+
- +
-
+
- +
-
+
- +
-
+
- +
- -
+
diff --git a/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.scss b/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.scss index 1d6dbb5a4..a8d503a74 100644 --- a/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.scss +++ b/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.scss @@ -12,6 +12,11 @@ width: 353px; min-width: 353px; padding: 25px; + overflow: visible; + + &:hover { + overflow: visible; + } .heading-xl { margin-bottom: 24px; @@ -27,3 +32,8 @@ } } } + +.w-150 { + max-width: 150px; + width: 150px; +} diff --git a/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.ts b/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.ts index b5b69060b..4caff813a 100644 --- a/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.ts +++ b/apps/red-ui/src/app/screens/admin/watermark-screen/watermark-screen.component.ts @@ -5,7 +5,7 @@ import { AppStateService } from '../../../state/app-state.service'; import { FileDownloadService } from '../../file/service/file-download.service'; import { environment } from '../../../../environments/environment'; import { HttpClient } from '@angular/common/http'; -import { FormBuilder, FormGroup } from '@angular/forms'; +import { FormBuilder, FormGroup, Validators } from '@angular/forms'; import { debounce } from '../../../utils/debounce'; import { WatermarkControllerService, WatermarkModel } from '@redaction/red-ui-http'; import { NotificationService, NotificationType } from '../../../notification/notification.service'; @@ -36,6 +36,8 @@ export class WatermarkScreenComponent implements OnInit { @ViewChild('viewer', { static: true }) private _viewer: ElementRef; + @ViewChild('textarea') private _textarea: ElementRef; + public viewReady = false; public configForm: FormGroup; @@ -100,6 +102,12 @@ export class WatermarkScreenComponent implements OnInit { this.configChanged(); } + public triggerChanges() {} + + public get hasScrollbar() { + return this._textarea?.nativeElement.clientHeight < this._textarea?.nativeElement.scrollHeight; + } + private _loadViewer() { WebViewer( { @@ -154,10 +162,10 @@ export class WatermarkScreenComponent implements OnInit { private _initForm() { this.configForm = this._formBuilder.group({ - text: null, - hexColor: null, - opacity: null, - fontSize: null + text: [null, Validators.required], + hexColor: [null, Validators.required], + opacity: [null, Validators.required], + fontSize: [null, Validators.required] }); } } diff --git a/apps/red-ui/src/app/screens/project-listing-screen/project-listing-screen.component.html b/apps/red-ui/src/app/screens/project-listing-screen/project-listing-screen.component.html index 42e3a3a62..3e01d8411 100644 --- a/apps/red-ui/src/app/screens/project-listing-screen/project-listing-screen.component.html +++ b/apps/red-ui/src/app/screens/project-listing-screen/project-listing-screen.component.html @@ -23,7 +23,7 @@ >
- +
diff --git a/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html b/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html index b7a623045..23c176b20 100644 --- a/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html +++ b/apps/red-ui/src/app/screens/project-overview-screen/project-overview-screen.component.html @@ -24,7 +24,13 @@ >
- +
diff --git a/apps/red-ui/src/assets/i18n/en.json b/apps/red-ui/src/assets/i18n/en.json index efff06f2c..3eb999dc7 100644 --- a/apps/red-ui/src/assets/i18n/en.json +++ b/apps/red-ui/src/assets/i18n/en.json @@ -100,11 +100,17 @@ } }, "add-edit-dialog": { - "header-new": "New Project", + "header-new": "Create Project", "header-edit": "Edit Project", "form": { - "description": "Description", - "name": "Name", + "name": { + "label": "Project Name", + "placeholder": "Enter Name" + }, + "description": { + "label": "Description", + "placeholder": "Enter Description" + }, "due-date": "Due Date", "template": "Project Template" }, diff --git a/apps/red-ui/src/assets/styles/red-input.scss b/apps/red-ui/src/assets/styles/red-input.scss index c416f8bda..99314813d 100644 --- a/apps/red-ui/src/assets/styles/red-input.scss +++ b/apps/red-ui/src/assets/styles/red-input.scss @@ -19,6 +19,9 @@ border-bottom-right-radius: 7px; cursor: pointer; transition: background-color 0.25s ease; + display: flex; + align-items: center; + justify-content: center; &:hover { background: $grey-6; @@ -85,10 +88,41 @@ color: $grey-1; opacity: 0.7; } + + &.w-75 { + width: 75px; + max-width: 75px; + } + + &.w-250 { + width: 250px; + max-width: 250px; + } + + &.w-300 { + width: 300px; + max-width: 300px; + } + + &.w-full { + width: 100%; + max-width: 100%; + } + } + + input { + max-width: 300px; + width: 300px; + + &.hex-color-input { + width: 150px; + max-width: 150px; + } } mat-select { - width: 220px; + width: 400px; + max-width: 400px; .mat-select-trigger { height: 32px; @@ -100,10 +134,17 @@ } textarea { - resize: none; + resize: vertical; padding-top: 7px; padding-bottom: 7px; - @include no-scroll-bar(); + @include scroll-bar; + width: 400px; + max-width: 400px; + + &.has-scrollbar { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } } label { diff --git a/apps/red-ui/src/assets/styles/red-mixins.scss b/apps/red-ui/src/assets/styles/red-mixins.scss index d10770e11..aa19c514b 100644 --- a/apps/red-ui/src/assets/styles/red-mixins.scss +++ b/apps/red-ui/src/assets/styles/red-mixins.scss @@ -32,7 +32,6 @@ /* Track */ &::-webkit-scrollbar-track { background: $grey-2; - //background: red; } /* Handle */ diff --git a/apps/red-ui/src/assets/styles/red-text-styles.scss b/apps/red-ui/src/assets/styles/red-text-styles.scss index 28648588e..dddc7c5dc 100644 --- a/apps/red-ui/src/assets/styles/red-text-styles.scss +++ b/apps/red-ui/src/assets/styles/red-text-styles.scss @@ -57,8 +57,15 @@ pre { line-height: 14px; transition: opacity 0.2s; - &.cancel:hover { - opacity: 1; + &.cancel { + &:hover { + opacity: 1; + } + + &.disabled { + opacity: 0.3; + cursor: default; + } } }