Re-styled side bar link colors.

Author: johnpinto1

src/themes/datashare/app/admin/admin-sidebar/admin-sidebar.component.html

@@ -14,9 +14,9 @@
 
   <div class="sidebar-full-width-container" id="sidebar-header-container" aria-hidden="true">
     <div class="sidebar-section-wrapper">
-      <div class="sidebar-fixed-element-wrapper">
+      <!-- <div class="sidebar-fixed-element-wrapper">
         <img id="admin-sidebar-logo" src="/assets/datashare/images/DataShare-logo-reverse.svg" [alt]="('menu.header.image.logo') | translate" aria-hidden="true">
-      </div>
+      </div> -->
       <div class="sidebar-collapsible-element-outer-wrapper">
         <div class="sidebar-collapsible-element-inner-wrapper sidebar-item">
           <h4 class="my-1">{{ 'menu.header.admin' | translate }}</h4>

src/themes/datashare/app/admin/admin-sidebar/admin-sidebar.component.scss

@@ -1,3 +1,52 @@
-img#admin-sidebar-logo {
-    height: var(--datashare-admin-sidebar-logo-height) !important;
+// img#admin-sidebar-logo {
+//     height: var(--datashare-admin-sidebar-logo-height) !important;
+// }
+
+:host ::ng-deep {
+    color: #FFFFFF;
+    /* White text color for sidebar */
+
+    img#admin-sidebar-logo {
+        height: var(--datashare-admin-sidebar-logo-height) !important;
+    }
+
+    a {
+        color: #FFFFFF !important;
+        /* White */
+        text-decoration: none !important;
+        /* Optional, removes underline */
+
+        &:focus {
+            // outline-color: #FFFF00;
+            // outline-style: solid;
+            // outline-width: medium;
+            outline: 2px solid #ADD8E6 !important; /* Light Blue outline on focus */
+            outline-offset: 2px;
+            /* Optional, adds space between outline and element */
+        }
+
+        &:hover {
+            color: #ADD8E6 !important;
+            /* Light Blue on hover */
+            text-decoration: underline;
+            /* Optional, adds underline on hover */
+        }
+
+        &.active {
+            font-weight: bold;
+            /* Bold for active link */
+            color: #FFFFFF !important;
+            /* White for active link */
+        }
+
+        &.disabled {
+            color: #777777;
+            /* Gray for disabled link */
+            pointer-events: none;
+            /* Disable click events */
+            cursor: default;
+            /* Default cursor */
+        }
+
+    }
 }