From 5096d96b31382a8e0ecd2ba9e4821b2e91ff724b Mon Sep 17 00:00:00 2001
From: Sebastian Stehle <sebastian@squidex.io>
Date: Sat, 5 Aug 2017 22:21:35 +0200
Subject: [PATCH] Style improvements.

---
 .../pages/webhook-events-page.component.html  |  4 +++-
 .../pages/webhook-events-page.component.scss  | 22 +++++++++++++++++++
 src/Squidex/app/theme/_lists.scss             |  7 +-----
 src/Squidex/app/theme/_vars.scss              |  2 +-
 4 files changed, 27 insertions(+), 8 deletions(-)

diff --git a/src/Squidex/app/features/webhooks/pages/webhook-events-page.component.html b/src/Squidex/app/features/webhooks/pages/webhook-events-page.component.html
index c14a14686..8b94da74c 100644
--- a/src/Squidex/app/features/webhooks/pages/webhook-events-page.component.html
+++ b/src/Squidex/app/features/webhooks/pages/webhook-events-page.component.html
@@ -70,7 +70,9 @@
                         </tr>
                         <tr *ngIf="selectedEventId === event.id">
                             <td colspan="5">
-                                <h3>Last Request</h3>
+                                <div class="event-header">
+                                    <h3>Last Request</h3>
+                                </div>
                                 
                                 <div class="row event-stats">
                                     <div class="col-3">
diff --git a/src/Squidex/app/features/webhooks/pages/webhook-events-page.component.scss b/src/Squidex/app/features/webhooks/pages/webhook-events-page.component.scss
index 57c1eb533..de5846d30 100644
--- a/src/Squidex/app/features/webhooks/pages/webhook-events-page.component.scss
+++ b/src/Squidex/app/features/webhooks/pages/webhook-events-page.component.scss
@@ -48,4 +48,26 @@ h3 {
         font-weight: normal;
         height: 20rem;
     }
+
+    &-header {
+        & {
+            padding: 1rem 1.25rem;
+            position: relative;
+            background: $color-border;
+            border: 0;
+            margin: -1.25rem;
+            margin-bottom: 1rem;
+        }
+
+        &::before {
+            @include caret-top;
+            @include absolute(-.5rem, 1.9rem, auto, auto);
+            border-color: transparent transparent $color-border;
+            border-width: .6rem;
+        }
+
+        h3 {
+            margin: 0;
+        }
+    }
 }
\ No newline at end of file
diff --git a/src/Squidex/app/theme/_lists.scss b/src/Squidex/app/theme/_lists.scss
index 6626e490d..a12751fee 100644
--- a/src/Squidex/app/theme/_lists.scss
+++ b/src/Squidex/app/theme/_lists.scss
@@ -63,11 +63,6 @@
                 margin-bottom: .5rem;
             }
 
-            // Transitioned hover effect.
-            &:hover {
-                background: darken($color-table, 2%);
-            }
-
             &:focus {
                 outline: none;
             }
@@ -127,7 +122,7 @@
             // Caret that is placed next to the expand button.
             &::before {
                 @include caret-top;
-                @include absolute(-.5rem, 5.5rem, auto, auto);
+                @include absolute(-.5rem, 5.7rem, auto, auto);
                 border-color: transparent transparent $color-border;
                 border-width: .6rem;
             }
diff --git a/src/Squidex/app/theme/_vars.scss b/src/Squidex/app/theme/_vars.scss
index db9cc7b75..95d55e4a5 100644
--- a/src/Squidex/app/theme/_vars.scss
+++ b/src/Squidex/app/theme/_vars.scss
@@ -57,7 +57,7 @@ $color-panel-icon: #a2b0b6;
 
 $color-table: #fff;
 $color-table-footer: #ecf2f6;
-$color-table-border: #e9ecef;
+$color-table-border: $color-border;
 $color-table-header: $color-text-decent;
 
 $color-modal-header-background: #2e3842;