workflow fix.

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

@@ -1,5 +1,10 @@
 <div class="step">
-    <div class="row no-gutters">
+    <div class="row no-gutters step-header">
+        <div class="col-auto">
+            <button class="btn btn-initial mr-1" (click)="makeInitial.emit()" [disabled]="step.name === workflow.initial || step.isLocked">
+                <i class="icon-arrow-right text-decent" *ngIf="!step.isLocked"></i>
+            </button>
+        </div>
         <div class="col-auto color pr-2">
             <sqx-color-picker mode="Circle"
                 [ngModelOptions]="onBlur"
@@ -15,6 +20,8 @@
                 [disabled]="step.isLocked">
             </sqx-editable-title>
         </div>
+        <div class="col">
+        </div>
         <div class="col-auto" *ngIf="step.isLocked">
             <small class="text-decent">(Cannot be removed)</small>
         </div>
@@ -35,7 +42,7 @@
             
         <div class="row transition no-gutters" *ngIf="openSteps.length > 0">
             <div class="col-auto">
-                <i class="icon-arrow-right text-decent"></i>
+                <i class="icon-corner-down-right text-decent"></i>
             </div>
             <div class="col col-step">
                 <sqx-dropdown [items]="openSteps" [(ngModel)]="openStep">

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

@@ -44,6 +44,30 @@
     }
 
     &-inner {
-        padding-left: 1rem;
+        padding-left: 2rem;
+    }
+
+    &-header {
+        &:hover {
+            .btn-initial {
+                visibility: visible;
+            }
+        }
+    }
+}
+
+.btn-initial {
+    & {
+        visibility: hidden;
+        line-height: 1.6rem;
+        padding-left: 0;
+        padding-right: 0;
+        width: 2rem;
+        text-align: center;
+    }
+
+    &:disabled {
+        @include opacity(1);
+        visibility: visible;
     }
 }

src/Squidex/app/features/settings/pages/workflows/workflow-step.component.ts

