feat: add reverse border radius to sidebar

adil192 · Jan 28, 2024 · 9896e64 · 9896e64
1 parent 43bc715
commit 9896e64
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 4 deletions.
diff --git a/main.css b/main.css
@@ -139,15 +139,27 @@
   #side-menu {
     background: #1d1b1e !important;
     color: #e8e0e5;
+    padding-right: 0.5rem;
+    margin-right: -0.5rem;
     /* logo header */
     /* footer with links: Privacy, Terms, Accessibility */
   }
+  #side-menu::before {
+    content: "";
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    width: 0.5rem;
+    border-top-left-radius: 0.5rem;
+    border-bottom-left-radius: 0.5rem;
+    background: #fffbff;
+  }
   #side-menu header {
-    background: #1d1b1e !important;
+    background: transparent !important;
     color: #e8e0e5;
     border: none !important;
     box-shadow: none !important;
-    margin-bottom: 2rem;
   }
   #side-menu header a {
     display: block;

diff --git a/screenshots/blackboard_after.png b/screenshots/blackboard_after.png
diff --git a/styles/_online.manchester.ac.uk_ultra.scss b/styles/_online.manchester.ac.uk_ultra.scss
@@ -42,14 +42,27 @@ button.anchor,
 #side-menu {
     background: $header !important;
     color: $on-header;
+    padding-right: 0.5rem;
+    margin-right: -0.5rem;
+
+    &::before {
+        content: "";
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        width: 0.5rem;
+        border-top-left-radius: 0.5rem;
+        border-bottom-left-radius: 0.5rem;
+        background: $background;
+    }
 
     /* logo header */
     header {
-        background: $header !important;
+        background: transparent !important;
         color: $on-header;
         border: none !important;
         box-shadow: none !important;
-        margin-bottom: 2rem;
 
         a {
             display: block;