Style improvements.

backend/src/Squidex.Domain.Apps.Core.Model/Contents/NoUpdate.cs

@@ -11,12 +11,12 @@ namespace Squidex.Domain.Apps.Core.Contents
     {
         public static readonly NoUpdate Always = new NoUpdate(null, null);
 
-        public NoUpdate(string expression, params string[] roles)
+        public NoUpdate(string? expression, params string[]? roles)
             : base(expression, roles)
         {
         }
 
-        public static NoUpdate When(string expression, params string[] roles)
+        public static NoUpdate When(string? expression, params string[]? roles)
         {
             return new NoUpdate(expression, roles);
         }

backend/src/Squidex.Domain.Apps.Core.Model/Contents/WorkflowCondition.cs

@@ -12,11 +12,11 @@ namespace Squidex.Domain.Apps.Core.Contents
 {
     public abstract class WorkflowCondition
     {
-        public string Expression { get; }
+        public string? Expression { get; }
 
-        public ReadOnlyCollection<string> Roles { get; }
+        public ReadOnlyCollection<string>? Roles { get; }
 
-        protected WorkflowCondition(string expression, params string[] roles)
+        protected WorkflowCondition(string? expression, params string[]? roles)
         {
             Expression = expression;
 

backend/src/Squidex.Domain.Apps.Core.Model/Contents/WorkflowStep.cs

@@ -15,9 +15,9 @@ namespace Squidex.Domain.Apps.Core.Contents
 
         public IReadOnlyDictionary<Status, WorkflowTransition> Transitions { get; }
 
-        public string Color { get; }
+        public string? Color { get; }
 
-        public NoUpdate NoUpdate { get; }
+        public NoUpdate? NoUpdate { get; }
 
         public WorkflowStep(IReadOnlyDictionary<Status, WorkflowTransition>? transitions = null, string? color = null, NoUpdate? noUpdate = null)
         {

backend/src/Squidex.Domain.Apps.Core.Model/Contents/WorkflowTransition.cs

@@ -11,12 +11,12 @@ namespace Squidex.Domain.Apps.Core.Contents
     {
         public static readonly WorkflowTransition Always = new WorkflowTransition(null, null);
 
-        public WorkflowTransition(string expression, params string[] roles)
+        public WorkflowTransition(string? expression, params string[]? roles)
             : base(expression, roles)
         {
         }
 
-        public static WorkflowTransition When(string expression, params string[] roles)
+        public static WorkflowTransition When(string? expression, params string[]? roles)
         {
             return new WorkflowTransition(expression, roles);
         }

backend/src/Squidex/Areas/Api/Controllers/Apps/Models/WorkflowDto.cs

@@ -50,7 +50,7 @@ namespace Squidex.Areas.Api.Controllers.Apps.Models
             {
                 Steps = workflow.Steps.ToDictionary(
                     x => x.Key,
-                    x => WorkflowStepDto.FromWorkflowStep(x.Value)!),
+                    x => WorkflowStepDto.FromWorkflowStep(x.Value)),
                 Id = id
             });
 

backend/src/Squidex/Areas/Api/Controllers/Apps/Models/WorkflowStepDto.cs

@@ -35,20 +35,15 @@ namespace Squidex.Areas.Api.Controllers.Apps.Models
         /// <summary>
         /// Optional expression that must evaluate to true when you want to prevent updates.
         /// </summary>
-        public string NoUpdateExpression { get; set; }
+        public string? NoUpdateExpression { get; set; }
 
         /// <summary>
         /// Optional list of roles to restrict the updates for users with these roles.
         /// </summary>
-        public string[] NoUpdateRoles { get; set; }
+        public string[]? NoUpdateRoles { get; set; }
 
-        public static WorkflowStepDto? FromWorkflowStep(WorkflowStep step)
+        public static WorkflowStepDto FromWorkflowStep(WorkflowStep step)
         {
-            if (step == null)
-            {
-                return null;
-            }
-
             var response = SimpleMapper.Map(step, new WorkflowStepDto
             {
                 Transitions = step.Transitions.ToDictionary(

backend/src/Squidex/Areas/Api/Controllers/Apps/Models/WorkflowTransitionDto.cs

@@ -15,20 +15,15 @@ namespace Squidex.Areas.Api.Controllers.Apps.Models
         /// <summary>
         /// The optional expression.
         /// </summary>
-        public string Expression { get; set; }
+        public string? Expression { get; set; }
 
         /// <summary>
         /// The optional restricted role.
         /// </summary>
-        public string[] Roles { get; set; }
+        public string[]? Roles { get; set; }
 
         public static WorkflowTransitionDto FromWorkflowTransition(WorkflowTransition transition)
         {
-            if (transition == null)
-            {
-                return null;
-            }
-
             return new WorkflowTransitionDto { Expression = transition.Expression, Roles = transition.Roles?.ToArray() };
         }
 

backend/tests/Squidex.Domain.Apps.Entities.Tests/Contents/DynamicContentWorkflowTests.cs

@@ -317,7 +317,7 @@ namespace Squidex.Domain.Apps.Entities.Contents
                 new StatusInfo(Status.Draft, StatusColors.Draft)
             };
 
-            var result = await sut.GetNextsAsync(content, null);
+            var result = await sut.GetNextsAsync(content, null!);
 
             result.Should().BeEquivalentTo(expected);
         }

frontend/app/features/settings/pages/workflows/workflow-step.component.html

@@ -45,7 +45,7 @@
         </sqx-workflow-transition>
 
         <div class="row transition no-gutters" *ngIf="openSteps.length > 0 && !disabled">
-            <div class="col-auto">
+            <div class="col col-arrow">
                 <i class="icon-corner-down-right text-decent"></i>
             </div>
             <div class="col col-step">
@@ -62,9 +62,10 @@
             </div>
         </div>
 
-        <div class="row transition-prevent-updates no-guttersw">
+        <div class="row transition-prevent-updates no-gutters">
-            <div class="col col-step" style="max-width: 12rem">
+            <div class="col col-arrow"></div>
-                <div class="form-check">
+            <div class="col col-step">
+                <div class="form-check float-right">
                     <input class="form-check-input transition-prevent-updates-checkbox" type="checkbox" id="preventUpdates_{{step.name}}"
                         [disabled]="disabled"
                         [ngModel]="step.noUpdate"
@@ -90,8 +91,7 @@
                 <div class="col-auto col-label">
                     <span class="text-decent">for</span>
                 </div>
-
+                <div class="col col-roles">
-                <div class="col col-step-role">
                     <sqx-tag-editor [allowDuplicates]="false"
                         [dashed]="true"
                         [disabled]="disabled"
@@ -103,10 +103,8 @@
                         placeholder="Role">
                     </sqx-tag-editor>
                 </div>
+                <div class="col col-button"></div>
             </ng-container>
         </div>
     </div>
-    <div class="col-auto col-div-line">
-        <hr class="col-line"/>
-    </div>
 </div>

frontend/app/features/settings/pages/workflows/workflow-step.component.scss

@@ -16,10 +16,24 @@
         padding: 0 .5rem;
     }
 
+    .col-arrow {
+        min-width: 2rem;
+        max-width: 2rem;
+    }
+
+    .col-button {
+        min-width: 3rem;
+        max-width: 3rem;
+    }
+
     .col-step {
         min-width: 10rem;
         max-width: 10rem;
-        padding-left: .5rem;
+    }
+
+    .col-roles {
+        min-width: 18rem;
+        max-width: 18rem;
     }
 
     .transition {
@@ -40,6 +54,7 @@
 .step {
     & {
         margin-bottom: 1.5rem;
+        border-bottom: 1px solid $color-border;
     }
 
     &-inner {
@@ -74,21 +89,10 @@
     }
 }
 
-.col-step-role {
-    width: 56px;
-    padding-left: 0rem;
-    padding-right: 4rem;
-}
-
-.col-step-expression {
-    padding-left: 0;
-    padding-right: 0
-}
-
 .transition-prevent-updates {
     & {
         margin-top: .25rem;
-        margin-bottom: .5rem;
+        margin-bottom: 1rem;
         line-height: 2.5rem;
     }
 
@@ -99,18 +103,6 @@
     }
 }
 
-.col-line {
-    display: block;
-    height: 1px;
-    border: 0;
-    border-top: 1px solid #e1e4e8;
-    margin: 1em 0;
-}
-
-.col-div-line {
-    padding-top: 0.5rem
-}
-
 .transition-prevent-updates-checkbox {
-    margin-top: 0.8rem;
+    margin-top: .8rem;
 }

frontend/app/features/settings/pages/workflows/workflow-transition.component.html

@@ -1,5 +1,5 @@
 <div class="row transition no-gutters">
-    <div class="col-auto">
+    <div class="col col-arrow">
         <i class="icon-corner-down-right text-decent"></i>
     </div>
     <div class="col col-step">
@@ -21,8 +21,7 @@
     <div class="col-auto col-label">
         <span class="text-decent">for</span>
     </div>
-    
+    <div class="col col-roles">
-    <div class="col" style="width: 70px">
         <sqx-tag-editor
             [allowDuplicates]="false"
             [dashed]="true"
@@ -36,7 +35,7 @@
         </sqx-tag-editor>
     </div>
 
-    <div class="col-auto pl-2">
+    <div class="col col-button pl-2">
         <button type="button" class="btn btn-text-danger" (click)="emitRemove()" [disabled]="disabled">
             <i class="icon-bin2"></i>
         </button>