Decorating the sidenav

front/app/src/app/app.component.css

@@ -0,0 +1,5 @@
+.sidenav {
+    background-image: url("/assets/leather_texture.png");
+    background-size: 220px;
+    max-width: 220px;
+}

front/app/src/app/app.component.html

@@ -3,7 +3,7 @@
 <main style="margin-top: 0px;">
   <div class="container-fluid">
     <div class="row flex-nowrap">
-      <div class="col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark" style="max-width: 200px;">
+      <div class="sidenav col-auto col-md-3 col-xl-2 px-sm-2 px-0 bg-dark">
         <sidenav class="sticky-top"></sidenav>
       </div>
       <div class="col py-3">

front/app/src/app/layout/sidenav/sidenav.component.css

@@ -1,3 +1,3 @@
 .logout {
     margin-top: 25px;
-}
+}

front/app/src/styles.css

@@ -26,3 +26,14 @@
 .contract-body {
     font-family: 'Century Schoolbook';
 }
+
+.nav-link {
+    color: #D2BA6F;
+    --bs-nav-link-hover-color: #9c8a51;
+    --bs-nav-pills-link-active-color: #D2BA6F;
+    --bs-nav-pills-link-active-bg: #114856;
+}
+
+.nav-link.active {
+    border: #D2BA6F solid 2px;
+}