[Monitor Dashboard | Trunk]: Add toggle options on all levels. Change main.css for width of sidebar in medium screens

git-svn-id: https://svn.driver.research-infrastructures.eu/driver/dnet40/modules/uoa-monitor-portal/trunk/monitor_dashboard@57927 d315682c-612b-4755-9ff5-7f18f6832af3

src/app/stakeholder/stakeholder.component.html

@@ -38,12 +38,12 @@
                        class="uk-padding-remove-horizontal">
                     <ul class="uk-nav uk-dropdown-nav">
                       <li><a (click)="editTopicOpen(i)">Edit</a></li>
-                      <!--<li><a (click)="toggleIndicatorStatus(indicator)">
+                      <li><a (click)="toggleTopicStatus(topic)">
-                        {{indicator.isActive ? 'Deactivate' : 'Activate'}}</a>
+                        {{topic.isActive ? 'Deactivate' : 'Activate'}}</a>
+                      </li>
+                      <li><a (click)="toggleTopicAccess(topic)">
+                          {{topic.isPublic?'Unpublish':'Publish'}}</a>
                       </li>
-                      <li><a (click)="toggleIndicatorAccess(indicator)">
-                          {{indicator.isPublic?'Unpublish':'Publish'}}</a>
-                      </li>-->
                       <hr class="uk-nav-divider">
                       <li><a (click)="deleteTopicOpen(i)">Delete</a></li>
                     </ul>

src/app/stakeholder/stakeholder.component.ts

@@ -5,7 +5,7 @@ import {EnvProperties} from '../openaireLibrary/utils/properties/env-properties'
 
 import {ErrorCodes} from '../openaireLibrary/utils/properties/errorCodes';
 import {ErrorMessagesComponent} from '../openaireLibrary/utils/errorMessages.component';
-import {Stakeholder, Topic} from "../utils/entities/stakeholder";
+import {Indicator, Stakeholder, Topic} from "../utils/entities/stakeholder";
 import {StakeholderService} from "../services/stakeholder.service";
 import {HelperFunctions} from "../openaireLibrary/utils/HelperFunctions.class";
 import {AlertModal} from "../openaireLibrary/utils/modal/alert";
@@ -189,4 +189,48 @@ export class StakeholderComponent implements OnInit, OnDestroy {
       });
     });
   }
+  
+  toggleTopicStatus(topic: Topic) {
+    let path = [
+      this.stakeholder._id,
+      topic._id
+    ];
+    this.stakeholderService.toggleStatus(this.properties.monitorServiceAPIURL, path).subscribe(isActive => {
+      topic.isActive = isActive;
+      this.stakeholderService.setStakeholder(this.stakeholder);
+      UIkit.notification('Topic has been successfully ' + (isActive?'activated':'deactivated'), {
+        status: 'success',
+        timeout: 3000,
+        pos: 'top-left'
+      });
+    }, error => {
+      UIkit.notification(error.error.message, {
+        status: 'danger',
+        timeout: 3000,
+        pos: 'top-left'
+      });
+    });
+  }
+  
+  toggleTopicAccess(topic: Topic) {
+    let path = [
+      this.stakeholder._id,
+      topic._id
+    ];
+    this.stakeholderService.toggleAccess(this.properties.monitorServiceAPIURL, path).subscribe(isPublic => {
+      topic.isPublic = isPublic;
+      this.stakeholderService.setStakeholder(this.stakeholder);
+      UIkit.notification('Topic has been successfully changed to ' + (isPublic?'public':'private'), {
+        status: 'success',
+        timeout: 3000,
+        pos: 'top-left'
+      });
+    }, error => {
+      UIkit.notification(error.error.message, {
+        status: 'danger',
+        timeout: 3000,
+        pos: 'top-left'
+      });
+    });
+  }
 }

src/app/topic/topic.component.html

@@ -14,19 +14,19 @@
           <div class="menu_title uk-width-expand">
             {{stakeholder.topics[topicIndex].name.toUpperCase()}}
           </div>
-          <div class="uk-width-1-6"
+          <div class="menu_icon"
                (click)="$event.stopPropagation();$event.preventDefault()">
             <i class="material-icons onHover md-color-white">more_vert</i>
             <div uk-dropdown="mode: click; pos: bottom-right; offset: 5; delay-hide: 0; flip: false"
                  class="uk-padding-remove-horizontal">
               <ul class="uk-nav uk-dropdown-nav">
                 <li><a (click)="editTopicOpen()">Edit</a></li>
-                <!--<li><a (click)="toggleIndicatorStatus(indicator)">
+                <li><a (click)="toggleTopicStatus()">
-                  {{indicator.isActive ? 'Deactivate' : 'Activate'}}</a>
+                  {{stakeholder.topics[topicIndex].isActive ? 'Deactivate' : 'Activate'}}</a>
+                </li>
+                <li><a (click)="toggleTopicAccess()">
+                    {{stakeholder.topics[topicIndex].isPublic?'Unpublish':'Publish'}}</a>
                 </li>
-                <li><a (click)="toggleIndicatorAccess(indicator)">
-                    {{indicator.isPublic?'Unpublish':'Publish'}}</a>
-                </li>-->
                 <hr class="uk-nav-divider">
                 <li><a (click)="deleteTopicOpen()">Delete</a></li>
               </ul>
@@ -52,12 +52,12 @@
                    class="uk-padding-remove-horizontal">
                 <ul class="uk-nav uk-dropdown-nav">
                   <li><a (click)="editCategoryOpen(i)">Edit</a></li>
-                  <!--<li><a (click)="toggleIndicatorStatus(indicator)">
+                  <li><a (click)="toggleCategoryStatus(i)">
-                    {{indicator.isActive ? 'Deactivate' : 'Activate'}}</a>
+                    {{category.isActive ? 'Deactivate' : 'Activate'}}</a>
+                  </li>
+                  <li><a (click)="toggleCategoryAccess(i)">
+                      {{category.isPublic?'Unpublish':'Publish'}}</a>
                   </li>
-                  <li><a (click)="toggleIndicatorAccess(indicator)">
-                      {{indicator.isPublic?'Unpublish':'Publish'}}</a>
-                  </li>-->
                   <hr class="uk-nav-divider">
                   <li><a (click)="deleteCategoryOpen(i)">Delete</a></li>
                 </ul>
