From 3d6547001ecf9ae5e923d399dfe2c80b920beecf Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Wed, 21 Nov 2018 04:14:32 +0300
Subject: [PATCH] panels now have shadow-overlay so that it's possible to have
 inset shadow all over the panel, without header overlapping it

---
 src/App.scss | 25 +++++++++++++++++++++----
 1 file changed, 21 insertions(+), 4 deletions(-)

diff --git a/src/App.scss b/src/App.scss
index 970a5f74..30020722 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -317,16 +317,33 @@ main-router {
 
 .panel {
   display: flex;
+  position: relative;
+
   flex-direction: column;
   margin: 0.5em;
 
   background-color: $fallback--bg;
   background-color: var(--bg, $fallback--bg);
 
-  border-radius: $fallback--panelRadius;
-  border-radius: var(--panelRadius, $fallback--panelRadius);
-  box-shadow: 1px 1px 4px rgba(0,0,0,.6);
-  box-shadow: var(--panelShadow);
+  &::after, & {
+    border-radius: $fallback--panelRadius;
+    border-radius: var(--panelRadius, $fallback--panelRadius);
+  }
+
+  &::after {
+    content: '';
+    position: absolute;
+
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+
+    pointer-events: none;
+
+    box-shadow: 1px 1px 4px rgba(0,0,0,.6);
+    box-shadow: var(--panelShadow);
+  }
 }
 
 .panel-body:empty::before {