From ff4d2d2f957196d97d2bba86decd21153899e59b Mon Sep 17 00:00:00 2001
From: "konstantina.galouni" <kgalouni@di.uoa.gr>
Date: Tue, 5 Apr 2022 19:55:01 +0300
Subject: [PATCH] [Library & Monitor Dashboard | new-theme]: Small update on
 notifications & filters offcanvas. 1. shadow.css: Added variable
 --shadow-main-dark. 2. offcanvas.css:    a. Set --offcanvas-shadow:
 var(--shadow-main-dark);    b. In class .offcanvas-switcher remove transition
 (will not be visible when offcanvas is open)    c. [Bug fix] In class
 .offcanvas-count increased font size and make background always round, added
 line-height: 20px.    d. In rule ".offcanvas .uk-offcanvas-bar" set
 border-radius to 4px. 3. notification-utils.ts: Full stop added in messages.
 4. notification-sidebar.component.css: In rule "#notifications
 .notification-list ul" set height: calc(100% - 77px). 5.
 notifications-sidebar.component.ts:    a. Removed anything related to
 offcavnas events    b. Removed commented code    c. Added in icons
 visuallyHidden. 6. monitor.component.html:    a. Removed "open" class when
 offcanvas is open.    b. Added in icons visuallyHidden    c. Added sign in
 link in filters when user is not logged in    d. Added uk-text-small class in
 "Clear". 7. monitor.component.ts:    a. Removed anything related to offcavnas
 events    b. Added method "logIn()".

---
 css/structure/offcanvas.css | 22 ++++++----------------
 css/structure/shadow.css    |  1 +
 2 files changed, 7 insertions(+), 16 deletions(-)

diff --git a/css/structure/offcanvas.css b/css/structure/offcanvas.css
index bd242e8..31ca157 100644
--- a/css/structure/offcanvas.css
+++ b/css/structure/offcanvas.css
@@ -1,7 +1,6 @@
 :root {
   --offcanvas-background-color: var(--default-color);
-  /*--offcanvas-shadow: var(--shadow-main);*/
-  --offcanvas-shadow: -15px -15px 20px rgb(255 255 255 / 30%), 15px 15px 20px rgb(0 0 0 / 10%);
+  --offcanvas-shadow: var(--shadow-main-dark);
 }
 
 .offcanvas-switcher {
@@ -14,33 +13,24 @@
   box-sizing: border-box;
   right: 0;
   z-index: 980;
-
   background: var(--offcanvas-background-color);
   border-radius: 6px 0px 0px 6px;
-
-  transition: .3s ease-out;
-  transition-property: right;
-
   box-shadow: var(--offcanvas-shadow);
   clip-path: inset(-30px 0px -30px -30px);
 }
 
-/* Uncomment this if you want to always see the switcher icon */
-/*.offcanvas-switcher.open {*/
-/*  right: 550px;*/
-/*  z-index: 1001;*/
-/*}*/
-
 .offcanvas-switcher .offcanvas-count {
   position: absolute;
   top: 0;
   left: 0;
-  font-size: 10px;
+  font-size: 12px;
+  line-height: 20px;
   -webkit-transform: translate(-50%, -50%);
   transform: translate(-50%, -50%);
   height: 20px;
+  width: 20px;
   border-radius: 50%;
-  padding: 1px 8px;
+  padding: 1px;
   background-color: var(--secondary-color);
   color: var(--light-color);
 }
@@ -49,7 +39,7 @@
 .offcanvas .uk-offcanvas-bar {
   background-color: var(--offcanvas-background-color);
   box-shadow: var(--offcanvas-shadow);
-  border-radius: 8px 0px 0px 8px;
+  border-radius: 4px 0px 0px 4px;
   padding: 0;
   width: 550px;
 }
diff --git a/css/structure/shadow.css b/css/structure/shadow.css
index 6108cbb..7baa132 100644
--- a/css/structure/shadow.css
+++ b/css/structure/shadow.css
@@ -1,5 +1,6 @@
 :root {
   --shadow-main: -15px -15px 20px rgb(255 255 255 / 30%), 15px 15px 20px rgb(0 0 0 / 10%);
+  --shadow-main-dark: -15px -15px 20px rgb(255 255 255 / 5%), 15px 15px 20px rgb(0 0 0 / 30%);
   --shadow-button: -5px -5px 15px rgb(255 255 255 / 5%), 5px 5px 15px rgb(0 0 0 / 30%);
   --shadow-inset: inset -3px -3px 6px rgb(255 255 255 / 90%), inset 3px 3px 6px rgb(0 0 0 / 10%);
   --shadow-nav: 0 3px 6px 0 rgb(0 0 0 / 10%);