Merge remote-tracking branch 'origin/master'

README.md

@@ -1,5 +1,7 @@
 This is [vault48.org](https://vault48.org) frontend.
 
+[![Build Status](https://jenkins.vault48.org/api/badges/muerwre/vault-frontend/status.svg)](https://vault48.org/)
+
 ### Installation
 1. Clone this repo `git clone git@github.com:muerwre/vault-frontend.git`
 2. Run `yarn install`

src/containers/sidebars/SidebarWrapper/styles.module.scss

@@ -13,7 +13,6 @@
   left: 0;
   width: 100%;
   height: 100%;
-  background: rgba(255, 0, 0, 0.3);
   display: flex;
   flex-direction: row;
   z-index: 26;
@@ -21,11 +20,7 @@
   overflow: hidden;
   animation: appear 0.25s forwards;
 
-  @include can_backdrop {
-    background: transparentize($content_bg, 0.15);
-    -webkit-backdrop-filter: blur(15px);
-    backdrop-filter: blur(15px);
-  }
+  @include sidebar
 }
 
 .content {

src/containers/sidebars/TagSidebar/styles.module.scss

@@ -5,14 +5,12 @@
   flex: 0 1 400px;
   max-width: 100vw;
   position: relative;
-  padding: 10px;
+
+  @include sidebar_content;
 }
 
 .content {
-  @include outer_shadow;
-
   border-radius: $radius;
-  background: $content_bg;
   height: 100%;
   box-sizing: border-box;
   overflow: auto;
@@ -28,7 +26,7 @@
   align-items: center;
   justify-content: center;
   padding: $gap;
-  background: lighten($content_bg, 2%);
+  box-shadow: transparentize(white, 0.95) 0 1px;
 }
 
 .tag {

src/styles/variables.scss

@@ -185,3 +185,18 @@ $login_dialog_padding: $gap $gap 30px $gap;
   -webkit-box-orient: vertical;
   text-overflow: ellipsis;
 }
+
+@mixin sidebar {
+  background: transparentize($content_bg, 0.15);
+
+  @include can_backdrop {
+    background: transparentize($content_bg, 0.3);
+    -webkit-backdrop-filter: blur(15px);
+    backdrop-filter: blur(15px);
+  }
+}
+
+@mixin sidebar_content {
+  background: transparentize($content_bg, 0.4);
+  box-shadow: transparentize(white, 0.95) -1px 0;
+}