From 7b6aeb1f98d9882005c44262e2408da639440b42 Mon Sep 17 00:00:00 2001
From: Sebastian Stehle <sebastian@squidex.io>
Date: Fri, 19 Apr 2019 18:41:59 +0200
Subject: [PATCH] Navigate to referenced content.

---
 .../shared/content-item.component.html        | 18 ++++++++++++---
 .../shared/content-item.component.scss        | 22 +++++++++++++++++++
 .../pages/schema/field-wizard.component.html  |  2 +-
 .../pages/schemas/schema-form.component.html  |  4 ++--
 .../pages/backups/backups-page.component.html | 12 +++++-----
 src/Squidex/app/theme/_lists.scss             |  2 +-
 6 files changed, 47 insertions(+), 13 deletions(-)

diff --git a/src/Squidex/app/features/content/shared/content-item.component.html b/src/Squidex/app/features/content/shared/content-item.component.html
index 716014df4..0ae1e664b 100644
--- a/src/Squidex/app/features/content/shared/content-item.component.html
+++ b/src/Squidex/app/features/content/shared/content-item.component.html
@@ -82,7 +82,19 @@
     </div>
 </td>
 <td class="cell-actions" *ngIf="isReference" (click)="shouldStop($event)">
-    <button type="button" class="btn btn-text-secondary" (click)="emitDelete()">
-        <i class="icon-close"></i>
-    </button>
+    <div class="reference-edit">
+        <button type="button" class="btn btn-text-secondary">
+            <i class="icon-dots"></i>
+        </button>
+
+        <div class="reference-menu">
+            <a class="btn btn-text-secondary" [routerLink]="['../..', schema.name, content.id]">
+                <i class="icon-pencil"></i>
+            </a>
+
+            <button type="button" class="btn btn-text-secondary" (click)="emitDelete()">
+                <i class="icon-close"></i>
+            </button>
+        </div>
+    </div>
 </td>
\ No newline at end of file
diff --git a/src/Squidex/app/features/content/shared/content-item.component.scss b/src/Squidex/app/features/content/shared/content-item.component.scss
index fd7bf32b0..12788118e 100644
--- a/src/Squidex/app/features/content/shared/content-item.component.scss
+++ b/src/Squidex/app/features/content/shared/content-item.component.scss
@@ -3,4 +3,26 @@
 
 .truncate {
     @include truncate;
+}
+
+.reference-edit {
+    & {
+        position: relative;
+    }
+
+    &:hover {
+        .reference-menu {
+            display: block;
+        }
+    }
+
+    .reference-menu {
+        @include absolute(0, -.25rem, auto, auto);
+        display: none;
+        padding-left: 2rem;
+        min-height: 2.4rem;
+        max-height: 2.4rem;
+        white-space: nowrap;
+        background: $color-table-background;
+    }
 }
\ No newline at end of file
diff --git a/src/Squidex/app/features/schemas/pages/schema/field-wizard.component.html b/src/Squidex/app/features/schemas/pages/schema/field-wizard.component.html
index cb9048955..4294362ba 100644
--- a/src/Squidex/app/features/schemas/pages/schema/field-wizard.component.html
+++ b/src/Squidex/app/features/schemas/pages/schema/field-wizard.component.html
@@ -26,7 +26,7 @@
                                             <i class="icon-type-{{fieldType.type}}"></i>
                                         </div>
                                     </div>
-                                    <div class="col-lg">
+                                    <div class="col">
                                         <div class="type-title">{{fieldType.type}}</div>
                                         <div class="type-text text-muted">{{fieldType.description}}</div>
                                     </div>
diff --git a/src/Squidex/app/features/schemas/pages/schemas/schema-form.component.html b/src/Squidex/app/features/schemas/pages/schemas/schema-form.component.html
index ffa0401b7..7841396e6 100644
--- a/src/Squidex/app/features/schemas/pages/schemas/schema-form.component.html
+++ b/src/Squidex/app/features/schemas/pages/schemas/schema-form.component.html
@@ -43,7 +43,7 @@
                                         <i class="icon-multiple-content"></i>
                                     </div>
                                 </div>
-                                <div class="col-lg">
+                                <div class="col">
                                     <div class="type-title">Multiple contents</div>
                                     <div class="type-text text-muted">Best for multiple instances like blog posts, pages, authors, products...</div>
                                 </div>
@@ -61,7 +61,7 @@
                                         <i class="icon-single-content"></i>
                                     </div>
                                 </div>
-                                <div class="col-lg">
+                                <div class="col">
                                     <div class="type-title">Single content</div>
                                     <div class="type-text text-muted">Best for single instances like the home page, privacy policies, settings...</div>
                                 </div>
diff --git a/src/Squidex/app/features/settings/pages/backups/backups-page.component.html b/src/Squidex/app/features/settings/pages/backups/backups-page.component.html
index 2254f8730..53d3871db 100644
--- a/src/Squidex/app/features/settings/pages/backups/backups-page.component.html
+++ b/src/Squidex/app/features/settings/pages/backups/backups-page.component.html
@@ -33,16 +33,16 @@
             
             <div class="table-items-row" *ngFor="let backup of backups; trackBy: trackByBackup">
                 <div class="row">
-                    <div class="col-auto">
-                        <div *ngIf="backup.status === 'Started'" class="backup-status backup-status-pending spin">
-                            <i class="icon-hour-glass"></i>
-                        </div>
-                        <div *ngIf="backup.status === 'Failed'" class="backup-status backup-status-failed">
+                    <div class="col-auto" [ngSwitch]="backup.status">
+                        <div *ngSwitchCase="'Failed'" class="backup-status backup-status-failed">
                             <i class="icon-exclamation"></i>
                         </div>
-                        <div *ngIf="backup.status === 'Completed'" class="backup-status backup-status-success">
+                        <div *ngSwitchCase="'Completed'" class="backup-status backup-status-success">
                             <i class="icon-checkmark"></i>
                         </div>
+                        <div *NgSwitchDefault class="backup-status backup-status-pending spin">
+                            <i class="icon-hour-glass"></i>
+                        </div>
                     </div>
                     <div class="col-auto">
                         <div>
diff --git a/src/Squidex/app/theme/_lists.scss b/src/Squidex/app/theme/_lists.scss
index aa14a82f7..160e09b64 100644
--- a/src/Squidex/app/theme/_lists.scss
+++ b/src/Squidex/app/theme/_lists.scss
@@ -208,7 +208,7 @@
     }
 
     &-time {
-        width: 180px;
+        width: 160px;
     }
 
     &-actions {