diff --git a/src/Squidex/app/features/api/pages/graphql/graphql-page.component.scss b/src/Squidex/app/features/api/pages/graphql/graphql-page.component.scss
index 6d3c84b1c..e47eee080 100644
--- a/src/Squidex/app/features/api/pages/graphql/graphql-page.component.scss
+++ b/src/Squidex/app/features/api/pages/graphql/graphql-page.component.scss
@@ -1,7 +1,7 @@
 @import '_vars';
 @import '_mixins';
 
-:host /deep/ {
+::ng-deep {
     @import '~graphiql/graphiql';
 
     .graphiql-container {
diff --git a/src/Squidex/app/features/apps/pages/news-dialog.component.scss b/src/Squidex/app/features/apps/pages/news-dialog.component.scss
index 787e1d95a..927e34891 100644
--- a/src/Squidex/app/features/apps/pages/news-dialog.component.scss
+++ b/src/Squidex/app/features/apps/pages/news-dialog.component.scss
@@ -1,7 +1,7 @@
 @import '_vars';
 @import '_mixins';
 
-:host /deep/ {
+::ng-deep {
     img {
         @include box-shadow(0, 4px, 20px, .2);
         width: 80%;
diff --git a/src/Squidex/app/features/apps/pages/onboarding-dialog.component.scss b/src/Squidex/app/features/apps/pages/onboarding-dialog.component.scss
index a2dadddb3..01f6bf120 100644
--- a/src/Squidex/app/features/apps/pages/onboarding-dialog.component.scss
+++ b/src/Squidex/app/features/apps/pages/onboarding-dialog.component.scss
@@ -19,7 +19,7 @@ p {
     max-width: 489px;
 }
 
-:host /deep/ .modal {
+::ng-deep .modal {
     &-content,
     &-dialog {
         min-height: $size-height;
diff --git a/src/Squidex/app/features/assets/pages/assets-page.component.scss b/src/Squidex/app/features/assets/pages/assets-page.component.scss
index 6bc6bf7dc..1c98c09d3 100644
--- a/src/Squidex/app/features/assets/pages/assets-page.component.scss
+++ b/src/Squidex/app/features/assets/pages/assets-page.component.scss
@@ -6,7 +6,7 @@
     padding: 1rem;
 }
 
-:host /deep/ {
+::ng-deep {
     .search {
         .form-control {
             @include border-radius-right;
diff --git a/src/Squidex/app/features/content/pages/content/content-history-page.component.scss b/src/Squidex/app/features/content/pages/content/content-history-page.component.scss
index cf0dec62a..d7f4584de 100644
--- a/src/Squidex/app/features/content/pages/content/content-history-page.component.scss
+++ b/src/Squidex/app/features/content/pages/content/content-history-page.component.scss
@@ -1,7 +1,7 @@
 @import '_vars';
 @import '_mixins';
 
-:host /deep/ {
+::ng-deep {
     .user-ref {
         color: $color-title;
     }
diff --git a/src/Squidex/app/features/content/pages/contents/contents-page.component.scss b/src/Squidex/app/features/content/pages/contents/contents-page.component.scss
index e9f528877..34cd61105 100644
--- a/src/Squidex/app/features/content/pages/contents/contents-page.component.scss
+++ b/src/Squidex/app/features/content/pages/contents/contents-page.component.scss
@@ -1,7 +1,7 @@
 @import '_vars';
 @import '_mixins';
 
-:host /deep/ .search-form {
+::ng-deep .search-form {
     display: block;
 }
 
diff --git a/src/Squidex/app/features/content/shared/array-item.component.scss b/src/Squidex/app/features/content/shared/array-item.component.scss
index 7b54dfb82..976c37102 100644
--- a/src/Squidex/app/features/content/shared/array-item.component.scss
+++ b/src/Squidex/app/features/content/shared/array-item.component.scss
@@ -1,7 +1,7 @@
 @import '_vars';
 @import '_mixins';
 
-:host /deep/ {
+::ng-deep {
     .ui-separator {
         border-color: $color-border !important;
         font-size: 1.2rem;
diff --git a/src/Squidex/app/features/content/shared/contents-selector.component.scss b/src/Squidex/app/features/content/shared/contents-selector.component.scss
index c9609948f..7ad2d6c0f 100644
--- a/src/Squidex/app/features/content/shared/contents-selector.component.scss
+++ b/src/Squidex/app/features/content/shared/contents-selector.component.scss
@@ -1,10 +1,10 @@
 @import '_vars';
 @import '_mixins';
 
-:host /deep/ .modal-body {
+::ng-deep .modal-body {
     background: $color-background;
 }
 
-:host /deep/ .modal-tabs {
+::ng-deep .modal-tabs {
     background: $color-dark-foreground;
 }
\ No newline at end of file
diff --git a/src/Squidex/app/features/dashboard/pages/dashboard-page.component.scss b/src/Squidex/app/features/dashboard/pages/dashboard-page.component.scss
index 936b11b25..1868983c1 100644
--- a/src/Squidex/app/features/dashboard/pages/dashboard-page.component.scss
+++ b/src/Squidex/app/features/dashboard/pages/dashboard-page.component.scss
@@ -19,7 +19,7 @@
     }
 }
 
-:host /deep/ canvas {
+::ng-deep canvas {
     height: 12rem !important;
     margin-top: -1rem;
     margin-bottom: 0;
diff --git a/src/Squidex/app/features/rules/pages/rules/rule-wizard.component.html b/src/Squidex/app/features/rules/pages/rules/rule-wizard.component.html
index fbe0b104a..422b0a98f 100644
--- a/src/Squidex/app/features/rules/pages/rules/rule-wizard.component.html
+++ b/src/Squidex/app/features/rules/pages/rules/rule-wizard.component.html
@@ -22,6 +22,10 @@
 
     <ng-container content>
         <div class="row no-gutters" *ngIf="step === 1">
+            <sqx-form-alert marginTop="0">
+                The selection of the trigger type cannot be changed later.
+            </sqx-form-alert>
+
             <div *ngFor="let triggerType of ruleTriggers | sqxKeys" class="col-12 col-md-6">
                 <div class="rule-element" (click)="selectTriggerType(triggerType)">
                     <sqx-rule-element [type]="triggerType" [isSmall]="false" [element]="ruleTriggers[triggerType]"></sqx-rule-element>
@@ -68,6 +72,10 @@
         </ng-container>
     
         <div class="row no-gutters" *ngIf="step === 3">
+            <sqx-form-alert marginTop="0">
+                The selection of the action type cannot be changed later.
+            </sqx-form-alert>
+
             <div *ngFor="let actionType of ruleActions | sqxKeys" class="col-12 col-md-6">
                 <div class="rule-element" (click)="selectActionType(actionType)">
                     <sqx-rule-element [type]="actionType" [isSmall]="false" [element]="ruleActions[actionType]"></sqx-rule-element>
diff --git a/src/Squidex/app/features/rules/pages/rules/rule-wizard.component.scss b/src/Squidex/app/features/rules/pages/rules/rule-wizard.component.scss
index 927df2b24..4d3d9e03e 100644
--- a/src/Squidex/app/features/rules/pages/rules/rule-wizard.component.scss
+++ b/src/Squidex/app/features/rules/pages/rules/rule-wizard.component.scss
@@ -2,7 +2,7 @@
 @import '_mixins';
 
 .rule-element {
-    margin: .25rem;
+    padding-right: .25rem;
 }
 
 .wizard-title {
diff --git a/src/Squidex/app/features/schemas/pages/schema/field-wizard.component.scss b/src/Squidex/app/features/schemas/pages/schema/field-wizard.component.scss
index c828581c5..fa8db78cb 100644
--- a/src/Squidex/app/features/schemas/pages/schema/field-wizard.component.scss
+++ b/src/Squidex/app/features/schemas/pages/schema/field-wizard.component.scss
@@ -3,7 +3,7 @@
 
 $icon-size: 4.5rem;
 
-:host /deep/ .table-items-row-details-tab {
+::ng-deep .table-items-row-details-tab {
     padding: 1.5rem 1.75rem;
 }
 
diff --git a/src/Squidex/app/features/schemas/pages/schemas/schema-form.component.scss b/src/Squidex/app/features/schemas/pages/schemas/schema-form.component.scss
index 99b0c95da..803413d1f 100644
--- a/src/Squidex/app/features/schemas/pages/schemas/schema-form.component.scss
+++ b/src/Squidex/app/features/schemas/pages/schemas/schema-form.component.scss
@@ -8,7 +8,7 @@ $icon-size: 4.5rem;
     margin-left: -.5rem;
 }
 
-:host /deep/ .editor {
+::ng-deep .editor {
     height: 15rem !important;
     margin-bottom: .5rem;
     margin-top: 0;
diff --git a/src/Squidex/app/framework/angular/forms/code-editor.component.scss b/src/Squidex/app/framework/angular/forms/code-editor.component.scss
index cb89af65e..0fb96d3fb 100644
--- a/src/Squidex/app/framework/angular/forms/code-editor.component.scss
+++ b/src/Squidex/app/framework/angular/forms/code-editor.component.scss
@@ -3,7 +3,7 @@
 
 // sass-lint:disable class-name-format
 
-:host /deep/ {
+::ng-deep {
     .ace_editor {
         background: $color-dark-foreground;
         border: 1px solid $color-input;
diff --git a/src/Squidex/app/framework/angular/forms/color-picker.component.scss b/src/Squidex/app/framework/angular/forms/color-picker.component.scss
index 85b930ea9..8b35bf458 100644
--- a/src/Squidex/app/framework/angular/forms/color-picker.component.scss
+++ b/src/Squidex/app/framework/angular/forms/color-picker.component.scss
@@ -1,7 +1,7 @@
 @import '_mixins';
 @import '_vars';
 
-:host /deep/ {
+::ng-deep {
     .color-picker {
         & {
             border-color: $color-border;
diff --git a/src/Squidex/app/framework/angular/forms/form-alert.component.ts b/src/Squidex/app/framework/angular/forms/form-alert.component.ts
index 2553503dd..b424e0625 100644
--- a/src/Squidex/app/framework/angular/forms/form-alert.component.ts
+++ b/src/Squidex/app/framework/angular/forms/form-alert.component.ts
@@ -9,8 +9,15 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
 
 @Component({
     selector: 'sqx-form-alert',
+    styles: [`
+        :host {
+            display: block;
+            min-width: 100%;
+            max-width: 100%;
+        }
+    `],
     template: `
-        <div class="alert alert-hint mt-2 {{class}}">
+        <div class="alert alert-hint mt-{{marginTop}} mb-{{marginBottom}} {{class}}">
             <i class="icon-info-outline"></i> <ng-content></ng-content>
         </div>`,
     changeDetection: ChangeDetectionStrategy.OnPush
@@ -18,4 +25,10 @@ import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
 export class FormAlertComponent {
     @Input()
     public class: string;
+
+    @Input()
+    public marginTop = 2;
+
+    @Input()
+    public marginBottom = 4;
 }
\ No newline at end of file
diff --git a/src/Squidex/app/framework/angular/forms/json-editor.component.scss b/src/Squidex/app/framework/angular/forms/json-editor.component.scss
index cb89af65e..0fb96d3fb 100644
--- a/src/Squidex/app/framework/angular/forms/json-editor.component.scss
+++ b/src/Squidex/app/framework/angular/forms/json-editor.component.scss
@@ -3,7 +3,7 @@
 
 // sass-lint:disable class-name-format
 
-:host /deep/ {
+::ng-deep {
     .ace_editor {
         background: $color-dark-foreground;
         border: 1px solid $color-input;
diff --git a/src/Squidex/app/shared/components/asset.component.scss b/src/Squidex/app/shared/components/asset.component.scss
index 58ab1e5d0..a1ed483fb 100644
--- a/src/Squidex/app/shared/components/asset.component.scss
+++ b/src/Squidex/app/shared/components/asset.component.scss
@@ -44,7 +44,7 @@ $list-height: 2.375rem;
     padding: 0;
 }
 
-:host /deep/ {
+::ng-deep {
     .form-control {
         &.disabled,
         &:disabled {
diff --git a/src/Squidex/app/shared/components/assets-selector.component.scss b/src/Squidex/app/shared/components/assets-selector.component.scss
index 4a020bd99..0438b80c5 100644
--- a/src/Squidex/app/shared/components/assets-selector.component.scss
+++ b/src/Squidex/app/shared/components/assets-selector.component.scss
@@ -1,7 +1,7 @@
 @import '_vars';
 @import '_mixins';
 
-:host /deep/ {
+::ng-deep {
     .search {
         .form-control {
             @include border-radius-right;
diff --git a/src/Squidex/app/shared/components/history-list.component.scss b/src/Squidex/app/shared/components/history-list.component.scss
index 5c1e18804..5226994c0 100644
--- a/src/Squidex/app/shared/components/history-list.component.scss
+++ b/src/Squidex/app/shared/components/history-list.component.scss
@@ -1,7 +1,7 @@
 @import '_vars';
 @import '_mixins';
 
-:host /deep/ {
+::ng-deep {
     .user-ref {
         color: $color-title;
     }