added some comments to code

src/app/app.component.css

@@ -11,7 +11,7 @@
     font-size: 1em;
 }
 
-/* show curso position on link */
+/* show cursor position on link */
 .nav a:hover:not(.active) {
     font-size: 1.1em;
   }

src/app/app.component.html

@@ -29,6 +29,7 @@
         </a>
         <ul ngbDropdownMenu>
           <
+          <!-- sidebar background -->
           <li class=" header-title">Sidebar Background</li>
           <li class=" adjustments-line">
             <a class=" switch-trigger background-color" href="javascript:void(0)">
@@ -50,7 +51,8 @@
               <div class=" clearfix"></div>
             </a>
           </li>
-          
+
+          <!-- change dashboard-color for dark-/whitemode -->
           <li class=" adjustments-line text-center color-change">
             <span class=" color-label"> LIGHT MODE </span>
             <span class=" badge light-badge mr-2" (click)="changeDashboardColor('white-content')"> </span>

src/app/app.component.ts

@@ -1,10 +1,15 @@
 import { Component } from '@angular/core';
 
+/*
+ * Interface for sidebar-links
+ */
 declare interface RouteInfo {
   path: string;
   title: string;
   class: string;
 }
+
+/* define routes for sidebar-links */
 export const ROUTES: RouteInfo[] = [
   {
     path: "/dashboard",
@@ -39,6 +44,8 @@ export const ROUTES: RouteInfo[] = [
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css']
 })
+
+  /* function to add and load sidebar */
 export class AppComponent {
   
   menuItems: any[];
@@ -54,6 +61,7 @@ export class AppComponent {
     return true;
   }
 
+  /* function to change sidebar color */
   changeSidebarColor(color){
     var sidebar = document.getElementsByClassName('sidebar')[0];
     var mainPanel = document.getElementsByClassName('main-panel')[0];
@@ -67,7 +75,8 @@ export class AppComponent {
         mainPanel.setAttribute('data',color);
     }
   }
-  
+
+  /* function to change dashboard-color for darkmode and whitemode */
   changeDashboardColor(color){
     var body = document.getElementsByTagName('body')[0];
     if (body && color === 'white-content') {
@@ -77,17 +86,5 @@ export class AppComponent {
       body.classList.remove('white-content');
     }
   }
-  // function that adds color white/transparent to the navbar on resize (this is for the collapse)
-  /*
-   updateColor = () => {
-   var navbar = document.getElementsByClassName('navbar')[0];
-     if (window.innerWidth < 993 && !this.isCollapsed) {
-       navbar.classList.add('bg-white');
-       navbar.classList.remove('navbar-transparent');
-     } else {
-       navbar.classList.remove('bg-white');
-       navbar.classList.add('navbar-transparent');
-     }
-   };
-   */
+ 
 }