From d2543181e77d5577c4bd7ce2911515c5d4b3dbcd Mon Sep 17 00:00:00 2001
From: "k.triantafyllou" <k.triantafyllou@di.uoa.gr>
Date: Wed, 22 Mar 2023 17:54:54 +0200
Subject: [PATCH] 1. Input: Change default class to flat. 2. Monify icon in
 sidebar-mobile-toggle. 3. Align mobile sidebar items base on main menu.

---
 .../sidebar/sideBar.component.html                 | 14 +++++++++-----
 .../sidebar-mobile-toggle.component.ts             |  6 +++---
 sharedComponents/input/input.component.ts          |  2 +-
 3 files changed, 13 insertions(+), 9 deletions(-)

diff --git a/dashboard/sharedComponents/sidebar/sideBar.component.html b/dashboard/sharedComponents/sidebar/sideBar.component.html
index ad3f6fe9..5a4ab978 100644
--- a/dashboard/sharedComponents/sidebar/sideBar.component.html
+++ b/dashboard/sharedComponents/sidebar/sideBar.component.html
@@ -5,10 +5,14 @@
 </aside>
 <div class="uk-hidden@m">
   <div id="sidebar_offcanvas" #sidebar_offcanvas [attr.uk-offcanvas]="'overlay: true'">
-    <div class="uk-offcanvas-bar uk-padding-remove-horizontal">
-      <button class="uk-offcanvas-close uk-icon uk-close">
-        <icon name="close" ratio="1.5" visuallyHidden="close menu"></icon>
-      </button>
+    <div class="uk-offcanvas-bar uk-padding-remove">
+      <nav class="uk-navbar uk-background-default" uk-sticky>
+        <div class="uk-navbar-right">
+          <button class="uk-navbar-toggle uk-icon uk-close" (click)="closeOffcanvas()">
+            <icon name="close" ratio="1.5" visuallyHidden="close menu"></icon>
+          </button>
+        </div>
+      </nav>
       <ng-container *ngTemplateOutlet="menu; context: {mobile: true}"></ng-container>
     </div>
   </div>
@@ -25,7 +29,7 @@
     </a>
   </div>
   <div *ngIf="items.length > 0" class="menu_section uk-margin-large-top" [class.mobile]="mobile" style="min-height: 30vh">
-    <ul #nav class="uk-list uk-nav uk-nav-parent-icon"
+    <ul #nav class="uk-list uk-nav uk-nav-parent-icon" [class.uk-list-large]="mobile"
         [class.uk-nav-default]="!mobile" [class.uk-nav-primary]="mobile" uk-nav="duration: 400">
       <ng-template ngFor [ngForOf]="items" let-item>
         <li [class.uk-active]="item.isActive"
diff --git a/dashboard/sharedComponents/sidebar/sidebar-mobile-toggle/sidebar-mobile-toggle.component.ts b/dashboard/sharedComponents/sidebar/sidebar-mobile-toggle/sidebar-mobile-toggle.component.ts
index 83882054..d996a400 100644
--- a/dashboard/sharedComponents/sidebar/sidebar-mobile-toggle/sidebar-mobile-toggle.component.ts
+++ b/dashboard/sharedComponents/sidebar/sidebar-mobile-toggle/sidebar-mobile-toggle.component.ts
@@ -5,16 +5,16 @@ import {Subscription} from "rxjs";
 @Component({
   selector: 'sidebar-mobile-toggle',
   template: `
-    <a *ngIf="activeSidebarItem" href="#sidebar_offcanvas" class="sidebar_mobile_toggle uk-link-reset uk-width-2-3 uk-flex uk-flex-middle" uk-toggle>
+    <a *ngIf="activeSidebarItem" href="#sidebar_offcanvas" class="sidebar_mobile_toggle uk-link-reset uk-width-3-5 uk-flex uk-flex-middle" uk-toggle>
       <div *ngIf="activeSidebarItem.icon && (activeSidebarItem.icon.svg || activeSidebarItem.icon.name)" class="uk-width-auto">
-        <icon class="menu-icon" [customClass]="activeSidebarItem.icon.class" [name]="activeSidebarItem.icon.name" ratio="0.9" [svg]="activeSidebarItem.icon.svg" [flex]="true"></icon>
+        <icon class="menu-icon" [customClass]="activeSidebarItem.icon.class" [name]="activeSidebarItem.icon.name" ratio="0.8" [svg]="activeSidebarItem.icon.svg" [flex]="true"></icon>
       </div>
       <span class="uk-width-expand uk-text-truncate uk-margin-small-left uk-text-bolder">
           {{activeSidebarItem.name}}
         <span *ngIf="activeSidebarItem.subItem">- {{activeSidebarItem.subItem.name}}</span>
       </span>
       <div class="uk-width-auto uk-margin-small-left">
-        <icon name="arrow_drop_down" ratio="1.5"  [flex]="true"></icon>
+        <icon name="arrow_right" ratio="1.4"  [flex]="true"></icon>
       </div>
     </a>
   `
diff --git a/sharedComponents/input/input.component.ts b/sharedComponents/input/input.component.ts
index bf6b2f09..1f25ab47 100644
--- a/sharedComponents/input/input.component.ts
+++ b/sharedComponents/input/input.component.ts
@@ -219,7 +219,7 @@ export class InputComponent implements OnInit, OnDestroy, AfterViewInit, OnChang
   public searchControl: UntypedFormControl;
   public activeElement: BehaviorSubject<ElementRef> = new BehaviorSubject<ElementRef>(null);
   /** Use modifier's class(es) to change view of your Input */
-  @Input() inputClass: string = 'inner';
+  @Input() inputClass: string = 'flat';
   /** Icon on the input */
   @Input() icon: string = null;
   /** Chip options */