@@ -81,12 +81,12 @@
                          class="uk-padding-remove-horizontal">
                       <ul class="uk-nav uk-dropdown-nav">
                         <li><a (click)="editSubCategoryOpen(j)">Edit</a></li>
-                        <!--<li><a (click)="toggleIndicatorStatus(indicator)">
+                        <li><a (click)="toggleSubcategoryStatus(j)">
-                          {{indicator.isActive ? 'Deactivate' : 'Activate'}}</a>
+                          {{subcategory.isActive ? 'Deactivate' : 'Activate'}}</a>
+                        </li>
+                        <li><a (click)="toggleSubcategoryAccess(j)">
+                          {{subcategory.isPublic?'Unpublish':'Publish'}}</a>
                         </li>
-                        <li><a (click)="toggleIndicatorAccess(indicator)">
-                            {{indicator.isPublic?'Unpublish':'Publish'}}</a>
-                        </li>-->
                         <hr class="uk-nav-divider">
                         <li><a (click)="deleteSubcategoryOpen(j)">Delete</a></li>
                       </ul>

src/app/topic/topic.component.ts

@@ -9,417 +9,520 @@ import {AlertModal} from "../openaireLibrary/utils/modal/alert";
 import {Subscriber, Subscription} from "rxjs";
 import {FormBuilder, FormGroup, Validators} from "@angular/forms";
 import {StakeholderUtils} from "../utils/indicator-utils";
