Fix: Improve accessibility of nav links in dark theme (#8)

Author: plz12345

frontend/src/Components/Page/Sidebar/PageSidebarItem.css

@@ -15,8 +15,7 @@
 
   &:hover,
   &:focus {
-    color: var(--themePurple);
-    text-decoration: none;
+    color: var(--themeLightPurple);
   }
 
 }
@@ -29,16 +28,18 @@
 }
 
 .isActiveLink {
-  color: var(--themePurple);
+  color: var(--themeLightPurple);
+  text-decoration: underline;
+  text-underline-offset: 4px;
 }
 
 .isActiveParentLink {
   background-color: var(--sidebarActiveBackgroundColor);
-    color: var(--white);
+    color: var(--themeLightPurple);
     }
-    
+
     .sectionHeading {
-      color: var(--white);
+      color: var(--themeLightPurple);
 }
 
 .iconContainer {

frontend/src/Styles/Themes/dark.js

@@ -38,6 +38,7 @@ module.exports = {
 
   themePink: whisparrPink,
   themePurple: whisparrPurple,
+  themeLightPurple: '#c084fc',
   themeAlternatePink: '#c4337c',
   themeRed: '#c4273c',
   themeDarkColor: '#494949',