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 @@
 
         <div class="dialog-content">
             <div class="red-input-group required">
-                <label translate="project-listing.add-edit-dialog.form.name"></label>
-                <input formControlName="projectName" name="projectName" type="text" />
+                <label translate="project-listing.add-edit-dialog.form.name.label"></label>
+                <input
+                    formControlName="projectName"
+                    name="projectName"
+                    type="text"
+                    [placeholder]="'project-listing.add-edit-dialog.form.name.placeholder' | translate"
+                />
             </div>
 
             <div class="red-input-group required" *ngIf="!project">
@@ -23,8 +28,16 @@
             </div>
 
             <div class="red-input-group">
-                <label translate="project-listing.add-edit-dialog.form.description"></label>
-                <textarea formControlName="description" name="description" type="text" rows="5"></textarea>
+                <label translate="project-listing.add-edit-dialog.form.description.label"></label>
+                <textarea
+                    #textarea
+                    [class.has-scrollbar]="hasScrollbar"
+                    formControlName="description"
+                    name="description"
+                    type="text"
+                    rows="5"
+                    [placeholder]="'project-listing.add-edit-dialog.form.description.placeholder' | translate"
+                ></textarea>
             </div>
 
             <div class="due-date">
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 @@
             <div class="red-input-group">
                 <mat-form-field floatLabel="always">
                     <mat-label>{{ 'assign-' + data.type + '-owner.dialog.single-user' | translate }}</mat-label>
-                    <mat-select formControlName="singleUser">
+                    <mat-select formControlName="singleUser" class="w-300">
                         <mat-option *ngFor="let userId of singleUsersSelectOptions" [value]="userId">
                             {{ userService.getNameForId(userId) }}
                         </mat-option>
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 @@
 
             <div class="red-input-group" [class.required]="!isDocumentAdmin">
                 <label translate="manual-annotation.dialog.content.comment"></label>
-                <textarea formControlName="comment" name="comment" type="text" rows="4"></textarea>
+                <textarea #textarea [class.has-scrollbar]="hasScrollbar" class="w-300" formControlName="comment" name="comment" type="text" rows="4"></textarea>
             </div>
 
             <div class="red-input-group required" *ngIf="isDictionaryRequest">
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 @@
 
         <div class="dialog-content">
             <div class="first-row">
-                <div class="red-input-group required w-300">
+                <div class="red-input-group required">
                     <label translate="add-edit-dictionary.form.name"></label>
                     <input
                         formControlName="type"
@@ -17,7 +17,7 @@
                     />
                 </div>
 
-                <div class="red-input-group required w-150">
+                <div class="red-input-group required">
                     <label translate="add-edit-dictionary.form.color"></label>
                     <input
                         class="hex-color-input"
@@ -32,11 +32,16 @@
                         [colorPicker]="dictionaryForm.get('hexColor').value"
                         [cpOutputFormat]="'hex'"
                         (colorPickerChange)="dictionaryForm.get('hexColor').setValue($event)"
-                    ></div>
+                    >
+                        <mat-icon
+                            svgIcon="red:color-picker"
+                            *ngIf="!dictionaryForm.get('hexColor').value || dictionaryForm.get('hexColor').value?.length === 0"
+                        ></mat-icon>
+                    </div>
                 </div>
             </div>
 
-            <div class="red-input-group required w-150">
+            <div class="red-input-group required">
                 <label translate="add-edit-dictionary.form.rank"></label>
                 <input formControlName="rank" name="rank" type="number" placeholder="{{ 'add-edit-dictionary.form.rank-placeholder' | translate }}" />
             </div>
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 @@
 
         <div class="right-container">
             <div class="heading-xl" [translate]="'watermark-screen.title'"></div>
-
             <form [formGroup]="configForm" (keyup)="configChanged()">
-                <div class="red-input-group">
+                <div class="red-input-group required">
                     <label translate="watermark-screen.form.text"></label>
-                    <textarea formControlName="text" name="text" type="text" rows="10"></textarea>
+                    <textarea
+                        #textarea
+                        formControlName="text"
+                        [class.has-scrollbar]="hasScrollbar"
+                        (mousemove)="triggerChanges()"
+                        class="w-full"
+                        name="text"
+                        type="text"
+                        rows="10"
+                    ></textarea>
                 </div>
-                <div class="red-input-group">
+                <div class="red-input-group required w-150">
                     <label translate="watermark-screen.form.color"></label>
                     <input
                         formControlName="hexColor"
+                        class="hex-color-input"
                         name="hexColor"
                         type="text"
                         placeholder="{{ 'add-edit-dictionary.form.color-placeholder' | translate }}"
                     />
                     <div
                         class="input-icon"
+                        [style.background]="configForm.get('hexColor').value"
                         [colorPicker]="configForm.get('hexColor').value"
                         [cpOutputFormat]="'hex'"
                         (colorPickerChange)="configForm.get('hexColor').setValue($event); configChanged()"
                     >
-                        <mat-icon svgIcon="red:color-picker"></mat-icon>
+                        <mat-icon
+                            *ngIf="!configForm.get('hexColor')?.value || configForm.get('hexColor').value?.length === 0"
+                            svgIcon="red:color-picker"
+                        ></mat-icon>
                     </div>
                 </div>
 
-                <div class="red-input-group">
+                <div class="red-input-group required">
                     <label translate="watermark-screen.form.opacity"></label>
-                    <input formControlName="opacity" name="opacity" type="number" (change)="configChanged()" />
+                    <input class="w-75" formControlName="opacity" name="opacity" type="number" (change)="configChanged()" />
                 </div>
 
-                <div class="red-input-group">
+                <div class="red-input-group required">
                     <label translate="watermark-screen.form.font-size"></label>
-                    <input formControlName="fontSize" name="fontSize" type="number" (change)="configChanged()" />
+                    <input class="w-75" formControlName="fontSize" name="fontSize" type="number" (change)="configChanged()" />
                 </div>
             </form>
 
             <div class="actions-container">
-                <button color="primary" mat-flat-button (click)="save()" [disabled]="!changed" class="red-button">
+                <button color="primary" mat-flat-button (click)="save()" [disabled]="configForm.invalid || !changed" class="red-button">
                     {{ 'watermark-screen.action.save' | translate }}
                 </button>
 
-                <div class="all-caps-label pointer cancel" (click)="revert()" [translate]="'watermark-screen.action.revert'"></div>
+                <div class="all-caps-label pointer cancel" [class.disabled]="!changed" (click)="revert()" [translate]="'watermark-screen.action.revert'"></div>
             </div>
         </div>
     </div>
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 @@
             ></redaction-filter>
             <form [formGroup]="searchForm">
                 <div class="red-input-group">
-                    <input [placeholder]="'project-listing.search' | translate" formControlName="query" name="query" type="text" class="with-icon mt-0" />
+                    <input [placeholder]="'project-listing.search' | translate" formControlName="query" name="query" type="text" class="w-250 with-icon mt-0" />
                     <mat-icon class="icon-right" svgIcon="red:search"></mat-icon>
                 </div>
             </form>
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 @@
             ></redaction-filter>
             <form [formGroup]="searchForm">
                 <div class="red-input-group">
-                    <input [placeholder]="'project-overview.search' | translate" formControlName="query" name="query" type="text" class="with-icon mt-0" />
+                    <input
+                        [placeholder]="'project-overview.search' | translate"
+                        formControlName="query"
+                        name="query"
+                        type="text"
+                        class="w-250 with-icon mt-0"
+                    />
                     <mat-icon class="icon-right" svgIcon="red:search"></mat-icon>
                 </div>
             </form>
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;
+        }
     }
 }