+import {StringUtils} from "../openaireLibrary/utils/string-utils.class";
 
 declare var UIkit;
 
 @Component({
-    selector: 'topic',
+  selector: 'topic',
-    templateUrl: './topic.component.html',
+  templateUrl: './topic.component.html',
 })
 export class TopicComponent implements OnInit, OnDestroy {
-    public subscriptions: any[] = [];
+  public subscriptions: any[] = [];
-    public properties: EnvProperties;
+  public properties: EnvProperties;
-    public stakeholderUtils: StakeholderUtils = new StakeholderUtils();
+  public stakeholderUtils: StakeholderUtils = new StakeholderUtils();
-    public loading: boolean = true;
+  public loading: boolean = true;
-    public stakeholder: Stakeholder;
+  public stakeholder: Stakeholder;
-    /**
+  /**
-     * Current topic
+   * Current topic
-     **/
+   **/
-    public topicIndex: number = 0;
+  public topicIndex: number = 0;
-    /**
+  /**
-     * categoryIndex: Current category to be edited, selectedCategoryIndex: selected on menu(opened)
+   * categoryIndex: Current category to be edited, selectedCategoryIndex: selected on menu(opened)
-     */
+   */
-    public categoryIndex: number = 0;
+  public categoryIndex: number = 0;
-    public selectedCategoryIndex: number = 0;
+  public selectedCategoryIndex: number = 0;
-    /**
+  /**
-     * Current Subcategory to be edited
+   * Current Subcategory to be edited
-     */
+   */
-    public subCategoryIndex: number = 0;
+  public subCategoryIndex: number = 0;
-    /**
+  /**
-     * Current element and index of topic, category or subcategory to be deleted.
+   * Current element and index of topic, category or subcategory to be deleted.
-     */
+   */
-    public form: FormGroup;
+  public form: FormGroup;
-    public element: Topic | Category | SubCategory;
+  public element: Topic | Category | SubCategory;
-    public type: 'topic' | 'category' | 'subcategory' = "topic";
+  public type: 'topic' | 'category' | 'subcategory' = "topic";
-    public index: number = -1;
+  public index: number = -1;
-    /**
+  /**
-     * Check form validity
+   * Check form validity
-     */
+   */
-    public toggle: boolean = false;
+  public toggle: boolean = false;
-
+  
-    @ViewChild('deleteModal') deleteModal: AlertModal;
+  @ViewChild('deleteModal') deleteModal: AlertModal;
-    @ViewChild('editModal') editModal: AlertModal;
+  @ViewChild('editModal') editModal: AlertModal;
-
+  
-    constructor(
+  constructor(
-        private route: ActivatedRoute,
+    private route: ActivatedRoute,
-        private router: Router,
+    private router: Router,
-        private title: Title,
+    private title: Title,
-        private fb: FormBuilder,
+    private fb: FormBuilder,
-        private stakeholderService: StakeholderService) {
+    private stakeholderService: StakeholderService) {
-    }
+  }
-
+  
-    public ngOnInit() {
+  public ngOnInit() {
-        this.route.data
+    this.route.data
-            .subscribe((data: { envSpecific: EnvProperties }) => {
+      .subscribe((data: { envSpecific: EnvProperties }) => {
-                this.properties = data.envSpecific;
+        this.properties = data.envSpecific;
-                let subscription: Subscription;
+        let subscription: Subscription;
-                this.route.params.subscribe(params => {
+        this.route.params.subscribe(params => {
-                    if(subscription) {
+          if (subscription) {
-                      subscription.unsubscribe();
+            subscription.unsubscribe();
-                    }
+          }
-                    subscription = this.stakeholderService.getStakeholderAsObservable().subscribe(stakeholder => {
+          subscription = this.stakeholderService.getStakeholderAsObservable().subscribe(stakeholder => {
-                        if (stakeholder) {
+            if (stakeholder) {
-                            this.stakeholder = HelperFunctions.copy(stakeholder);
+              this.stakeholder = HelperFunctions.copy(stakeholder);
-                            this.topicIndex = this.stakeholder.topics.findIndex(topic => topic.alias === params['topic']);
+              this.topicIndex = this.stakeholder.topics.findIndex(topic => topic.alias === params['topic']);
-                            if (this.topicIndex === -1) {
+              if (this.topicIndex === -1) {
-                                this.navigateToError();
+                this.navigateToError();
-                            } else {
+              } else {
-                                this.title.setTitle(stakeholder.index_shortName + ' | ' + this.stakeholder.topics[this.topicIndex].name);
+                this.title.setTitle(stakeholder.index_shortName + ' | ' + this.stakeholder.topics[this.topicIndex].name);
-                                this.toggle = true;
+                this.toggle = true;
-                            }
+              }
-                        }
-                    });
-                    this.subscriptions.push(subscription);
-                });
-            });
-    }
-
-    public ngOnDestroy() {
-        this.subscriptions.forEach(value => {
-            if (value instanceof Subscriber) {
-                value.unsubscribe();
             }
+          });
+          this.subscriptions.push(subscription);
         });
+      });
+  }
+  
+  public ngOnDestroy() {
+    this.subscriptions.forEach(value => {
+      if (value instanceof Subscriber) {
+        value.unsubscribe();
+      }
+    });
+  }
+  
+  public saveElement() {
+    if (this.type === "topic") {
+      this.saveTopic();
+    } else if (this.type === "category") {
+      this.saveCategory();
+    } else {
+      this.saveSubCategory();
     }
+  }
+  
+  public deleteElement() {
+    if (this.type === "topic") {
+      this.deleteTopic();
+    } else if (this.type === "category") {
+      this.deleteCategory();
+    } else {
+      this.deleteSubcategory();
+    }
+  }
+  
+  private buildTopic(topic: Topic) {
+    let topics = this.stakeholder.topics.filter(element => element._id !== topic._id);
+    this.form = this.fb.group({
+      _id: this.fb.control(topic._id),
+      name: this.fb.control(topic.name, Validators.required),
+      description: this.fb.control(topic.description),
+      alias: this.fb.control(topic.alias, [
+          Validators.required,
+          this.stakeholderUtils.aliasValidator(topics)
+        ]
+      ),
+      isActive: this.fb.control(topic.isActive),
+      isPublic: this.fb.control(topic.isPublic),
+      isDefault: this.fb.control(topic.isDefault),
+      categories: this.fb.control(topic.categories)
+    });
+    this.subscriptions.push(this.form.get('name').valueChanges.subscribe(value => {
+      let i = 1;
+      value = this.stakeholderUtils.generateAlias(value);
+      this.form.controls['alias'].setValue(value);
+      while (this.form.get('alias').invalid) {
+        this.form.controls['alias'].setValue(value + i);
+        i++;
+      }
+    }));
+  }
+  
+  public editTopicOpen() {
+    this.index = this.topicIndex;
+    this.type = 'topic';
+    this.buildTopic(this.stakeholder.topics[this.index]);
+    this.editOpen();
+  }
+  
+  public saveTopic() {
+    if (!this.form.invalid) {
+      let path = [this.stakeholder._id];
+      let callback = (topic: Topic): void => {
+        this.stakeholder.topics[this.index] = topic;
+        this.stakeholderService.setStakeholder(this.stakeholder);
+      };
+      this.save('Topic has been successfully saved', path, this.form.value, callback, true);
+    }
+  }
+  
+  public toggleTopicStatus() {
+    this.index = this.topicIndex;
+    this.type = 'topic';
+    let path = [
+      this.stakeholder._id,
+      this.stakeholder.topics[this.topicIndex]._id
+    ];
+    this.toggleStatus(this.stakeholder.topics[this.topicIndex], path);
+  }
+  
+  public toggleTopicAccess() {
+    this.index = this.topicIndex;
+    this.type = 'topic';
+    let path = [
+      this.stakeholder._id,
+      this.stakeholder.topics[this.topicIndex]._id
+    ];
+    this.toggleAccess(this.stakeholder.topics[this.topicIndex], path);
+  }
+  
+  public deleteTopicOpen() {
+    this.type = 'topic';
+    this.index = this.topicIndex;
+    this.element = this.stakeholder.topics[this.index];
+    this.deleteOpen();
+  }
+  
+  public deleteTopic() {
+    let path: string[] = [
+      this.stakeholder._id,
+      this.stakeholder.topics[this.index]._id
+    ];
+    let callback = (): void => {
+      this.stakeholder.topics.splice(this.index, 1);
+      this.stakeholderService.setStakeholder(this.stakeholder);
+    };
+    this.delete('Topic has been successfully be deleted', path, callback, true);
+  }
+  
+  public toggleCategory(index: number) {
+    if (this.selectedCategoryIndex !== index) {
+      this.selectedCategoryIndex = index;
+      this.toggle = true;
+    } else {
+      this.toggle = !this.toggle;
+    }
+  }
+  
+  private buildCategory(category: Category) {
+    let categories = this.stakeholder.topics[this.topicIndex].categories.filter(element => element._id !== category._id);
+    this.form = this.fb.group({
+      _id: this.fb.control(category._id),
+      name: this.fb.control(category.name, Validators.required),
+      description: this.fb.control(category.description),
+      alias: this.fb.control(category.alias, [
+          Validators.required,
+          this.stakeholderUtils.aliasValidator(categories)
+        ]
+      ),
+      isActive: this.fb.control(category.isActive),
+      isPublic: this.fb.control(category.isPublic),
+      isDefault: this.fb.control(category.isDefault),
+      subCategories: this.fb.control(category.subCategories)
+    });
+    this.subscriptions.push(this.form.get('name').valueChanges.subscribe(value => {
+      let i = 1;
+      value = this.stakeholderUtils.generateAlias(value);
+      this.form.controls['alias'].setValue(value);
+      while (this.form.get('alias').invalid) {
+        this.form.controls['alias'].setValue(value + i);
+        i++;
+      }
+    }));
+  }
+  
+  public editCategoryOpen(index: number = -1) {
+    this.index = index;
+    this.type = 'category';
+    if (index === -1) {
+      this.buildCategory(new Category(null, null, null, true, true));
+    } else {
+      this.buildCategory(this.stakeholder.topics[this.topicIndex].categories[index]);
+    }
+    this.editOpen();
+  }
+  
+  public saveCategory() {
+    if (!this.form.invalid) {
+      let path = [this.stakeholder._id, this.stakeholder.topics[this.topicIndex]._id];
+      let callback = (category: Category): void => {
+        if (this.index === -1) {
+          this.stakeholder.topics[this.topicIndex].categories.push(category);
+        } else {
+          this.stakeholder.topics[this.topicIndex].categories[this.index] = HelperFunctions.copy(category);
+        }
+        this.stakeholderService.setStakeholder(this.stakeholder);
+      };
+      if (this.index === -1) {
+        this.save('Category has been successfully created', path, this.form.value, callback);
+      } else {
+        this.save('Category has been successfully saved', path, this.form.value, callback);
+      }
+    }
+  }
+  
+  public toggleCategoryStatus(index: number) {
+    this.index = index;
+    this.type = 'category';
+    let path = [
+      this.stakeholder._id,
+      this.stakeholder.topics[this.topicIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.index]._id
+    ];
+    this.toggleStatus(this.stakeholder.topics[this.topicIndex].categories[this.index], path);
+  }
+  
+  public toggleCategoryAccess(index: number) {
+      this.index = index;
+      this.type = 'category';
+      let path = [
+          this.stakeholder._id,
+          this.stakeholder.topics[this.topicIndex]._id,
+          this.stakeholder.topics[this.topicIndex].categories[this.index]._id
+      ];
+      this.toggleAccess(this.stakeholder.topics[this.topicIndex].categories[this.index], path);
+  }
+  
+  public deleteCategoryOpen(index: number) {
+    this.type = 'category';
+    this.index = index;
+    this.element = this.stakeholder.topics[this.topicIndex].categories[this.index];
+    this.deleteOpen();
+  }
+  
+  public deleteCategory() {
+    let path: string[] = [
+      this.stakeholder._id,
+      this.stakeholder.topics[this.topicIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.index]._id
+    ];
+    let callback = (): void => {
+      this.stakeholder.topics[this.topicIndex].categories.splice(this.index, 1);
+      this.stakeholderService.setStakeholder(this.stakeholder);
+    };
+    this.delete('Category has been successfully be deleted', path, callback);
+  }
+  
+  private buildSubcategory(subCategory: SubCategory) {
+    let subCategories = this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories.filter(element => element._id !== subCategory._id);
+    this.form = this.fb.group({
+      _id: this.fb.control(subCategory._id),
+      name: this.fb.control(subCategory.name, Validators.required),
+      description: this.fb.control(subCategory.description),
+      alias: this.fb.control(subCategory.alias, [
+          Validators.required,
+          this.stakeholderUtils.aliasValidator(subCategories)
+        ]
+      ),
+      isActive: this.fb.control(subCategory.isActive),
+      isPublic: this.fb.control(subCategory.isPublic),
+      isDefault: this.fb.control(subCategory.isDefault),
+      charts: this.fb.control(subCategory.charts),
+      numbers: this.fb.control(subCategory.numbers)
+    });
+    this.subscriptions.push(this.form.get('name').valueChanges.subscribe(value => {
+      let i = 1;
+      value = this.stakeholderUtils.generateAlias(value);
+      this.form.controls['alias'].setValue(value);
+      while (this.form.get('alias').invalid) {
+        this.form.controls['alias'].setValue(value + i);
+        i++;
+      }
+    }));
+  }
+  
+  public editSubCategoryOpen(index: number = -1) {
+    this.index = index;
+    this.type = 'subcategory';
+    if (index === -1) {
+      this.buildSubcategory(new SubCategory(null, null, null, true, true));
+    } else {
+      this.buildSubcategory(this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories[index]);
+    }
+    this.editOpen();
+  }
+  
+  public saveSubCategory() {
+    if (!this.form.invalid) {
+      let path: string[] = [
+        this.stakeholder._id,
+        this.stakeholder.topics[this.topicIndex]._id,
+        this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex]._id,
+      ];
+      let callback = (subCategory: SubCategory): void => {
+        if (this.index === -1) {
+          this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories.push(subCategory);
+        } else {
+          this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories[this.index] = subCategory;
+        }
+        this.stakeholderService.setStakeholder(this.stakeholder);
+      };
+      if (this.index === -1) {
+        this.save('Subcategory has been successfully created', path, this.form.value, callback);
+      } else {
+        this.save('Subcategory has been successfully saved', path, this.form.value, callback);
+      }
+    }
+  }
     
-    public saveElement() {
+    public toggleSubcategoryStatus(index: number) {
-        if(this.type === "topic") {
-            this.saveTopic();
-        } else if(this.type === "category") {
-            this.saveCategory();
-        } else {
-            this.saveSubCategory();
-        }
-    }
-    
-    public deleteElement() {
-        if(this.type === "topic") {
-            this.deleteTopic();
-        } else if(this.type === "category") {
-            this.deleteCategory();
-        } else {
-            this.deleteSubcategory();
-        }
-    }
-    
-    private buildTopic(topic: Topic) {
-        let topics = this.stakeholder.topics.filter(element => element._id !== topic._id);
-        this.form = this.fb.group({
-            _id: this.fb.control(topic._id),
-            name: this.fb.control(topic.name, Validators.required),
-            description: this.fb.control(topic.description),
-            alias: this.fb.control(topic.alias, [
-                    Validators.required,
-                    this.stakeholderUtils.aliasValidator(topics)
-                ]
-            ),
-            isActive: this.fb.control(topic.isActive),
-            isPublic: this.fb.control(topic.isPublic),
-            isDefault: this.fb.control(topic.isDefault),
-            categories: this.fb.control(topic.categories)
-        });
-        this.subscriptions.push(this.form.get('name').valueChanges.subscribe(value => {
-            let i = 1;
-            value = this.stakeholderUtils.generateAlias(value);
-            this.form.controls['alias'].setValue(value);
-            while (this.form.get('alias').invalid) {
-                this.form.controls['alias'].setValue(value + i);
-                i++;
-            }
-        }));
-    }
-
-    public editTopicOpen() {
-        this.index = this.topicIndex;
-        this.type = 'topic';
-        this.buildTopic(this.stakeholder.topics[this.index]);
-        this.editOpen();
-    }
-
-    public saveTopic() {
-        if (!this.form.invalid) {
-            let path = [this.stakeholder._id];
-            let callback = (topic: Topic): void => {
-                this.stakeholder.topics[this.index] = topic;
-                this.stakeholderService.setStakeholder(this.stakeholder);
-            };
-            this.save('Topic has been successfully saved', path, this.form.value, callback, true);
-        }
-    }
-
-    public deleteTopicOpen() {
-        this.type = 'topic';
-        this.index = this.topicIndex;
-        this.element = this.stakeholder.topics[this.index];
-        this.deleteOpen();
-    }
-
-    public deleteTopic() {
-        let path: string[] = [
-            this.stakeholder._id,
-            this.stakeholder.topics[this.index]._id
-        ];
-        let callback = (): void => {
-            this.stakeholder.topics.splice(this.index, 1);
-            this.stakeholderService.setStakeholder(this.stakeholder);
-        };
-        this.delete('Topic has been successfully be deleted', path, callback, true);
-    }
-
-    public toggleCategory(index: number) {
-        if (this.selectedCategoryIndex !== index) {
-            this.selectedCategoryIndex = index;
-            this.toggle = true;
-        } else {
-            this.toggle = !this.toggle;
-        }
-    }
-
-    private buildCategory(category: Category) {
-        let categories = this.stakeholder.topics[this.topicIndex].categories.filter(element => element._id !== category._id);
-        this.form = this.fb.group({
-            _id: this.fb.control(category._id),
-            name: this.fb.control(category.name, Validators.required),
-            description: this.fb.control(category.description),
-            alias: this.fb.control(category.alias, [
-                    Validators.required,
-                    this.stakeholderUtils.aliasValidator(categories)
-                ]
-            ),
-            isActive: this.fb.control(category.isActive),
-            isPublic: this.fb.control(category.isPublic),
-            isDefault: this.fb.control(category.isDefault),
-            subCategories: this.fb.control(category.subCategories)
-        });
-        this.subscriptions.push(this.form.get('name').valueChanges.subscribe(value => {
-            let i = 1;
-            value = this.stakeholderUtils.generateAlias(value);
-            this.form.controls['alias'].setValue(value);
-            while (this.form.get('alias').invalid) {
-                this.form.controls['alias'].setValue(value + i);
-                i++;
-            }
-        }));
-    }
-
-    public editCategoryOpen(index: number = -1) {
-        this.index = index;
-        this.type = 'category';
-        if (index === -1) {
-            this.buildCategory(new Category(null, null, null, true, true));
-        } else {
-            this.buildCategory(this.stakeholder.topics[this.topicIndex].categories[index]);
-        }
-        this.editOpen();
-    }
-
-    public saveCategory() {
-        if (!this.form.invalid) {
-            let path = [this.stakeholder._id, this.stakeholder.topics[this.topicIndex]._id];
-            let callback = (category: Category): void => {
-                if (this.index === -1) {
-                    this.stakeholder.topics[this.topicIndex].categories.push(category);
-                } else {
-                    this.stakeholder.topics[this.topicIndex].categories[this.index] = HelperFunctions.copy(category);
-                }
-                this.stakeholderService.setStakeholder(this.stakeholder);
-            };
-            if (this.index  === -1) {
-                this.save('Category has been successfully created', path, this.form.value, callback);
-            } else {
-                this.save('Category has been successfully saved', path, this.form.value, callback);
-            }
-        }
-    }
-
-    public deleteCategoryOpen(index: number) {
-        this.type = 'category';
-        this.index = index;
-        this.element = this.stakeholder.topics[this.topicIndex].categories[this.index];
-        this.deleteOpen();
-    }
-
-    public deleteCategory() {
-        let path: string[] = [
-            this.stakeholder._id,
-            this.stakeholder.topics[this.topicIndex]._id,
-            this.stakeholder.topics[this.topicIndex].categories[this.index]._id
-        ];
-        let callback = (): void => {
-            this.stakeholder.topics[this.topicIndex].categories.splice(this.index, 1);
-            this.stakeholderService.setStakeholder(this.stakeholder);
-        };
-        this.delete('Category has been successfully be deleted', path, callback);
-    }
-
-    private buildSubcategory(subCategory: SubCategory) {
-        let subCategories = this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories.filter(element => element._id !== subCategory._id);
-        this.form = this.fb.group({
-            _id: this.fb.control(subCategory._id),
-            name: this.fb.control(subCategory.name, Validators.required),
-            description: this.fb.control(subCategory.description),
-            alias: this.fb.control(subCategory.alias, [
-                    Validators.required,
-                    this.stakeholderUtils.aliasValidator(subCategories)
-                ]
-            ),
-            isActive: this.fb.control(subCategory.isActive),
-            isPublic: this.fb.control(subCategory.isPublic),
-            isDefault: this.fb.control(subCategory.isDefault),
-            charts: this.fb.control(subCategory.charts),
-            numbers: this.fb.control(subCategory.numbers)
-        });
-        this.subscriptions.push(this.form.get('name').valueChanges.subscribe(value => {
-            let i = 1;
-            value = this.stakeholderUtils.generateAlias(value);
-            this.form.controls['alias'].setValue(value);
-            while (this.form.get('alias').invalid) {
-                this.form.controls['alias'].setValue(value + i);
-                i++;
-            }
-        }));
-    }
-
-    public editSubCategoryOpen(index: number = -1) {
         this.index = index;
         this.type = 'subcategory';
-        if (index === -1) {
+        let path = [
-            this.buildSubcategory(new SubCategory(null, null, null, true, true));
-        } else {
-            this.buildSubcategory(this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories[index]);
-        }
-        this.editOpen();
-    }
-
-    public saveSubCategory() {
-        if (!this.form.invalid) {
-            let path: string[] = [
-                this.stakeholder._id,
-                this.stakeholder.topics[this.topicIndex]._id,
-                this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex]._id,
-            ];
-            let callback = (subCategory: SubCategory): void => {
-                if (this.index === -1) {
-                    this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories.push(subCategory);
-                } else {
-                    this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories[this.index] = subCategory;
-                }
-                this.stakeholderService.setStakeholder(this.stakeholder);
-            };
-            if (this.index  === -1) {
-                this.save('Subcategory has been successfully created', path, this.form.value, callback);
-            } else {
-                this.save('Subcategory has been successfully saved', path, this.form.value, callback);
-            }
-        }
-    }
-
-    public deleteSubcategoryOpen(index) {
-        this.type = 'subcategory';
-        this.index = index;
-        this.element = this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories[this.index];
-        this.deleteOpen();
-    }
-
-    public deleteSubcategory() {
-        let path: string[] = [
             this.stakeholder._id,
             this.stakeholder.topics[this.topicIndex]._id,
             this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex]._id,
             this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories[this.index]._id
         ];
-        let callback = (): void => {
+        this.toggleStatus(this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories[this.index], path);
-            this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories.splice(this.index, 1);
-            this.stakeholderService.setStakeholder(this.stakeholder);
-        };
-        this.delete('Subcategory has been successfully be deleted', path, callback);
-    }
-
-    private navigateToError() {
-        this.router.navigate(['/error'], {queryParams: {'page': this.router.url}});
     }
     
-    private editOpen() {
+    public toggleSubcategoryAccess(index: number) {
-        this.editModal.cancelButtonText = 'Cancel';
+        this.index = index;
-        this.editModal.okButtonLeft = false;
+        this.type = 'subcategory';
-        this.editModal.alertMessage = false;
+        let path = [
-        if (this.index === -1) {
+            this.stakeholder._id,
-            this.editModal.alertTitle = 'Create a new ' + this.type;
+            this.stakeholder.topics[this.topicIndex]._id,
-            this.editModal.okButtonText = 'Create';
+            this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex]._id,
-        } else {
+            this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories[this.index]._id
-            this.editModal.alertTitle = 'Edit ' + this.type + '\'s information ';
+        ];
-            this.editModal.okButtonText = 'Save';
+        this.toggleAccess(this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories[this.index], path);
-        }
-        this.editModal.open();
     }
-
+  
-    private deleteOpen() {
+  public deleteSubcategoryOpen(index) {
-        this.deleteModal.alertTitle = 'Delete ' + this.type;
+    this.type = 'subcategory';
-        this.deleteModal.cancelButtonText = 'No';
+    this.index = index;
-        this.deleteModal.okButtonText = 'Yes';
+    this.element = this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories[this.index];
-        this.deleteModal.open();
+    this.deleteOpen();
+  }
+  
+  public deleteSubcategory() {
+    let path: string[] = [
+      this.stakeholder._id,
+      this.stakeholder.topics[this.topicIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex]._id,
+      this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories[this.index]._id
+    ];
+    let callback = (): void => {
+      this.stakeholder.topics[this.topicIndex].categories[this.selectedCategoryIndex].subCategories.splice(this.index, 1);
+      this.stakeholderService.setStakeholder(this.stakeholder);
+    };
+    this.delete('Subcategory has been successfully be deleted', path, callback);
+  }
+  
+  private navigateToError() {
+    this.router.navigate(['/error'], {queryParams: {'page': this.router.url}});
+  }
+  
+  private editOpen() {
+    this.editModal.cancelButtonText = 'Cancel';
+    this.editModal.okButtonLeft = false;
+    this.editModal.alertMessage = false;
+    if (this.index === -1) {
+      this.editModal.alertTitle = 'Create a new ' + this.type;
+      this.editModal.okButtonText = 'Create';
+    } else {
+      this.editModal.alertTitle = 'Edit ' + this.type + '\'s information ';
+      this.editModal.okButtonText = 'Save';
     }
-
+    this.editModal.open();
-    private save(message: string, path: string[], saveElement: any, callback: Function, redirect = false) {
+  }
-        this.stakeholderService.saveElement(this.properties.monitorServiceAPIURL, saveElement, path).subscribe(saveElement => {
+  
-            callback(saveElement);
+  private deleteOpen() {
-            UIkit.notification(message, {
+    this.deleteModal.alertTitle = 'Delete ' + this.type;
-                status: 'success',
+    this.deleteModal.cancelButtonText = 'No';
-                timeout: 3000,
+    this.deleteModal.okButtonText = 'Yes';
-                pos: 'top-left'
+    this.deleteModal.open();
-            });
+  }
-            if (redirect) {
+  
-                this.router.navigate(['../' + saveElement.alias], {
+  private save(message: string, path: string[], saveElement: any, callback: Function, redirect = false) {
-                    relativeTo: this.route
+    this.stakeholderService.saveElement(this.properties.monitorServiceAPIURL, saveElement, path).subscribe(saveElement => {
-                });
+      callback(saveElement);
-            }
+      UIkit.notification(message, {
-        }, error => {
+        status: 'success',
-            UIkit.notification(error.error.message, {
+        timeout: 3000,
-                status: 'danger',
+        pos: 'top-left'
-                timeout: 3000,
+      });
-                pos: 'top-left'
+      if (redirect) {
-            });
+        this.router.navigate(['../' + saveElement.alias], {
+          relativeTo: this.route
         });
-    }
+      }
-
+    }, error => {
-    private delete(message: string, path: string[], callback: Function, redirect = false) {
+      UIkit.notification(error.error.message, {
-        this.stakeholderService.deleteElement(this.properties.monitorServiceAPIURL, path).subscribe(() => {
+        status: 'danger',
-            callback();
+        timeout: 3000,
-            UIkit.notification(message, {
+        pos: 'top-left'
-                status: 'success',
+      });
-                timeout: 3000,
+    });
-                pos: 'top-left'
+  }
-            });
+  
-            if (redirect) {
+  private delete(message: string, path: string[], callback: Function, redirect = false) {
-                this.back();
+    this.stakeholderService.deleteElement(this.properties.monitorServiceAPIURL, path).subscribe(() => {
-            }
+      callback();
-        }, error => {
+      UIkit.notification(message, {
-            UIkit.notification(error.error.message, {
+        status: 'success',
-                status: 'danger',
+        timeout: 3000,
-                timeout: 3000,
+        pos: 'top-left'
-                pos: 'top-left'
+      });
-            });
+      if (redirect) {
-        });
+        this.back();
-    }
+      }
-
+    }, error => {
-    back() {
+      UIkit.notification(error.error.message, {
-        this.router.navigate(['../'], {
+        status: 'danger',
-            relativeTo: this.route
+        timeout: 3000,
-        });
+        pos: 'top-left'
-    }
+      });
-
+    });
-    chooseSubcategory(categoryIndex: number, subcategoryIndex: number) {
+  }
-        this.categoryIndex = categoryIndex;
+  
-        this.subCategoryIndex = subcategoryIndex;
+  private toggleStatus(element: Topic | Category | SubCategory, path: string[]) {
-    }
+    this.stakeholderService.toggleStatus(this.properties.monitorServiceAPIURL, path).subscribe(isActive => {
+      element.isActive = isActive;
+      this.stakeholderService.setStakeholder(this.stakeholder);
+      UIkit.notification(StringUtils.capitalize(this.type) + ' has been successfully ' + (isActive ? 'activated' : 'deactivated'), {
+        status: 'success',
+        timeout: 3000,
+        pos: 'top-left'
+      });
+    }, error => {
+      UIkit.notification(error.error.message, {
+        status: 'danger',
+        timeout: 3000,
+        pos: 'top-left'
+      });
+    });
+  }
+  
+  private toggleAccess(element: Topic | Category | SubCategory, path: string[]) {
+    this.stakeholderService.toggleAccess(this.properties.monitorServiceAPIURL, path).subscribe(isPublic => {
+      element.isPublic = isPublic;
+      this.stakeholderService.setStakeholder(this.stakeholder);
+      UIkit.notification(StringUtils.capitalize(this.type) + ' has been successfully changed to ' + (isPublic ? 'public' : 'private'), {
+        status: 'success',
+        timeout: 3000,
+        pos: 'top-left'
+      });
+    }, error => {
+      UIkit.notification(error.error.message, {
+        status: 'danger',
+        timeout: 3000,
+        pos: 'top-left'
+      });
+    });
+  }
+  
+  back() {
+    this.router.navigate(['../'], {
+      relativeTo: this.route
+    });
+  }
+  
+  chooseSubcategory(categoryIndex: number, subcategoryIndex: number) {
+    this.categoryIndex = categoryIndex;
+    this.subCategoryIndex = subcategoryIndex;
+  }
 }

src/assets/theme-assets/css/main.css

@@ -199,7 +199,7 @@
 }
 .uk-modal-dialog .uk-modal-header .uk-modal-title {
   margin: 0;
-  font: 500 18px / 28px "Open Sans";
+  font: 500 18px / 28px "Open Sans", sans-serif;
 }
 .uk-modal-dialog .uk-modal-header .uk-modal-title span {
   font-size: 16px;
@@ -1560,7 +1560,7 @@ div.uk-form-file.md-btn {
   color: #fff;
 }
 .uk-datepicker-nav .uk-form-select {
-  font: 400 16px / 22px "Open Sans";
+  font: 400 16px / 22px "Open Sans", sans-serif;
   color: #fff;
   text-transform: uppercase;
   border-bottom: 1px solid rgba(255, 255, 255, 0.5);
@@ -1598,7 +1598,7 @@ div.uk-form-file.md-btn {
 .uk-datepicker-table th,
 .uk-datepicker-table td {
   padding: 2px;
-  font: 400 13px / 15px "Open Sans";
+  font: 400 13px / 15px "Open Sans", sans-serif;
 }
 .uk-datepicker-table th {
   color: #727272;
@@ -3503,7 +3503,7 @@ body > .content-preloader.preloader-active {
   -webkit-appearance: none;
   display: inline-block;
   vertical-align: middle;
-  font: 500 14px / 31px "Open Sans" !important;
+  font: 500 14px / 31px "Open Sans", sans-serif !important;
 }
 .md-btn:hover,
 .md-btn:focus,
@@ -4300,7 +4300,7 @@ body > .content-preloader.preloader-active {
   padding: 4px 16px;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
-  font: 400 16px / 32px "Open Sans";
+  font: 400 16px / 32px "Open Sans", sans-serif;
   text-align: left;
 }
 .md-fab-sheet-actions > a,
@@ -5947,7 +5947,7 @@ body > .content-preloader.preloader-active {
   clear: both;
 }
 .md-card .md-card-toolbar-heading-text {
-  font: 500 14px / 50px "Open Sans";
+  font: 500 14px / 50px "Open Sans", sans-serif;
   color: #212121;
   margin: 0;
   float: left;
@@ -5996,7 +5996,7 @@ body > .content-preloader.preloader-active {
 }
 .md-card .md-card-toolbar-input {
   border: none;
-  font: 400 18px / 24px "Open Sans";
+  font: 400 18px / 24px "Open Sans", sans-serif;
   height: auto;
   background: none !important;
   padding: 12px 0;
@@ -6031,13 +6031,13 @@ body > .content-preloader.preloader-active {
 }
 .md-card .md-card-head-text {
   padding: 8px 16px 16px;
-  font: 500 16px / 22px "Open Sans";
+  font: 500 16px / 22px "Open Sans", sans-serif;
   color: #212121;
   margin: 0;
 }
 .md-card .md-card-head-text span:not(.listNavSelector) {
   display: block;
-  font: 400 12px / 18px "Open Sans";
+  font: 400 12px / 18px "Open Sans", sans-serif;
   margin-top: -2px;
 }
 .md-card .md-card-head-text.text_dark {
@@ -6249,10 +6249,10 @@ body > .content-preloader.preloader-active {
   box-sizing: border-box;
 }
 .md-card.md-card-overlay .md-card-overlay-header h3 {
-  font: 400 16px / 30px "Open Sans";
+  font: 400 16px / 30px "Open Sans", sans-serif;
 }
 .md-card.md-card-overlay .md-card-overlay-header h4 {
-  font: 500 14px / 30px "Open Sans";
+  font: 500 14px / 30px "Open Sans", sans-serif;
 }
 .md-card.md-card-overlay .md-card-overlay-header .md-icon {
   position: absolute;
@@ -6615,7 +6615,7 @@ input[type="color"].md-input {
   border-width: 0 0 1px;
   border-style: solid;
   border-color: rgba(0, 0, 0, 0.12);
-  font: 400 15px / 18px "Open Sans";
+  font: 400 15px / 18px "Open Sans", sans-serif;
   -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0);
   box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0);
   -webkit-box-sizing: border-box;
@@ -8174,7 +8174,7 @@ button.md-icon {
   right: 0;
   bottom: 0;
   text-align: center;
-  font: 400 20px / 110px "Open Sans";
+  font: 400 20px / 110px "Open Sans", sans-serif;
 }
 .epc_chart_icon {
   position: absolute;
@@ -9086,7 +9086,7 @@ div.dt-button-info {
 div.dt-button-info h2 {
   padding: 16px;
   margin: 0;
-  font: 400 20px / 24px "Open Sans";
+  font: 400 20px / 24px "Open Sans", sans-serif;
 }
 div.dt-button-info > div {
   padding: 16px 24px;
@@ -10635,7 +10635,7 @@ a.waves-effect .waves-ripple {
   cursor: pointer;
   margin: 0 auto;
   border-radius: 3px;
-  font: 500 20px / 46px "Open Sans";
+  font: 500 20px / 46px "Open Sans", sans-serif;
   text-align: center;
   text-overflow: clip;
   -webkit-transition: all 280ms cubic-bezier(0.4, 0, 0.2, 1);
@@ -10809,7 +10809,7 @@ a.waves-effect .waves-ripple {
   position: absolute;
   color: #fff;
   z-index: 2020;
-  font: 400 22px / 32px "Open Sans";
+  font: 400 22px / 32px "Open Sans", sans-serif;
   -webkit-transition: opacity 400ms cubic-bezier(0.42, 0, 0.58, 1);
   transition: opacity 400ms cubic-bezier(0.42, 0, 0.58, 1);
 }
@@ -12166,13 +12166,13 @@ a.editable-click.editable-disabled:hover {
 }
 @media only screen and (max-width: 767px) {
   #sidebar_main {
-    width: 360px;
+    width: 280px;
-    -webkit-transform: translate3d(-360px, 0, 0);
+    -webkit-transform: translate3d(-280px, 0, 0);
-    transform: translate3d(-360px, 0, 0);
+    transform: translate3d(-280px, 0, 0);
   }
 }
 #sidebar_main .menu_section .menu_heading {
-  font: 400 12px / 16px "Open Sans";
+  font: 400 12px / 16px "Open Sans", sans-serif;
   margin: 0 0 12px;
   padding: 6px 6px 12px;
   border-bottom: 1px solid rgba(0, 0, 0, 0.12);
@@ -12190,7 +12190,7 @@ a.editable-click.editable-disabled:hover {
   list-style: none;
 }
 #sidebar_main .menu_section > ul > li > a {
-  font: 500 14px / 25px "Open Sans";
+  font: 500 14px / 25px "Open Sans", sans-serif;
   color: #212121;
   padding: 8px 20px;
   display: block;
@@ -12246,7 +12246,7 @@ a.editable-click.editable-disabled:hover {
 #sidebar_main .menu_section > ul > li ul a {
   padding: 8px 10px 8px 72px;
   display: block;
-  font: 400 13px / 18px "Open Sans";
+  font: 400 13px / 18px "Open Sans", sans-serif;
   color: #212121;
 }
 @media only screen and (max-width: 767px) {
@@ -12918,7 +12918,7 @@ a.editable-click.editable-disabled:hover {
   min-height: 81px;
 }
 #page_heading h1 {
-  font: 500 22px / 28px "Open Sans";
+  font: 500 22px / 28px "Open Sans", sans-serif;
   margin: 0;
 }
 #page_heading .heading_actions {
@@ -13969,7 +13969,7 @@ a.editable-click.editable-disabled:hover {
   font-size: 13px;
   padding: 8px;
   max-height: 80px;
-  font: 400 13px / 16px "Open Sans";
+  font: 400 13px / 16px "Open Sans", sans-serif;
   resize: none;
   word-wrap: break-word;
   -webkit-box-sizing: border-box;
@@ -13997,7 +13997,7 @@ a.editable-click.editable-disabled:hover {
   height: 200px;
 }
 .blog_list_teaser_title {
-  font: 400 18px / 24px "Open Sans";
+  font: 400 18px / 24px "Open Sans", sans-serif;
   margin: 0 0 8px;
 }
 .blog_list_teaser p {
@@ -14065,7 +14065,7 @@ a.editable-click.editable-disabled:hover {
   background-color: #fff;
 }
 .gallery_grid_image_caption .gallery_image_title {
-  font: 500 14px / 20px "Open Sans";
+  font: 500 14px / 20px "Open Sans", sans-serif;
   margin: 0;
 }
 .gallery_grid_image_menu {
@@ -14475,7 +14475,7 @@ a.editable-click.editable-disabled:hover {
   list-style: none;
 }
 .search_list_heading {
-  font: 400 18px / 22px "Open Sans";
+  font: 400 18px / 22px "Open Sans", sans-serif;
   margin: 0 0 2px;
 }
 .search_list_link {
@@ -14654,7 +14654,7 @@ html {
 }
 body {
   min-height: 100%;
-  font: 400 14px / 1.42857143 "Open Sans";
+  font: 400 14px / 1.42857143 "Open Sans", sans-serif;
   padding-top: 48px;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
@@ -14735,7 +14735,7 @@ h6 {
 }
 .heading_a {
   margin: 0;
-  font: 400 18px / 24px "Open Sans";
+  font: 400 18px / 24px "Open Sans", sans-serif;
 }
 .heading_a .sub-heading {
   font-weight: 300;
@@ -14746,7 +14746,7 @@ h6 {
 }
 .heading_b {
   margin: 0;
-  font: 400 22px / 28px "Open Sans";
+  font: 400 22px / 28px "Open Sans", sans-serif;
 }
 .heading_b .sub-heading {
   font-weight: 300;
@@ -14757,7 +14757,7 @@ h6 {
 }
 .heading_c {
   margin: 0;
-  font: 400 16px / 20px "Open Sans";
+  font: 400 16px / 20px "Open Sans", sans-serif;
 }
 .heading_c .sub-heading {
   font-weight: 300;
@@ -14768,7 +14768,7 @@ h6 {
 }
 .heading_list {
   color: #727272;
-  font: 500 13px / 16px "Open Sans";
+  font: 500 13px / 16px "Open Sans", sans-serif;
   padding: 0 16px;
   margin: 0 0 16px;
 }

src/assets/theme-assets/dashboard-custom.css

@@ -41,6 +41,10 @@ html .dashboard {
   flex: 1;
 }
 
+.dashboard #sidebar_main .menu_footer {
+  height: auto;
+}
+
 .dashboard .header_full #sidebar_main .sidebar_main_header {
   min-height: auto;
 }