From a76ca019b39d83cba6a2ee8515af43becfb2e4be Mon Sep 17 00:00:00 2001
From: Sebastian <sebastian@squidex.io>
Date: Thu, 14 Nov 2019 19:37:38 +0100
Subject: [PATCH] Layout fixes.

---
 .../rules/pages/rules/rule.component.html     |  4 ++--
 .../shared/components/asset.component.scss    |  2 ++
 .../components/schema-category.component.html | 22 +++++++++++--------
 .../components/schema-category.component.scss |  4 ++--
 frontend/app/theme/_vars.scss                 |  2 +-
 5 files changed, 20 insertions(+), 14 deletions(-)

diff --git a/frontend/app/features/rules/pages/rules/rule.component.html b/frontend/app/features/rules/pages/rules/rule.component.html
index c91bfc84b..38fd856d3 100644
--- a/frontend/app/features/rules/pages/rules/rule.component.html
+++ b/frontend/app/features/rules/pages/rules/rule.component.html
@@ -24,7 +24,7 @@
     </div>
     <div class="card-body">
         <div class="row align-items-center">
-            <div class="col col-auto">
+            <div class="col-auto">
                 <h3>If</h3>
             </div>
             <div class="col">
@@ -32,7 +32,7 @@
                     <sqx-rule-element [type]="rule.triggerType" [element]="ruleTriggers[rule.triggerType]" [disabled]="isManual"></sqx-rule-element>
                 </span>
             </div>
-            <div class="col col-auto">
+            <div class="col-auto">
                 <h3>then</h3>
             </div>
             <div class="col">
diff --git a/frontend/app/shared/components/asset.component.scss b/frontend/app/shared/components/asset.component.scss
index 0aa1b7b3c..9cd1d5483 100644
--- a/frontend/app/shared/components/asset.component.scss
+++ b/frontend/app/shared/components/asset.component.scss
@@ -57,6 +57,8 @@ $list-height: 2.375rem;
     & {
         @include overlay-container;
         width: $asset-width;
+        border-top-width: 1px;
+        border-width: 1px;
     }
 
     &-body,
diff --git a/frontend/app/shared/components/schema-category.component.html b/frontend/app/shared/components/schema-category.component.html
index ba0f0e478..c7639462d 100644
--- a/frontend/app/shared/components/schema-category.component.html
+++ b/frontend/app/shared/components/schema-category.component.html
@@ -5,15 +5,19 @@
     (cdkDropListDropped)="changeCategory($event)">
 
     <div class="header clearfix">
-        <button type="button" class="btn btn-sm btn-text-secondary" (click)="toggle()">
-            <i [class.icon-caret-right]="!snapshot.isOpen" [class.icon-caret-down]="snapshot.isOpen"></i> 
-        </button>
-
-        <h3>{{schemaCategory.name}} ({{snapshot.filtered.length}})</h3>
-        
-        <button type="button" class="btn btn-sm btn-text-secondary float-right" *ngIf="schemaCategory.schemas.length === 0 && !forContent" (click)="emitRemove()">
-            <i class="icon-bin2"></i> 
-        </button>
+        <div class="row no-gutters">
+            <div class="col-auto">
+                <button type="button" class="btn btn-sm btn-text-secondary" (click)="toggle()">
+                    <i [class.icon-caret-right]="!snapshot.isOpen" [class.icon-caret-down]="snapshot.isOpen"></i> 
+                </button>
+            </div>
+            <div class="col">
+                <h3 class="truncate">{{schemaCategory.name}} </h3>
+            </div>
+            <div class="col-auto">
+                ({{snapshot.filtered.length}})
+            </div>
+        </div>        
     </div>
 
     <div class="nav nav-panel nav-dark nav-dark-bordered flex-column" *ngIf="snapshot.isOpen" @fade>
diff --git a/frontend/app/shared/components/schema-category.component.scss b/frontend/app/shared/components/schema-category.component.scss
index c12c16860..2e37fe9ce 100644
--- a/frontend/app/shared/components/schema-category.component.scss
+++ b/frontend/app/shared/components/schema-category.component.scss
@@ -3,8 +3,8 @@
 
 $drag-margin: -8px;
 
-h3 {
-    display: inline-block;
+.col {
+    overflow: hidden;
 }
 
 .btn {
diff --git a/frontend/app/theme/_vars.scss b/frontend/app/theme/_vars.scss
index 0729a8ca9..3a86f9deb 100644
--- a/frontend/app/theme/_vars.scss
+++ b/frontend/app/theme/_vars.scss
@@ -101,7 +101,7 @@ $panel-header:              5.4rem;
 $panel-sidebar:             3.75rem;
 $panel-light-background:    #fff;
 
-$asset-width:               16rem;
+$asset-width:               14.5rem;
 $asset-height:              19rem;
 $asset-header:              12rem;
 $asset-image:               12rem;