1 files changed, 21 insertions, 3 deletions

diff --git a/src/styles/layout.scss b/src/styles/layout.scss
index ecc305193..acbd65ad1 100644
--- a/src/styles/layout.scss
+++ b/src/styles/layout.scss
@@ -17,9 +17,13 @@ html { overflow: hidden; }
 .theme__dark .app {
   .sidebar {
     background: $dark-theme-gray-darker;
-    box-shadow: 0 0 5px 0 $dark-theme-black;
     color: $theme-text-color;
 
+    &::after {
+      box-shadow: inset 0 0 5px 0 $dark-theme-black,
+                  inset 0 0 2px 0 rgba(0, 0, 0, 0.4);
+    }
+
     .sidebar__add-service {
       color: $dark-theme-gray-lighter;
       background: $dark-theme-gray;
@@ -108,9 +112,9 @@ body.win32:not(.isFullScreen) .app .app__content {
 .darwin .sidebar { padding-top: 23px; }
 
 .sidebar {
+  position: relative;
   align-items: center;
   background: $theme-gray-lightest;
-  box-shadow: 1px 0 10px rgba(0, 0, 0, .08);
   color: $theme-text-color;
   display: flex;
   flex-direction: column;
@@ -119,6 +123,20 @@ body.win32:not(.isFullScreen) .app .app__content {
   width: $theme-sidebar-width;
   z-index: 200;
 
+  &::after {
+    content: ' ';
+    position: absolute;
+    top: -10px;
+    right: 0;
+    bottom: -10px;
+    left: -10px;
+    z-index: 1000;
+    pointer-events: none;
+    clip-path: inset(10px 0 10px 10px);
+    box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, .12),
+                inset 0 0 2px 0 rgba(0, 0, 0, 0.24);
+  }
+
   .sidebar__add-service {
     color: $theme-gray-light;
     background: $theme-gray-lighter;
@@ -191,4 +209,4 @@ body.win32:not(.isFullScreen) .app .app__content {
 
 a, button {
   cursor: pointer;
-}
\ No newline at end of file
+}