@@ -32,6 +32,9 @@ export class WorkflowStepComponent implements OnChanges {
     @Input()
     public roles: RoleDto[];
 
+    @Output()
+    public makeInitial = new EventEmitter();
+
     @Output()
     public transitionAdd = new EventEmitter<WorkflowStep>();
 

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

@@ -1,6 +1,6 @@
 <div class="row transition no-gutters">
     <div class="col-auto">
-        <i class="icon-arrow-right text-decent"></i>
+        <i class="icon-corner-down-right text-decent"></i>
     </div>
     <div class="col col-step">
         <div class="transition-to">

src/Squidex/app/features/settings/pages/workflows/workflows-page.component.html

@@ -25,6 +25,7 @@
                 [workflow]="workflow"
                 [step]="step"
                 [roles]="roles"
+                (makeInitial)="setInitial(step)"
                 (rename)="renameStep(step, $event)"
                 (remove)="removeStep(step)"
                 (transitionAdd)="addTransiton(step, $event)"

src/Squidex/app/features/settings/pages/workflows/workflows-page.component.ts

@@ -61,6 +61,10 @@ export class WorkflowsPageComponent implements OnInit {
         this.maxSteps++;
     }
 
+    public setInitial(step: WorkflowStep) {
+        this.workflow = this.workflow.setInitial(step.name);
+    }
+
     public addTransiton(from: WorkflowStep, to: WorkflowStep) {
         this.workflow = this.workflow.setTransition(from.name, to.name, {});
     }

src/Squidex/app/shared/services/workflows.service.ts

@@ -17,7 +17,8 @@ export class WorkflowDto extends Model<WorkflowDto> {
     constructor(links: ResourceLinks = {},
         public readonly name: string = 'Default',
         public readonly steps: WorkflowStep[] = [],
-        public readonly transitions: WorkflowTransition[] = []
+        public readonly transitions: WorkflowTransition[] = [],
+        public readonly initial?: string
     ) {
         super();
 
@@ -52,12 +53,28 @@ export class WorkflowDto extends Model<WorkflowDto> {
                 return this;
             }
 
-            values = { ...values, ...existing };
+            values = { ...existing,  ...values };
         }
 
         const steps = [...this.steps.filter(s => s !== found), { name, ...values }];
 
-        return this.with({ steps });
+        let initial = this.initial;
+
+        if (steps.length === 1) {
+            initial = steps[0].name;
+        }
+
+        return this.with({ steps, initial });
+    }
+
+    public setInitial(initial: string) {
+        const found = this.getStep(initial);
+
+        if (!found || initial === 'Published') {
+            return this;
+        }
+
+        return this.with({ initial });
     }
 
     public removeStep(name: string) {

src/Squidex/app/theme/icomoon/demo.html

@@ -9,11 +9,238 @@
     <link rel="stylesheet" href="style.css"></head>
 <body>
     <div class="bgc1 clearfix">
-        <h1 class="mhmm mvm"><span class="fgc1">Font Name:</span> icomoon <small class="fgc1">(Glyphs:&nbsp;122)</small></h1>
+        <h1 class="mhmm mvm"><span class="fgc1">Font Name:</span> icomoon <small class="fgc1">(Glyphs:&nbsp;123)</small></h1>
     </div>
     <div class="clearfix mhl ptl">
-        <h1 class="mvm mtn fgc1">Grid Size: Unknown</h1>
+        <h1 class="mvm mtn fgc1">Grid Size: 24</h1>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-corner-down-right">
+                
+                </span>
+                <span class="mls"> icon-corner-down-right</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e977" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe977;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-info-outline">
+                
+                </span>
+                <span class="mls"> icon-info-outline</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e974" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe974;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-upload-2">
+                
+                </span>
+                <span class="mls"> icon-upload-2</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e972" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe972;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-translate">
+                
+                </span>
+                <span class="mls"> icon-translate</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e96f" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe96f;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-arrow_back">
+                
+                </span>
+                <span class="mls"> icon-arrow_back</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e96e" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe96e;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-external-link">
+                
+                </span>
+                <span class="mls"> icon-external-link</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e96d" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe96d;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-minus-square">
+                
+                </span>
+                <span class="mls"> icon-minus-square</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e969" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe969;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-plus-square">
+                
+                </span>
+                <span class="mls"> icon-plus-square</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e968" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe968;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-drag2">
+                
+                </span>
+                <span class="mls"> icon-drag2</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e961" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe961;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-comments">
+                
+                </span>
+                <span class="mls"> icon-comments</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e95f" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe95f;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-backup">
+                
+                </span>
+                <span class="mls"> icon-backup</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e95b" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe95b;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-support">
+                
+                </span>
+                <span class="mls"> icon-support</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e95a" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe95a;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
+        <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-control-RichText">
+                
+                </span>
+                <span class="mls"> icon-control-RichText</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e939" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe939;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
         <div class="glyph fs1">
+            <div class="clearfix bshadow0 pbs">
+                <span class="icon-download">
+                
+                </span>
+                <span class="mls"> icon-download</span>
+            </div>
+            <fieldset class="fs0 size1of1 clearfix hidden-false">
+                <input type="text" readonly value="e93e" class="unit size1of2" />
+                <input type="text" maxlength="1" readonly value="&#xe93e;" class="unitRight size1of2 talign-right" />
+            </fieldset>
+            <div class="fs0 bshadow0 clearfix hidden-true">
+                <span class="unit pvs fgc1">liga: </span>
+                <input type="text" readonly value="" class="liga unitRight" />
+            </div>
+        </div>
+    </div>
+    <div class="clearfix mhl ptl">
+        <h1 class="mvm mtn fgc1">Grid Size: Unknown</h1>
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-type-UI">
                 
@@ -29,7 +256,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-prerender">
                 
@@ -45,7 +272,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-circle">
                 
@@ -61,7 +288,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-control-Slug">
                 
@@ -77,7 +304,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-type-Tags">
                 
@@ -93,7 +320,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-activity">
                 
@@ -109,7 +336,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-history">
                 
@@ -125,7 +352,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-time">
                 
@@ -141,7 +368,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-add">
                 
@@ -157,7 +384,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-plus">
                 
@@ -173,7 +400,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-check-circle">
                 
@@ -189,7 +416,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-check-circle-filled">
                 
@@ -205,7 +432,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-close">
                 
@@ -221,7 +448,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-type-References">
                 
@@ -237,7 +464,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-control-Checkbox">
                 
@@ -253,7 +480,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-control-Dropdown">
                 
@@ -269,7 +496,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-control-Input">
                 
@@ -285,7 +512,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-control-Radio">
                 
@@ -301,7 +528,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-control-TextArea">
                 
@@ -317,7 +544,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-control-Toggle">
                 
@@ -333,7 +560,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-copy">
                 
@@ -349,7 +576,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-dashboard">
                 
@@ -365,7 +592,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-delete">
                 
@@ -381,7 +608,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-bin">
                 
@@ -397,7 +624,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-delete-filled">
                 
@@ -413,7 +640,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-document-delete">
                 
@@ -429,7 +656,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-document-disable">
                 
@@ -445,7 +672,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-document-publish">
                 
@@ -461,7 +688,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-drag">
                 
@@ -477,7 +704,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-filter">
                 
@@ -493,7 +720,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-github">
                 
@@ -509,7 +736,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-help">
                 
@@ -525,7 +752,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-location">
                 
@@ -541,7 +768,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-control-Map">
                 
@@ -557,7 +784,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-type-Geolocation">
                 
@@ -573,7 +800,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-logo">
                 
@@ -589,7 +816,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-media">
                 
@@ -605,7 +832,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-type-Assets">
                 
@@ -621,7 +848,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-trigger-AssetChanged">
                 
@@ -637,7 +864,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-more">
                 
@@ -653,7 +880,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-dots">
                 
@@ -669,7 +896,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-pencil">
                 
@@ -685,7 +912,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-reference">
                 
@@ -701,7 +928,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-schemas">
                 
@@ -717,7 +944,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-search">
                 
@@ -733,7 +960,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-settings">
                 
@@ -749,7 +976,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-type-Boolean">
                 
@@ -765,7 +992,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-type-DateTime">
                 
@@ -781,7 +1008,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-type-Json">
                 
@@ -797,7 +1024,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-json">
                 
@@ -813,7 +1040,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-type-Number">
                 
@@ -829,7 +1056,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-type-String">
                 
@@ -845,7 +1072,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-user">
                 
@@ -861,7 +1088,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-upload-3">
                 
@@ -877,7 +1104,7 @@
                 <input type="text" readonly value="" class="liga unitRight" />
             </div>
         </div>
-        <div class="glyph fs1">
+        <div class="glyph fs2">
             <div class="clearfix bshadow0 pbs">
                 <span class="icon-upload-4">
                 
@@ -894,217 +1121,6 @@
             </div>
         </div>
     </div>
-    <div class="clearfix mhl ptl">
-        <h1 class="mvm mtn fgc1">Grid Size: 24</h1>
-        <div class="glyph fs2">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-info-outline">
-                
-                </span>
-                <span class="mls"> icon-info-outline</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e974" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe974;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs2">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-upload-2">
-                
-                </span>
-                <span class="mls"> icon-upload-2</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e972" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe972;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs2">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-translate">
-                
-                </span>
-                <span class="mls"> icon-translate</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e96f" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe96f;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs2">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-arrow_back">
-                
-                </span>
-                <span class="mls"> icon-arrow_back</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e96e" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe96e;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs2">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-external-link">
-                
-                </span>
-                <span class="mls"> icon-external-link</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e96d" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe96d;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs2">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-minus-square">
-                
-                </span>
-                <span class="mls"> icon-minus-square</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e969" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe969;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs2">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-plus-square">
-                
-                </span>
-                <span class="mls"> icon-plus-square</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e968" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe968;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs2">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-drag2">
-                
-                </span>
-                <span class="mls"> icon-drag2</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e961" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe961;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs2">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-comments">
-                
-                </span>
-                <span class="mls"> icon-comments</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e95f" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe95f;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs2">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-backup">
-                
-                </span>
-                <span class="mls"> icon-backup</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e95b" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe95b;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs2">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-support">
-                
-                </span>
-                <span class="mls"> icon-support</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e95a" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe95a;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs2">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-control-RichText">
-                
-                </span>
-                <span class="mls"> icon-control-RichText</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e939" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe939;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-        <div class="glyph fs2">
-            <div class="clearfix bshadow0 pbs">
-                <span class="icon-download">
-                
-                </span>
-                <span class="mls"> icon-download</span>
-            </div>
-            <fieldset class="fs0 size1of1 clearfix hidden-false">
-                <input type="text" readonly value="e93e" class="unit size1of2" />
-                <input type="text" maxlength="1" readonly value="&#xe93e;" class="unitRight size1of2 talign-right" />
-            </fieldset>
-            <div class="fs0 bshadow0 clearfix hidden-true">
-                <span class="unit pvs fgc1">liga: </span>
-                <input type="text" readonly value="" class="liga unitRight" />
-            </div>
-        </div>
-    </div>
     <div class="clearfix mhl ptl">
         <h1 class="mvm mtn fgc1">Grid Size: 16</h1>
         <div class="glyph fs3">

src/Squidex/app/theme/icomoon/fonts/icomoon.svg

@@ -126,6 +126,7 @@
 <glyph unicode="&#xe974;" glyph-name="info-outline" d="M470 554.667v86h84v-86h-84zM512 84.667c188 0 342 154 342 342s-154 342-342 342-342-154-342-342 154-342 342-342zM512 852.667c236 0 426-190 426-426s-190-426-426-426-426 190-426 426 190 426 426 426zM470 212.667v256h84v-256h-84z" />
 <glyph unicode="&#xe975;" glyph-name="type-UI" d="M512 256h-341.333c-5.845 0-11.349 1.152-16.299 3.2-5.205 2.133-9.899 5.333-13.867 9.301s-7.125 8.661-9.301 13.867c-2.048 4.949-3.2 10.453-3.2 16.299v426.667c0 5.845 1.152 11.349 3.2 16.299 2.133 5.205 5.333 9.899 9.301 13.867s8.661 7.125 13.867 9.301c4.949 2.048 10.453 3.2 16.299 3.2h682.667c5.845 0 11.349-1.152 16.299-3.2 5.205-2.133 9.899-5.333 13.867-9.301s7.125-8.661 9.301-13.867c2.048-4.949 3.2-10.453 3.2-16.299v-426.667c0-5.845-1.152-11.349-3.2-16.299-2.133-5.205-5.333-9.899-9.301-13.867s-8.661-7.125-13.867-9.301c-4.949-2.048-10.453-3.2-16.299-3.2zM469.333 170.667v-85.333h-128c-23.552 0-42.667-19.115-42.667-42.667s19.115-42.667 42.667-42.667h341.333c23.552 0 42.667 19.115 42.667 42.667s-19.115 42.667-42.667 42.667h-128v85.333h298.667c17.28 0 33.835 3.456 48.981 9.728 15.701 6.485 29.781 16 41.557 27.776s21.291 25.856 27.776 41.557c6.229 15.104 9.685 31.659 9.685 48.939v426.667c0 17.28-3.456 33.835-9.728 48.981-6.485 15.701-16 29.781-27.776 41.557s-25.856 21.291-41.557 27.776c-15.104 6.229-31.659 9.685-48.939 9.685h-682.667c-17.28 0-33.835-3.456-48.981-9.728-15.659-6.485-29.739-16-41.515-27.776s-21.291-25.856-27.776-41.515c-6.272-15.147-9.728-31.701-9.728-48.981v-426.667c0-17.28 3.456-33.835 9.728-48.981 6.485-15.701 16-29.781 27.776-41.557s25.856-21.291 41.557-27.776c15.104-6.229 31.659-9.685 48.939-9.685z" />
 <glyph unicode="&#xe976;" glyph-name="arrow-right" d="M621.254 82.746l320 320c24.994 24.992 24.994 65.516 0 90.51l-320 320c-24.994 24.992-65.516 24.992-90.51 0-24.994-24.994-24.994-65.516 0-90.51l210.746-210.746h-613.49c-35.346 0-64-28.654-64-64s28.654-64 64-64h613.49l-210.746-210.746c-12.496-12.496-18.744-28.876-18.744-45.254s6.248-32.758 18.744-45.254c24.994-24.994 65.516-24.994 90.51 0z" />
+<glyph unicode="&#xe977;" glyph-name="corner-down-right" d="M128 768v-298.667c0-58.88 23.936-112.299 62.464-150.869s91.989-62.464 150.869-62.464h409.003l-140.501-140.501c-16.683-16.683-16.683-43.691 0-60.331s43.691-16.683 60.331 0l213.333 213.333c3.925 3.925 7.083 8.619 9.259 13.824s3.243 10.795 3.243 16.341c0 10.923-4.181 21.845-12.501 30.165l-213.333 213.333c-16.683 16.683-43.691 16.683-60.331 0s-16.683-43.691 0-60.331l140.501-140.501h-409.003c-35.371 0-67.285 14.293-90.496 37.504s-37.504 55.125-37.504 90.496v298.667c0 23.552-19.115 42.667-42.667 42.667s-42.667-19.115-42.667-42.667z" />
 <glyph unicode="&#xe9ca;" glyph-name="earth" d="M512 960c-282.77 0-512-229.23-512-512s229.23-512 512-512 512 229.23 512 512-229.23 512-512 512zM512-0.002c-62.958 0-122.872 13.012-177.23 36.452l233.148 262.29c5.206 5.858 8.082 13.422 8.082 21.26v96c0 17.674-14.326 32-32 32-112.99 0-232.204 117.462-233.374 118.626-6 6.002-14.14 9.374-22.626 9.374h-128c-17.672 0-32-14.328-32-32v-192c0-12.122 6.848-23.202 17.69-28.622l110.31-55.156v-187.886c-116.052 80.956-192 215.432-192 367.664 0 68.714 15.49 133.806 43.138 192h116.862c8.488 0 16.626 3.372 22.628 9.372l128 128c6 6.002 9.372 14.14 9.372 22.628v77.412c40.562 12.074 83.518 18.588 128 18.588 70.406 0 137.004-16.26 196.282-45.2-4.144-3.502-8.176-7.164-12.046-11.036-36.266-36.264-56.236-84.478-56.236-135.764s19.97-99.5 56.236-135.764c36.434-36.432 85.218-56.264 135.634-56.26 3.166 0 6.342 0.080 9.518 0.236 13.814-51.802 38.752-186.656-8.404-372.334-0.444-1.744-0.696-3.488-0.842-5.224-81.324-83.080-194.7-134.656-320.142-134.656z" />
 <glyph unicode="&#xf00a;" glyph-name="grid" d="M292.571 237.714v-109.714c0-30.286-24.571-54.857-54.857-54.857h-182.857c-30.286 0-54.857 24.571-54.857 54.857v109.714c0 30.286 24.571 54.857 54.857 54.857h182.857c30.286 0 54.857-24.571 54.857-54.857zM292.571 530.286v-109.714c0-30.286-24.571-54.857-54.857-54.857h-182.857c-30.286 0-54.857 24.571-54.857 54.857v109.714c0 30.286 24.571 54.857 54.857 54.857h182.857c30.286 0 54.857-24.571 54.857-54.857zM658.286 237.714v-109.714c0-30.286-24.571-54.857-54.857-54.857h-182.857c-30.286 0-54.857 24.571-54.857 54.857v109.714c0 30.286 24.571 54.857 54.857 54.857h182.857c30.286 0 54.857-24.571 54.857-54.857zM292.571 822.857v-109.714c0-30.286-24.571-54.857-54.857-54.857h-182.857c-30.286 0-54.857 24.571-54.857 54.857v109.714c0 30.286 24.571 54.857 54.857 54.857h182.857c30.286 0 54.857-24.571 54.857-54.857zM658.286 530.286v-109.714c0-30.286-24.571-54.857-54.857-54.857h-182.857c-30.286 0-54.857 24.571-54.857 54.857v109.714c0 30.286 24.571 54.857 54.857 54.857h182.857c30.286 0 54.857-24.571 54.857-54.857zM1024 237.714v-109.714c0-30.286-24.571-54.857-54.857-54.857h-182.857c-30.286 0-54.857 24.571-54.857 54.857v109.714c0 30.286 24.571 54.857 54.857 54.857h182.857c30.286 0 54.857-24.571 54.857-54.857zM658.286 822.857v-109.714c0-30.286-24.571-54.857-54.857-54.857h-182.857c-30.286 0-54.857 24.571-54.857 54.857v109.714c0 30.286 24.571 54.857 54.857 54.857h182.857c30.286 0 54.857-24.571 54.857-54.857zM1024 530.286v-109.714c0-30.286-24.571-54.857-54.857-54.857h-182.857c-30.286 0-54.857 24.571-54.857 54.857v109.714c0 30.286 24.571 54.857 54.857 54.857h182.857c30.286 0 54.857-24.571 54.857-54.857zM1024 822.857v-109.714c0-30.286-24.571-54.857-54.857-54.857h-182.857c-30.286 0-54.857 24.571-54.857 54.857v109.714c0 30.286 24.571 54.857 54.857 54.857h182.857c30.286 0 54.857-24.571 54.857-54.857z" />
 <glyph unicode="&#xf0c9;" glyph-name="list1" horiz-adv-x="878" d="M877.714 182.857v-73.143c0-20-16.571-36.571-36.571-36.571h-804.571c-20 0-36.571 16.571-36.571 36.571v73.143c0 20 16.571 36.571 36.571 36.571h804.571c20 0 36.571-16.571 36.571-36.571zM877.714 475.428v-73.143c0-20-16.571-36.571-36.571-36.571h-804.571c-20 0-36.571 16.571-36.571 36.571v73.143c0 20 16.571 36.571 36.571 36.571h804.571c20 0 36.571-16.571 36.571-36.571zM877.714 768v-73.143c0-20-16.571-36.571-36.571-36.571h-804.571c-20 0-36.571 16.571-36.571 36.571v73.143c0 20 16.571 36.571 36.571 36.571h804.571c20 0 36.571-16.571 36.571-36.571z" />

src/Squidex/app/theme/icomoon/style.css

@@ -1,10 +1,10 @@
 @font-face {
   font-family: 'icomoon';
-  src:  url('fonts/icomoon.eot?h3wogz');
-  src:  url('fonts/icomoon.eot?h3wogz#iefix') format('embedded-opentype'),
-    url('fonts/icomoon.ttf?h3wogz') format('truetype'),
-    url('fonts/icomoon.woff?h3wogz') format('woff'),
-    url('fonts/icomoon.svg?h3wogz#icomoon') format('svg');
+  src:  url('fonts/icomoon.eot?vuepjz');
+  src:  url('fonts/icomoon.eot?vuepjz#iefix') format('embedded-opentype'),
+    url('fonts/icomoon.ttf?vuepjz') format('truetype'),
+    url('fonts/icomoon.woff?vuepjz') format('woff'),
+    url('fonts/icomoon.svg?vuepjz#icomoon') format('svg');
   font-weight: normal;
   font-style: normal;
 }
@@ -24,6 +24,48 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-corner-down-right:before {
+  content: "\e977";
+}
+.icon-info-outline:before {
+  content: "\e974";
+}
+.icon-upload-2:before {
+  content: "\e972";
+}
+.icon-translate:before {
+  content: "\e96f";
+}
+.icon-arrow_back:before {
+  content: "\e96e";
+}
+.icon-external-link:before {
+  content: "\e96d";
+}
+.icon-minus-square:before {
+  content: "\e969";
+}
+.icon-plus-square:before {
+  content: "\e968";
+}
+.icon-drag2:before {
+  content: "\e961";
+}
+.icon-comments:before {
+  content: "\e95f";
+}
+.icon-backup:before {
+  content: "\e95b";
+}
+.icon-support:before {
+  content: "\e95a";
+}
+.icon-control-RichText:before {
+  content: "\e939";
+}
+.icon-download:before {
+  content: "\e93e";
+}
 .icon-type-UI:before {
   content: "\e975";
 }
@@ -189,45 +231,6 @@
 .icon-upload-4:before {
   content: "\e971";
 }
-.icon-info-outline:before {
-  content: "\e974";
-}
-.icon-upload-2:before {
-  content: "\e972";
-}
-.icon-translate:before {
-  content: "\e96f";
-}
-.icon-arrow_back:before {
-  content: "\e96e";
-}
-.icon-external-link:before {
-  content: "\e96d";
-}
-.icon-minus-square:before {
-  content: "\e969";
-}
-.icon-plus-square:before {
-  content: "\e968";
-}
-.icon-drag2:before {
-  content: "\e961";
-}
-.icon-comments:before {
-  content: "\e95f";
-}
-.icon-backup:before {
-  content: "\e95b";
-}
-.icon-support:before {
-  content: "\e95a";
-}
-.icon-control-RichText:before {
-  content: "\e939";
-}
-.icon-download:before {
-  content: "\e93e";
-}
 .icon-arrow-right:before {
   content: "\e976";
 }