OneIT module updated

frontend/angular/.angular-cli.json

@@ -9,7 +9,7 @@
             "outDir": "dist",
             "assets": [
                 "assets",
-        "favicon.ico"
+                "app/oneit/assets"
             ],
             "index": "index.html",
             "main": "main.ts",
@@ -19,13 +19,29 @@
             "testTsconfig": "tsconfig.spec.json",
             "prefix": "app",
             "styles": [
-        "styles.css"
+                "styles.css",
+                "../node_modules/primeng/resources/primeng.min.css",
+                "../node_modules/font-awesome/css/font-awesome.min.css",
+                "../node_modules/fullcalendar/dist/fullcalendar.min.css",
+                "../node_modules/quill/dist/quill.snow.css",
+                "../node_modules/primeicons/primeicons.css"
+            ],
+            "scripts": [
+                "../node_modules/jquery/dist/jquery.js",
+                "../node_modules/jquery-ui-dist/jquery-ui.js",
+                "../node_modules/moment/moment.js",
+                "../node_modules/chart.js/dist/Chart.js",
+                "../node_modules/fullcalendar/dist/fullcalendar.js",
+                "../node_modules/quill/dist/quill.js",
+                "../src/app/oneit/components/feedback/scripts/feedback.js",
+                "../src/app/oneit/components/feedback/scripts/html2canvas.js"
             ],
-      "scripts": [],
             "environmentSource": "environments/environment.ts",
             "environments": {
                 "dev": "environments/environment.ts",
-        "prod": "environments/environment.prod.ts"
+                "qa": "environments/environment.qa.ts",
+                "uat": "environments/environment.uat.ts",
+                "production": "environments/environment.prod.ts"
             }
         }
     ],

frontend/angular/package.json

@@ -21,14 +21,35 @@
         "@angular/platform-browser": "^5.2.0",
         "@angular/platform-browser-dynamic": "^5.2.0",
         "@angular/router": "^5.2.0",
+        "bootstrap": "^4.1.0",
+        "chart.js": "2.7.1",
         "core-js": "^2.4.1",
+        "file-saver": "^1.3.8",
+        "flatted": "^1.0.2",
+        "font-awesome": "4.7.0",
+        "fullcalendar": "3.5.1",
+        "iframe-resizer": "^3.6.1",
+        "intl": "1.2.5",
+        "jquery": "3.2.1",
+        "jquery-ui-dist": "^1.12.1",
+        "marked": "^0.5.1",
+        "moment": "2.18.1",
+        "nanoscroller": "^0.8.7",
+        "ng2-bootstrap": "^1.6.3",
+        "ngx-bootstrap": "^2.0.4",
+        "primeicons": "^1.0.0-beta.10",
+        "primeng": "6.1.5",
+        "quill": "^1.3.5",
         "rxjs": "^5.5.6",
+        "save": "^2.3.2",
+        "web-animations-js": "2.3.1",
         "zone.js": "^0.8.19"
     },
     "devDependencies": {
         "@angular/cli": "~1.7.4",
         "@angular/compiler-cli": "^5.2.0",
         "@angular/language-service": "^5.2.0",
+        "@types/iframe-resizer": "3.5.6",
         "@types/jasmine": "~2.8.3",
         "@types/jasminewd2": "~2.0.2",
         "@types/node": "~6.0.60",
@@ -43,6 +64,6 @@
         "protractor": "~5.1.2",
         "ts-node": "~4.1.0",
         "tslint": "~5.9.1",
-    "typescript": "~2.5.3"
+        "typescript": "~2.6.2"
     }
 }

frontend/angular/src/app/app.component.html

-<!--The content below is only a placeholder and can be replaced.-->
-<div style="text-align:center">
-  <h1>
-    Welcome to {{ title }}!
-  </h1>
-  <img width="300" alt="Angular Logo" src="data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyNTAgMjUwIj4KICAgIDxwYXRoIGZpbGw9IiNERDAwMzEiIGQ9Ik0xMjUgMzBMMzEuOSA2My4ybDE0LjIgMTIzLjFMMTI1IDIzMGw3OC45LTQzLjcgMTQuMi0xMjMuMXoiIC8+CiAgICA8cGF0aCBmaWxsPSIjQzMwMDJGIiBkPSJNMTI1IDMwdjIyLjItLjFWMjMwbDc4LjktNDMuNyAxNC4yLTEyMy4xTDEyNSAzMHoiIC8+CiAgICA8cGF0aCAgZmlsbD0iI0ZGRkZGRiIgZD0iTTEyNSA1Mi4xTDY2LjggMTgyLjZoMjEuN2wxMS43LTI5LjJoNDkuNGwxMS43IDI5LjJIMTgzTDEyNSA1Mi4xem0xNyA4My4zaC0zNGwxNy00MC45IDE3IDQwLjl6IiAvPgogIDwvc3ZnPg==">
-</div>
-<h2>Here are some links to help you start: </h2>
-<ul>
-  <li>
-    <h2><a target="_blank" rel="noopener" href="https://angular.io/tutorial">Tour of Heroes</a></h2>
-  </li>
-  <li>
-    <h2><a target="_blank" rel="noopener" href="https://github.com/angular/angular-cli/wiki">CLI Documentation</a></h2>
-  </li>
-  <li>
-    <h2><a target="_blank" rel="noopener" href="https://blog.angular.io/">Angular blog</a></h2>
-  </li>
-</ul>
-

frontend/angular/src/app/app.component.spec.ts

-import { TestBed, async } from '@angular/core/testing';
-import { AppComponent } from './app.component';
-describe('AppComponent', () => {
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [
-        AppComponent
-      ],
-    }).compileComponents();
-  }));
-  it('should create the app', async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.debugElement.componentInstance;
-    expect(app).toBeTruthy();
-  }));
-  it(`should have as title 'app'`, async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    const app = fixture.debugElement.componentInstance;
-    expect(app.title).toEqual('app');
-  }));
-  it('should render title in a h1 tag', async(() => {
-    const fixture = TestBed.createComponent(AppComponent);
-    fixture.detectChanges();
-    const compiled = fixture.debugElement.nativeElement;
-    expect(compiled.querySelector('h1').textContent).toContain('Welcome to app!');
-  }));
-});

frontend/angular/src/app/app.component.ts

-import { Component } from '@angular/core';
+import {Component, OnDestroy, Renderer, OnInit, NgZone} from '@angular/core';
 
 @Component({
-  selector: 'app-root',
-  templateUrl: './app.component.html',
-  styleUrls: ['./app.component.css']
+    selector: 'body',
+    template: '<router-outlet></router-outlet>'
 })
 export class AppComponent {
-  title = 'app';
+
 }

frontend/angular/src/app/app.module.ts

-import { BrowserModule } from '@angular/platform-browser';
 import { NgModule } from '@angular/core';
+import { FormBuilder } from '@angular/forms';
 
+import { ConfirmationService } from 'primeng/primeng';
 
 import { AppComponent } from './app.component';
+import { AppRoutingModule } from './app.routing';
+
+import { FullLayoutComponent } from './oneit/components/full-layout/full-layout.component';
+import { OneITModule } from './oneit/oneit.module';
 
 
 @NgModule({
+    imports: [
+        AppRoutingModule,
+        OneITModule
+    ],
     declarations: [
-    AppComponent
+        AppComponent,
+        FullLayoutComponent
     ],
-  imports: [
-    BrowserModule
+    providers: [
+        FormBuilder,
+        ConfirmationService,
     ],
-  providers: [],
     bootstrap: [AppComponent]
 })
-export class AppModule { }
+
+export class AppModule {
+    constructor() {
+
+    }
+}
\ No newline at end of file

frontend/angular/src/app/app.routing.ts

+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+
+import { AccessDeniedComponent } from './oneit/components/access-denied/access-denied.component';
+import { FullLayoutComponent } from './oneit/components/full-layout/full-layout.component';
+import { HomeComponent } from './oneit/components/home/home.component';
+import { IframePageComponent } from './oneit/components/iframe-page/iframe-page.component';
+
+import { AuthGuard } from './oneit/guards/auth.guard';
+
+
+export const routes: Routes = [
+    {
+        path: '',
+        redirectTo: 'home',
+        pathMatch: 'full',
+    },
+    {
+        path: '',
+        component: FullLayoutComponent,
+        data: {
+            showDefaultHeader: true,
+            showDefaultFooter: true,
+            showMenu: true,
+            showFeedback: true
+        },
+        children: [
+            {
+                path: 'access-denied',
+                component: AccessDeniedComponent
+            },
+            {
+                path: 'home',
+                canActivate: [AuthGuard],
+                component: HomeComponent
+            },
+            {
+                path: 'iframe-page/:url',
+                canActivate: [AuthGuard],
+                component: IframePageComponent,
+                runGuardsAndResolvers: 'always'
+            }
+            // Project ROUTES will appear here, serach-client added for example
+            // {
+            //     path: 'search-client',
+            //     component: SearchClientComponent,
+            //     canActivate: [AuthGuard],
+            //     data: {privs: [Constants.PRIV_SALES_MANAGER, Constants.PRIV_READ_ONLY]}
+            // }
+        ]
+    },
+    // CUSTOM HEADER Example e.g. Public Page
+    // {
+    //     path: '',
+    //     component: FullLayoutComponent,
+    //     data: {
+    //         defaultFooter : false,
+    //         defaultHeader: false,
+    //         customHeader: CustomHeaderComponent
+    //     },
+    //     children: [
+    //         {
+    //             path: 'publicPage',
+    //             component: PublicPageComponent
+    //         }
+    //     ]
+    // }
+    // Don't forget to add below line in app.module.ts
+    // entryComponents: [CustomHeaderComponent],
+];
+
+@NgModule({
+    imports: [RouterModule.forRoot(routes, { useHash: true, onSameUrlNavigation: 'reload' })],
+    exports: [RouterModule]
+})
+export class AppRoutingModule { }

frontend/angular/src/app/oneit/assets/layout/css/layout-amber.scss

+/* Sidebar */
+$sidebarLogoBgColor:#FFB300;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#FFB300;
+$primaryDarkColor:#FF8F00;
+$primaryLightColor:#FFD54F;
+$primaryLightestColor:#FFF8E1;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#E91E63;
+$accentLightColor:#F06292;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#622b00;
+$topbarIconColor:#622b00;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#FFB300;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#FFB300;
+$subMenuitemActiveIconTextColor:#FFB300;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#FFD54F;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#FFB300;
+$darkMenuitemActiveTextColor:#622b00;
+$darkMenuitemActiveIconTextColor:#622b00;
+$darksubMenuitemActiveTextColor:#FFD54F;
+$darksubMenuitemActiveIconTextColor:#FFD54F;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-blue.scss

+/* Sidebar */
+$sidebarLogoBgColor:#1565C0;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#1E88E5;
+$primaryDarkColor:#1565C0;
+$primaryLightColor:#64B5F6;
+$primaryLightestColor:#E3F2FD;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#FFC107;
+$accentLightColor:#FFD54F;
+$accentTextColor:#212121;
+
+/* Topbar */
+$topbarTextColor:#E3F2FD;
+$topbarIconColor:#E3F2FD;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#1E88E5;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#1E88E5;
+$subMenuitemActiveIconTextColor:#1E88E5;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#64B5F6;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#64B5F6;
+$darksubMenuitemActiveIconTextColor:#64B5F6;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-bluegrey.scss

+/* Sidebar */
+$sidebarLogoBgColor:#455A64;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#607D8B;
+$primaryDarkColor:#455A64;
+$primaryLightColor:#90A4AE;
+$primaryLightestColor:#ECEFF1;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#4CAF50;
+$accentLightColor:#81C784;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#ECEFF1;
+$topbarIconColor:#ECEFF1;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#607D8B;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#607D8B;
+$subMenuitemActiveIconTextColor:#607D8B;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#90A4AE;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#90A4AE;
+$darksubMenuitemActiveIconTextColor:#90A4AE;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-brown.scss

+/* Sidebar */
+$sidebarLogoBgColor:#5D4037;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#795548;
+$primaryDarkColor:#5D4037;
+$primaryLightColor:#A1887F;
+$primaryLightestColor:#EFEBE9;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#00BCD4;
+$accentLightColor:#4DD0E1;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#EFEBE9;
+$topbarIconColor:#EFEBE9;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#795548;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#795548;
+$subMenuitemActiveIconTextColor:#795548;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#A1887F;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#A1887F;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#BCAAA4;
+$darksubMenuitemActiveIconTextColor:#BCAAA4;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-cityscape.scss

+/* Sidebar */
+$sidebarLogoBgColor:transparent;
+$sidebarBgColor:#c16b69;
+$darkSidebarBgColor:#5a3c44;
+$menuBgImageLight:'bg-cityscape-light.png';
+$menuBgImageDark:'bg-cityscape-dark.png';
+$horizontalMenuBgImageLight:'bg-cityscape-light-horizontal.png';
+$horizontalMenuBgImageDark:'bg-cityscape-dark-horizontal.png';
+$horizontalMenuBgColor:#46181A;
+$horizontalDarkMenuBgColor:#261012;
+
+/* Primary */
+$primaryColor:#E64A19;
+$primaryDarkColor:#BF360C;
+$primaryLightColor:#FF7043;
+$primaryLightestColor:#FBE9E7;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#009688;
+$accentLightColor:#4DB6AC;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#FBE9E7;
+$topbarIconColor:#FBE9E7;
+
+/* Submenu */
+$submenuBgColor:rgba(0,0,0,0.3);
+$darkSubmenuBgColor:rgba(255,255,255,0.15);
+$horizontalSubmenuBgColor:#2D1414;
+$horizontalDarkSubmenuBgColor:#1C0E0F;
+$horizontalSubmenuitemHoverBgColor:rgba(255, 255, 255, 0.5);
+$horizontalSubmenuitemDarkHoverBgColor:rgba(255, 255, 255, 0.3);
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#ffffff;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#ffffff;
+$menuitemIconTextColor:#ffffff;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:rgba(255,255,255,0.5);
+$menuitemHoverTextColor:#212c2a;
+$menuitemHoverIconTextColor:#212c2a;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:rgba(255,255,255,0.65);
+$menuitemActiveTextColor:#212c2a;
+$menuitemActiveIconTextColor:#212c2a;
+$subMenuitemActiveTextColor:#4DB6AC;
+$subMenuitemActiveIconTextColor:#4DB6AC;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:rgba(255,255,255,0.3);
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:rgba(255,255,255,0.5);
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#4DB6AC;
+$darksubMenuitemActiveIconTextColor:#4DB6AC;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-cloudy.scss

+/* Sidebar */
+$sidebarLogoBgColor:transparent;
+$sidebarBgColor:#00bab8;
+$darkSidebarBgColor:#003e3d;
+$menuBgImageLight:'bg-cloudy-light.png';
+$menuBgImageDark:'bg-cloudy-dark.png';
+$horizontalMenuBgImageLight:'bg-cloudy-light-horizontal.png';
+$horizontalMenuBgImageDark:'bg-cloudy-dark-horizontal.png';
+$horizontalMenuBgColor:#003f63;
+$horizontalDarkMenuBgColor:#001928;
+
+/* Primary */
+$primaryColor:#009688;
+$primaryDarkColor:#00796B;
+$primaryLightColor:#4DB6AC;
+$primaryLightestColor:#E0F2F1;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#FF9800;
+$accentLightColor:#FFB74D;
+$accentTextColor:#212121;
+
+/* Topbar */
+$topbarTextColor:#E0F2F1;
+$topbarIconColor:#E0F2F1;
+
+/* Submenu */
+$submenuBgColor:rgba(0,0,0,0.4);
+$darkSubmenuBgColor:rgba(255,255,255,0.1);
+$horizontalSubmenuBgColor:#00617d;
+$horizontalDarkSubmenuBgColor:#002630;
+$horizontalSubmenuitemHoverBgColor:rgba(255, 255, 255, 0.3);
+$horizontalSubmenuitemDarkHoverBgColor:rgba(255, 255, 255, 0.3);
+$horizontalSubmenuitemDarkHoverTextColor:#e0f2f1;
+$horizontalMenuActiveTextColor:#009688;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#ffffff;
+$menuitemIconTextColor:#ffffff;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:rgba(255,255,255,0.7);
+$menuitemHoverTextColor:#00796B;
+$menuitemHoverIconTextColor:#00796B;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#ffffff;
+$menuitemActiveTextColor:#00796B;
+$menuitemActiveIconTextColor:#00796B;
+$subMenuitemActiveTextColor:#FFB74D;
+$subMenuitemActiveIconTextColor:#FFB74D;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:rgba(255,255,255,0.3);
+$darkMenuitemHoverTextColor:#E0F2F1;
+$darkMenuitemHoverIconTextColor:#E0F2F1;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:rgba(255,255,255,0.9);
+$darkMenuitemActiveTextColor:#00796B;
+$darkMenuitemActiveIconTextColor:#00796B;
+$darksubMenuitemActiveTextColor:#FFB74D;
+$darksubMenuitemActiveIconTextColor:#FFB74D;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-cyan.scss

+/* Sidebar */
+$sidebarLogoBgColor:#0097A7;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#00BCD4;
+$primaryDarkColor:#0097A7;
+$primaryLightColor:#4DD0E1;
+$primaryLightestColor:#E0F7FA;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#FFC107;
+$accentLightColor:#FFD54F;
+$accentTextColor:#212121;
+
+/* Topbar */
+$topbarTextColor:#E0F7FA;
+$topbarIconColor:#E0F7FA;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#00BCD4;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#00BCD4;
+$subMenuitemActiveIconTextColor:#00BCD4;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#4DD0E1;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#4DD0E1;
+$darksubMenuitemActiveIconTextColor:#4DD0E1;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-deeporange.scss

+/* Sidebar */
+$sidebarLogoBgColor:#BF360C;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#F4511E;
+$primaryDarkColor:#BF360C;
+$primaryLightColor:#FF8A65;
+$primaryLightestColor:#FBE9E7;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#00BCD4;
+$accentLightColor:#4DD0E1;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#FBE9E7;
+$topbarIconColor:#FBE9E7;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#F4511E;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#F4511E;
+$subMenuitemActiveIconTextColor:#F4511E;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#FF8A65;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#FF8A65;
+$darksubMenuitemActiveIconTextColor:#FF8A65;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-deeppurple.scss

+/* Sidebar */
+$sidebarLogoBgColor:#512DA8;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#5E35B1;
+$primaryDarkColor:#512DA8;
+$primaryLightColor:#9575CD;
+$primaryLightestColor:#EDE7F6;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#FF9800;
+$accentLightColor:#FFB74D;
+$accentTextColor:#212121;
+
+/* Topbar */
+$topbarTextColor:#EDE7F6;
+$topbarIconColor:#EDE7F6;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#5E35B1;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#5E35B1;
+$subMenuitemActiveIconTextColor:#5E35B1;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#9575CD;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#9575CD;
+$darksubMenuitemActiveIconTextColor:#9575CD;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-flatiron.scss

+/* Sidebar */
+$sidebarLogoBgColor:transparent;
+$sidebarBgColor:#566e87;
+$darkSidebarBgColor:#202d35;
+$menuBgImageLight:'bg-flatiron-light.png';
+$menuBgImageDark:'bg-flatiron-dark.png';
+$horizontalMenuBgImageLight:'bg-flatiron-light-horizontal.png';
+$horizontalMenuBgImageDark:'bg-flatiron-dark-horizontal.png';
+$horizontalMenuBgColor:#415c7c;
+$horizontalDarkMenuBgColor:#1a2532;
+
+/* Primary */
+$primaryColor:#607D8B;
+$primaryDarkColor:#455A64;
+$primaryLightColor:#90A4AE;
+$primaryLightestColor:#ECEFF1;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#4CAF50;
+$accentLightColor:#81C784;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#ECEFF1;
+$topbarIconColor:#ECEFF1;
+
+/* Submenu */
+$submenuBgColor:rgba(0,0,0,0.2);
+$darkSubmenuBgColor:rgba(255,255,255,0.15);
+$horizontalSubmenuBgColor:#415c7c;
+$horizontalDarkSubmenuBgColor:#1a2532;
+$horizontalSubmenuitemHoverBgColor:#1e282c;
+$horizontalSubmenuitemDarkHoverBgColor:rgba(255,255,255,0.3);
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#ffffff;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#ffffff;
+$menuitemIconTextColor:#ffffff;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#1e282c;
+$menuitemHoverTextColor:#ffffff;
+$menuitemHoverIconTextColor:#ffffff;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#4CAF50;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#81C784;
+$subMenuitemActiveIconTextColor:#81C784;
+
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#566e87;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#4CAF50;
+$darkMenuitemActiveTextColor:#212121;
+$darkMenuitemActiveIconTextColor:#212121;
+$darksubMenuitemActiveTextColor:#81C784;
+$darksubMenuitemActiveIconTextColor:#81C784;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-green.scss

+/* Sidebar */
+$sidebarLogoBgColor:#2E7D32;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#43A047;
+$primaryDarkColor:#2E7D32;
+$primaryLightColor:#81C784;
+$primaryLightestColor:#E8F5E9;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#6D4C41;
+$accentLightColor:#8D6E63;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#E8F5E9;
+$topbarIconColor:#E8F5E9;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#43A047;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#43A047;
+$subMenuitemActiveIconTextColor:#43A047;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#81C784;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#81C784;
+$darksubMenuitemActiveIconTextColor:#81C784;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-grey.scss

+/* Sidebar */
+$sidebarLogoBgColor:#424242;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#757575;
+$primaryDarkColor:#424242;
+$primaryLightColor:#BDBDBD;
+$primaryLightestColor:#FAFAFA;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#3F51B5;
+$accentLightColor:#7986CB;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#FAFAFA;
+$topbarIconColor:#FAFAFA;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#757575;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#757575;
+$subMenuitemActiveIconTextColor:#757575;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#7986CB;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#7986CB;
+$darksubMenuitemActiveIconTextColor:#7986CB;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-indigo.scss

+/* Sidebar */
+$sidebarLogoBgColor:#283593;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#3f51b5;
+$primaryDarkColor:#283593;
+$primaryLightColor:#9fa8da;
+$primaryLightestColor:#e8eaf6;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#E91E63;
+$accentLightColor:#f48fb1;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#e8eaf6;
+$topbarIconColor:#e8eaf6;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#878787;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#3f51b5;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#3f51b5;
+$subMenuitemActiveIconTextColor:#3f51b5;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#3f51b5;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#9fa8da;
+$darksubMenuitemActiveIconTextColor:#9fa8da;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-lightblue.scss

+/* Sidebar */
+$sidebarLogoBgColor:#0288D1;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#03A9F4;
+$primaryDarkColor:#0288D1;
+$primaryLightColor:#4FC3F7;
+$primaryLightestColor:#E1F5FE;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#607D8B;
+$accentLightColor:#90A4AE;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#E1F5FE;
+$topbarIconColor:#E1F5FE;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#03A9F4;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#03A9F4;
+$subMenuitemActiveIconTextColor:#03A9F4;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#0288D1;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#4FC3F7;
+$darksubMenuitemActiveIconTextColor:#4FC3F7;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-lightgreen.scss

+/* Sidebar */
+$sidebarLogoBgColor:#558B2F;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#7CB342;
+$primaryDarkColor:#558B2F;
+$primaryLightColor:#AED581;
+$primaryLightestColor:#F1F8E9;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#673AB7;
+$accentLightColor:#9575CD;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#F1F8E9;
+$topbarIconColor:#F1F8E9;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#7CB342;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#7CB342;
+$subMenuitemActiveIconTextColor:#7CB342;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#AED581;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#AED581;
+$darksubMenuitemActiveIconTextColor:#AED581;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-lime.scss

+/* Sidebar */
+$sidebarLogoBgColor:#9E9D24;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#C0CA33;
+$primaryDarkColor:#9E9D24;
+$primaryLightColor:#DCE775;
+$primaryLightestColor:#F9FBE7;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#607D8B;
+$accentLightColor:#90A4AE;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#2f2b08;
+$topbarIconColor:#2f2b08;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#9E9D24;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#AFB42B;
+$subMenuitemActiveIconTextColor:#AFB42B;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#DCE775;
+$darkMenuitemActiveTextColor:#212121;
+$darkMenuitemActiveIconTextColor:#212121;
+$darksubMenuitemActiveTextColor:#DCE775;
+$darksubMenuitemActiveIconTextColor:#DCE775;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-moody.scss

+/* Sidebar */
+$sidebarLogoBgColor:rgba(36,50,59,0.5);
+$sidebarBgColor:#566e87;
+$darkSidebarBgColor:#202d35;
+$menuBgImageLight:'bg-moody-light.png';
+$menuBgImageDark:'bg-moody-dark.png';
+$horizontalMenuBgImageLight:'bg-moody-light-horizontal.png';
+$horizontalMenuBgImageDark:'bg-moody-dark-horizontal.png';
+$horizontalMenuBgColor:#080A10;
+$horizontalDarkMenuBgColor:#0A1118;
+
+/* Primary */
+$primaryColor:#607D8B;
+$primaryDarkColor:#496475;
+$primaryLightColor:#90A4AE;
+$primaryLightestColor:#E8EAF6;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#7CB342;
+$accentLightColor:#9CCC65;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#E8EAF6;
+$topbarIconColor:#E8EAF6;
+
+/* Submenu */
+$submenuBgColor:rgba(255,255,255,0.2);
+$darkSubmenuBgColor:rgba(255,255,255,0.15);
+$horizontalSubmenuBgColor:#2b3d4c;
+$horizontalDarkSubmenuBgColor:#0e161e;
+$horizontalSubmenuitemHoverBgColor: rgba(255, 255, 255, 0.4);
+$horizontalSubmenuitemDarkHoverBgColor: rgba(255, 255, 255, 0.4);
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#ffffff;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#ffffff;
+$menuitemIconTextColor:#ffffff;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:rgba(0,0,0,0.4);
+$menuitemHoverTextColor:#ffffff;
+$menuitemHoverIconTextColor:#ffffff;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#7CB342;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#9CCC65;
+$subMenuitemActiveIconTextColor:#9CCC65;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#rgba(255,255,255,0.4);
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#7CB342;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#9CCC65;
+$darksubMenuitemActiveIconTextColor:#9CCC65;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-oneit.scss

+
+$brandPrimary:#005599;
+$brandSecondary:#F7B14F;
+
+@import '../../../../../assets/css/variables-override';
+
+$primaryColor:$brandPrimary;
+$primaryDarkColor:darken($primaryColor, 10%);
+$primaryLightColor: lighten($primaryColor, 10%);
+$primaryLightestColor:lighten($primaryColor, 20%);
+$primaryTextColor:#ffffff;
+$accentColor:$brandSecondary;
+$accentDarkColor: darken($accentColor, 10%);
+$accentLightColor: lighten($accentColor, 10%);;
+$accentTextColor: #ffffff;
+
+/* Sidebar */
+$sidebarLogoBgColor:rgba(36,50,59,0.5);
+$sidebarBgColor:#566e87;
+$darkSidebarBgColor:#202d35;
+$menuBgImageLight:'bg-moody-light.png';
+$menuBgImageDark:'bg-moody-dark.png';
+$horizontalMenuBgImageLight:'bg-moody-light-horizontal.png';
+$horizontalMenuBgImageDark:'bg-moody-dark-horizontal.png';
+$horizontalMenuBgColor:#080A10;
+$horizontalDarkMenuBgColor:#0A1118;
+
+/* Topbar */
+$topbarTextColor:#212121;
+$topbarIconColor:#212121;
+
+/* Submenu */
+$submenuBgColor: $accentColor;
+$darkSubmenuBgColor: $accentDarkColor;
+$horizontalSubmenuBgColor:#2b3d4c;
+$horizontalDarkSubmenuBgColor:#0e161e;
+$horizontalSubmenuitemHoverBgColor: rgba(255, 255, 255, 0.4);
+$horizontalSubmenuitemDarkHoverBgColor: rgba(255, 255, 255, 0.4);
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#ffffff;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#ffffff;
+$menuitemIconTextColor:#ffffff;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:rgba(0,0,0,0.4);
+$menuitemHoverTextColor:#ffffff;
+$menuitemHoverIconTextColor:#ffffff;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#7CB342;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#9CCC65;
+$subMenuitemActiveIconTextColor:#9CCC65;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#rgba(255,255,255,0.4);
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#7CB342;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#9CCC65;
+$darksubMenuitemActiveIconTextColor:#9CCC65;
+
+/* OneIT Variables */
+$topBgColor:#ffffff;
+$selectButtonBgColor:#ccc;
+$selectButtonColor:#888;
+$mobileBreakpointOverride:1024px;   //When this is overriden, don't forget to update config.json as well
+$toolbarBgColor:$primaryColor;
+
+@import '../../../../../assets/css/variables-override';
+
+@import '../../sass/theme/_theme';
+@import '../../sass/layout/_layout';
+@import 'layout-override';

frontend/angular/src/app/oneit/assets/layout/css/layout-orange.scss

+/* Sidebar */
+$sidebarLogoBgColor:#EF6C00;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#FB8C00;
+$primaryDarkColor:#EF6C00;
+$primaryLightColor:#FFB74D;
+$primaryLightestColor:#FFF3E0;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#5C6BC0;
+$accentLightColor:#7986CB;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#FFF3E0;
+$topbarIconColor:#FFF3E0;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#FB8C00;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#FB8C00;
+$subMenuitemActiveIconTextColor:#FB8C00;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#EF6C00;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#FFB74D;
+$darksubMenuitemActiveIconTextColor:#FFB74D;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-override.scss

+.layout-wrapper {
+    .layout-main {
+        .layout-topbar {
+            background-color: $topBgColor;
+            box-shadow: 0 0px 1px #888;
+        }
+    }
+}
+
+.ui-menuitem-link {
+    .fa {
+        color: $textColor !important;
+    }
+}
+
+.ui-toolbar {
+    background-color: $toolbarBgColor !important;
+    box-shadow: none !important;
+
+    .ui-toolbar-group-right {
+        .ui-button {
+            &:not(.ui-state-disabled):not(.secondary-btn):not(.ui-state-active){
+                background-color: $accentColor !important;
+                color: $accentTextColor !important;
+                .pi{
+                    color: $accentTextColor !important;
+                }
+            }
+            &:not(.ui-state-disabled):not(.secondary-btn):not(.ui-state-active):hover {
+                background-color: $accentDarkColor !important;
+            }
+        }
+
+        .secondary-btn {
+            &:enabled:not(:focus) {
+                background-color: $primaryLightColor !important;
+                color: $primaryTextColor !important;
+                .pi{
+                    color: $primaryTextColor !important;
+                }
+            }
+            &:enabled:not(:focus):hover {
+                background-color: $primaryDarkColor !important;
+            }
+        }
+    }
+}
+
+.ui-toolbar.ui-widget-header {
+    border-color: $toolbarBgColor !important;
+}
+
+.ui-toolbar-group-left {
+    font-size: 18px;
+    font-weight: bold;
+    line-height: 30px;
+}
+
+.layout-wrapper {
+    .layout-main {
+        .layout-footer {
+            padding: 0px 10px;
+        }
+    }
+}
+
+body {
+    .ui-tabview {
+        .ui-tabview-nav {
+            > li {
+                &.ui-state-active {
+                    a {
+                        font-weight: bold !important;
+                    }
+                }
+            }
+        }
+    }
+    .ui-button, .ui-datepicker-buttonpane > button {
+        -moz-box-shadow: none !important;
+        -webkit-box-shadow: none !important;
+        box-shadow: none !important;
+    }
+
+    .ui-chkbox {
+        .ui-chkbox-box {
+            &.ui-state-active {
+                .pi {
+                    color: $primaryTextColor;   //Because background color is Primary for Checkbox
+                }
+            }
+        }
+    }
+
+    .ui-selectbutton {
+        .ui-button {
+            background-color: $selectButtonBgColor !important;
+            color: $selectButtonColor !important;
+
+            &.ui-state-active{
+                background-color: $primaryColor !important;
+                color: $primaryTextColor !important;
+            }
+        }
+    }
+
+    .ui-widget-header:not(.ui-dataview-header) {
+        .ui-inputtext {
+            background-image: none;
+        }
+    }
+
+    .ui-paginator {
+        .ui-dropdown {
+            .ui-dropdown-trigger {
+                .pi {
+                    color: $primaryTextColor;
+                }
+            }
+        }
+    }
+}
+
+@media (max-width: $mobileBreakpoint) {
+    .topbar-menu{
+        max-height: calc(100vh - 100px);
+        overflow-y: auto;
+    }
+}
+
+@media (min-width: $mobileBreakpoint) {
+    .user-menu{
+        margin-left: 30px !important;
+    }
+
+    .user-menu > a > i {
+        font-size: 20px !important;
+    }
+
+    .active-topmenuitem ul {
+        max-height: calc(100vh - 100px);
+        overflow-y: auto;
+    }
+
+    .badge-icon {
+        font-size: 32px !important;
+    }
+}
\ No newline at end of file

frontend/angular/src/app/oneit/assets/layout/css/layout-palm.scss

+/* Sidebar */
+$sidebarLogoBgColor:transparent;
+$sidebarBgColor:#8d7489;
+$darkSidebarBgColor:#473744;
+$menuBgImageLight:'bg-palm-light.png';
+$menuBgImageDark:'bg-palm-dark.png';
+$horizontalMenuBgImageLight:'bg-palm-light-horizontal.png';
+$horizontalMenuBgImageDark:'bg-palm-dark-horizontal.png';
+$horizontalMenuBgColor:#2d345b;
+$horizontalDarkMenuBgColor:#121524;
+
+/* Primary */
+$primaryColor:#00BCD4;
+$primaryDarkColor:#0097A7;
+$primaryLightColor:#4DD0E1;
+$primaryLightestColor:#E0F7FA;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#E91E63;
+$accentLightColor:#F06292;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#E0F7FA;
+$topbarIconColor:#E0F7FA;
+
+/* Submenu */
+$submenuBgColor:rgba(0,0,0,0.3);
+$darkSubmenuBgColor:rgba(255,255,255,0.2);
+$horizontalSubmenuBgColor:#2d345b;
+$horizontalDarkSubmenuBgColor:#131524;
+$horizontalSubmenuitemHoverBgColor:rgba(255, 255, 255, 0.2);
+$horizontalSubmenuitemDarkHoverBgColor:rgba(255, 255, 255, 0.3);
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#ffffff;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#ffffff;
+$menuitemIconTextColor:#ffffff;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:rgba(255,255,255,0.2);
+$menuitemHoverTextColor:#ffffff;
+$menuitemHoverIconTextColor:#ffffff;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#0097A7;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#F06292;
+$subMenuitemActiveIconTextColor:#F06292;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:rgba(255,255,255,0.3);
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#4DD0E1;
+$darkMenuitemActiveTextColor:#212121;
+$darkMenuitemActiveIconTextColor:#212121;
+$darksubMenuitemActiveTextColor:#F06292;
+$darksubMenuitemActiveIconTextColor:#F06292;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-pink.scss

+/* Sidebar */
+$sidebarLogoBgColor:#AD1457;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#D81B60;
+$primaryDarkColor:#AD1457;
+$primaryLightColor:#F06292;
+$primaryLightestColor:#FCE4EC;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#FFC107;
+$accentLightColor:#FFD54F;
+$accentTextColor:#212121;
+
+/* Topbar */
+$topbarTextColor:#FCE4EC;
+$topbarIconColor:#FCE4EC;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#D81B60;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#D81B60;
+$subMenuitemActiveIconTextColor:#D81B60;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#F06292;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#F06292;
+$darksubMenuitemActiveIconTextColor:#F06292;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-purple.scss

+/* Sidebar */
+$sidebarLogoBgColor:#6A1B9A;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#8E24AA;
+$primaryDarkColor:#6A1B9A;
+$primaryLightColor:#BA68C8;
+$primaryLightestColor:#F3E5F5;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#E91E63;
+$accentLightColor:#F06292;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#F3E5F5;
+$topbarIconColor:#F3E5F5;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#8E24AA;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#8E24AA;
+$subMenuitemActiveIconTextColor:#8E24AA;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#BA68C8;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#BA68C8;
+$darksubMenuitemActiveIconTextColor:#BA68C8;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-reflection.scss

+/* Sidebar */
+$sidebarLogoBgColor:#283593;
+$sidebarBgColor:#bf1e88;
+$darkSidebarBgColor:#4f1257;
+$menuBgImageLight:'bg-reflection-light.png';
+$menuBgImageDark:'bg-reflection-dark.png';
+$horizontalMenuBgImageLight:'bg-reflection-light-horizontal.png';
+$horizontalMenuBgImageDark:'bg-reflection-dark-horizontal.png';
+$horizontalMenuBgColor:#991a78;
+$horizontalDarkMenuBgColor:#2C0A2E;
+
+/* Primary */
+$primaryColor:#3949AB;
+$primaryDarkColor:#283593;
+$primaryLightColor:#3F51B5;
+$primaryLightestColor:#E8EAF6;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#FFC107;
+$accentLightColor:#FFD54F;
+$accentTextColor:#212121;
+
+/* Topbar */
+$topbarTextColor:#E8EAF6;
+$topbarIconColor:#E8EAF6;
+
+/* Submenu */
+$submenuBgColor:rgba(255,255,255,0.2);
+$darkSubmenuBgColor:rgba(255,255,255,0.1);
+$horizontalSubmenuBgColor:#3D114D;
+$horizontalDarkSubmenuBgColor:#1c0523;
+$horizontalSubmenuitemHoverBgColor:rgba(255, 255, 255, 0.2);
+$horizontalSubmenuitemDarkHoverBgColor:rgba(255, 255, 255, 0.2);
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#ffffff;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#ffffff;
+$menuitemIconTextColor:#ffffff;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:rgba(255,255,255,0.2);
+$menuitemHoverTextColor:#ffffff;
+$menuitemHoverIconTextColor:#ffffff;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:rgba(255,255,255,0.4);
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#FFD54F;
+$subMenuitemActiveIconTextColor:#FFD54F;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#ffffff;
+$darkMenuitemIconTextColor:#ffffff;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:rgba(255,255,255,0.2);
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:rgba(255,255,255,0.4);
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#FFD54F;
+$darksubMenuitemActiveIconTextColor:#FFD54F;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-storm.scss

+/* Sidebar */
+$sidebarLogoBgColor:#4527A0;
+$sidebarBgColor:#8d7489;
+$darkSidebarBgColor:#473744;
+$menuBgImageLight:'bg-storm-light.png';
+$menuBgImageDark:'bg-storm-dark.png';
+$horizontalMenuBgImageLight:'bg-storm-light-horizontal.png';
+$horizontalMenuBgImageDark:'bg-storm-dark-horizontal.png';
+$horizontalMenuBgColor:#0b0710;
+$horizontalDarkMenuBgColor:#040306;
+
+/* Primary */
+$primaryColor:#5E35B1;
+$primaryDarkColor:#4527A0;
+$primaryLightColor:#7E57C2;
+$primaryLightestColor:#EDE7F6;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#00BCD4;
+$accentLightColor:#4DD0E1;
+$accentTextColor:#212121;
+
+/* Topbar */
+$topbarTextColor:#EDE7F6;
+$topbarIconColor:#EDE7F6;
+
+/* Submenu */
+$submenuBgColor:rgba(255,255,255,0.15);
+$darkSubmenuBgColor:rgba(255,255,255,0.15);
+$horizontalSubmenuBgColor:#140f1e;
+$horizontalDarkSubmenuBgColor:#08060a;
+$horizontalSubmenuitemHoverBgColor:rgba(255, 255, 255, 0.2);
+$horizontalSubmenuitemDarkHoverBgColor:rgba(255, 255, 255, 0.2);
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#ffffff;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#ffffff;
+$menuitemIconTextColor:#ffffff;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:rgba(255,255,255,0.2);
+$menuitemHoverTextColor:#ffffff;
+$menuitemHoverIconTextColor:#ffffff;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#5E35B1;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#4DD0E1;
+$subMenuitemActiveIconTextColor:#4DD0E1;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:rgba(255,255,255,0.2);
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#5E35B1;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#4DD0E1;
+$darksubMenuitemActiveIconTextColor:#4DD0E1;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-teal.scss

+/* Sidebar */
+$sidebarLogoBgColor:#00796B;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#009688;
+$primaryDarkColor:#00796B;
+$primaryLightColor:#4DB6AC;
+$primaryLightestColor:#E0F2F1;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#F44336;
+$accentLightColor:#E57373;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#E0F2F1;
+$topbarIconColor:#E0F2F1;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#009688;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#009688;
+$subMenuitemActiveIconTextColor:#009688;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#009688;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#4DB6AC;
+$darksubMenuitemActiveIconTextColor:#4DB6AC;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/css/layout-yellow.scss

+/* Sidebar */
+$sidebarLogoBgColor:#F9A825;
+$sidebarBgColor:#ffffff;
+$darkSidebarBgColor:#424242;
+
+/* Primary */
+$primaryColor:#FBC02D;
+$primaryDarkColor:#F9A825;
+$primaryLightColor:#FFEE58;
+$primaryLightestColor:#FFFDE7;
+$primaryTextColor:#ffffff;
+
+/* Accent */
+$accentColor:#009688;
+$accentLightColor:#4DB6AC;
+$accentTextColor:#ffffff;
+
+/* Topbar */
+$topbarTextColor:#212121;
+$topbarIconColor:#212121;
+
+/* Submenu */
+$submenuBgColor:#EEEEEE;
+$darkSubmenuBgColor:#616161;
+$horizontalSubmenuBgColor:#EEEEEE;
+$horizontalDarkSubmenuBgColor:#616161;
+$horizontalSubmenuitemHoverBgColor:#E0E0E0;
+$horizontalSubmenuitemDarkHoverBgColor:#545454;
+$horizontalSubmenuitemDarkHoverTextColor:#ffffff;
+$horizontalMenuActiveTextColor:#ffffff;
+$horizontalMenuActiveHoverTextColor:#212121;
+$horizontalDarkMenuActiveTextColor:#ffffff;
+$horizontalDarkMenuActiveHoverTextColor:#ffffff;
+
+/* Default MenuItem */
+$menuitemTextColor:#212121;
+$menuitemIconTextColor:#616161;
+
+/* Hover MenuItem */
+$menuitemHoverBgColor:#E0E0E0;
+$menuitemHoverTextColor:#212121;
+$menuitemHoverIconTextColor:#212121;
+
+/* Active MenuItem */
+$menuitemActiveBgColor:#F9A825;
+$menuitemActiveTextColor:#ffffff;
+$menuitemActiveIconTextColor:#ffffff;
+$subMenuitemActiveTextColor:#F9A825;
+$subMenuitemActiveIconTextColor:#F9A825;
+
+/* Dark Default MenuItem */
+$darkMenuitemTextColor:#dee0e3;
+$darkMenuitemIconTextColor:#dee0e3;
+
+/* Dark Hover MenuItem */
+$darkMenuitemHoverBgColor:#545454;
+$darkMenuitemHoverTextColor:#ffffff;
+$darkMenuitemHoverIconTextColor:#ffffff;
+
+/* Dark Active MenuItem */
+$darkMenuitemActiveBgColor:#F9A825;
+$darkMenuitemActiveTextColor:#ffffff;
+$darkMenuitemActiveIconTextColor:#ffffff;
+$darksubMenuitemActiveTextColor:#FFEE58;
+$darksubMenuitemActiveIconTextColor:#FFEE58;
+
+@import '../../sass/layout/_layout';

frontend/angular/src/app/oneit/assets/layout/images/dashboard/weather-icon-1.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="26" height="20" viewBox="0 0 26 20">
+    <g fill="#565867" fill-rule="nonzero">
+        <path d="M20.783 12.38c.367-.737.56-1.547.56-2.38 0-2.97-2.437-5.385-5.433-5.385a5.46 5.46 0 0 0-4.46 2.316c-.066-.002-.13-.008-.196-.008-2.974 0-5.518 1.928-6.33 4.686a3.893 3.893 0 0 0-.655-.07C1.915 11.538 0 13.436 0 15.768 0 18.102 1.915 20 4.27 20h13.97c2.354 0 4.269-1.898 4.269-4.23 0-1.388-.68-2.618-1.725-3.39zM15.91 6.154c2.14 0 3.881 1.725 3.881 3.846 0 .595-.14 1.173-.402 1.699a4.284 4.284 0 0 0-1.15-.16c-.197 0-.431.03-.656.07a6.52 6.52 0 0 0-4.35-4.385 3.902 3.902 0 0 1 2.677-1.07zm2.33 12.308H4.268c-1.497 0-2.716-1.209-2.716-2.693s1.219-2.692 2.716-2.692c.108 0 .28.026.463.062v.707c0 .425.348.77.776.77a.773.773 0 0 0 .776-.77v-1.238c.417-2.405 2.498-4.146 4.97-4.146 2.473 0 4.554 1.742 4.97 4.148v1.236c0 .425.348.77.776.77a.773.773 0 0 0 .776-.77v-.706c.183-.037.357-.063.463-.063 1.498 0 2.717 1.208 2.717 2.692 0 1.484-1.22 2.693-2.717 2.693zM15.91 3.077a.773.773 0 0 0 .777-.77V.77A.773.773 0 0 0 15.91 0a.773.773 0 0 0-.776.77v1.538c0 .424.348.769.776.769zM25.224 9.23h-1.552a.773.773 0 0 0-.776.77c0 .425.347.77.776.77h1.552A.773.773 0 0 0 26 10a.773.773 0 0 0-.776-.77zM21.399 5.33a.777.777 0 0 0 .548-.226l1.098-1.087a.764.764 0 0 0 0-1.088.78.78 0 0 0-1.098 0L20.85 4.017a.764.764 0 0 0 0 1.087c.151.15.35.226.549.226zM9.873 5.104a.777.777 0 0 0 1.098 0 .764.764 0 0 0 0-1.087L9.873 2.929a.78.78 0 0 0-1.097 0 .764.764 0 0 0 0 1.088l1.097 1.087z"/>
+    </g>
+</svg>

frontend/angular/src/app/oneit/assets/layout/images/dashboard/weather-icon-2.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22">
+    <path fill="#565867" fill-rule="nonzero" d="M11 18.966c-.42 0-.759.34-.759.758v1.517a.759.759 0 0 0 1.518 0v-1.517a.759.759 0 0 0-.759-.758zM7.586 16.69c-.419 0-.758.34-.758.758v1.518a.759.759 0 0 0 1.517 0v-1.518a.759.759 0 0 0-.759-.758zm6.828 0c-.42 0-.759.34-.759.758v1.518a.759.759 0 0 0 1.517 0v-1.518a.759.759 0 0 0-.758-.758zm3.414-12.138c-.193 0-.422.03-.641.07A6.418 6.418 0 0 0 11 0a6.418 6.418 0 0 0-6.187 4.622 3.764 3.764 0 0 0-.64-.07A4.177 4.177 0 0 0 0 8.724c0 2.3 1.872 4.173 4.172 4.173h2.656v1.517a.759.759 0 0 0 1.517 0v-1.517h5.31v1.517a.759.759 0 0 0 1.517 0v-1.517h2.656c2.3 0 4.172-1.872 4.172-4.173 0-2.3-1.872-4.172-4.172-4.172zm0 6.827H4.172a2.659 2.659 0 0 1-2.655-2.655A2.659 2.659 0 0 1 4.172 6.07c.105 0 .275.026.453.061v.698a.759.759 0 0 0 1.517 0V5.607A4.906 4.906 0 0 1 11 1.517a4.907 4.907 0 0 1 4.858 4.09v1.22a.759.759 0 0 0 1.517 0v-.696c.178-.036.349-.062.453-.062a2.659 2.659 0 0 1 2.655 2.655 2.659 2.659 0 0 1-2.655 2.655zM11 14.414c-.42 0-.759.34-.759.758v1.518a.759.759 0 0 0 1.518 0v-1.518a.759.759 0 0 0-.759-.758z"/>
+</svg>

frontend/angular/src/app/oneit/assets/layout/images/dashboard/weather-icon-3.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="26" height="27" viewBox="0 0 26 27">
+    <g fill="#565867" fill-rule="nonzero">
+        <path d="M20.783 12.24c.366-.728.56-1.529.56-2.353 0-2.935-2.437-5.324-5.433-5.324a5.478 5.478 0 0 0-4.461 2.29c-.065-.002-.13-.008-.195-.008-2.974 0-5.518 1.906-6.33 4.633a3.927 3.927 0 0 0-.655-.07C1.915 11.408 0 13.285 0 15.592c0 2.306 1.915 4.183 4.269 4.183.428 0 .776-.341.776-.76 0-.42-.348-.761-.776-.761-1.498 0-2.717-1.195-2.717-2.662 0-1.468 1.22-2.662 2.717-2.662.107 0 .28.025.463.061v.7c0 .419.347.76.776.76.428 0 .776-.341.776-.76v-1.225c.416-2.378 2.497-4.1 4.97-4.1 2.472 0 4.553 1.722 4.97 4.1v1.224c0 .42.347.76.776.76.429 0 .776-.34.776-.76v-.699c.182-.036.355-.061.463-.061 1.497 0 2.716 1.194 2.716 2.662 0 1.467-1.219 2.662-2.716 2.662a.769.769 0 0 0-.776.76c0 .42.347.76.776.76 2.353 0 4.268-1.876 4.268-4.182 0-1.372-.68-2.589-1.724-3.351zm-3.2-.762c-.624-2.095-2.272-3.702-4.35-4.335a3.925 3.925 0 0 1 2.677-1.058c2.14 0 3.88 1.705 3.88 3.802 0 .59-.139 1.16-.401 1.68a4.33 4.33 0 0 0-1.15-.159c-.197 0-.432.03-.656.07zM15.91 3.042c.428 0 .776-.34.776-.76V.76c0-.42-.348-.761-.776-.761a.768.768 0 0 0-.776.76v1.522c0 .42.347.76.776.76zM25.223 9.127h-1.552a.768.768 0 0 0-.776.76c0 .42.347.76.776.76h1.552c.429 0 .777-.34.777-.76s-.348-.76-.777-.76zM21.398 5.27a.781.781 0 0 0 .55-.223l1.097-1.076a.75.75 0 0 0 0-1.075.787.787 0 0 0-1.098 0L20.85 3.97a.75.75 0 0 0 0 1.076.78.78 0 0 0 .548.223zM9.873 5.047c.152.148.35.223.55.223a.781.781 0 0 0 .548-.223.75.75 0 0 0 0-1.076L9.873 2.896a.787.787 0 0 0-1.097 0 .75.75 0 0 0 0 1.075l1.097 1.076z"/>
+        <path d="M11.83 15.995a.778.778 0 0 0-.941.553L8.56 25.675a.76.76 0 0 0 .565.922.773.773 0 0 0 .941-.553l2.328-9.127a.759.759 0 0 0-.564-.922zM14.934 18.276a.779.779 0 0 0-.941.554l-1.164 4.563a.76.76 0 0 0 .564.923.773.773 0 0 0 .941-.553l1.165-4.564a.759.759 0 0 0-.565-.923zM7.561 18.276a.779.779 0 0 0-.941.554l-1.164 4.563a.76.76 0 0 0 .564.923.773.773 0 0 0 .941-.553l1.165-4.564a.759.759 0 0 0-.565-.923z"/>
+    </g>
+</svg>

frontend/angular/src/app/oneit/assets/layout/images/dashboard/weather-icon-4.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="26" height="24" viewBox="0 0 26 24">
+    <g fill="#565867" fill-rule="nonzero">
+        <path d="M15.91 3a.764.764 0 0 0 .777-.75V.75A.764.764 0 0 0 15.91 0a.763.763 0 0 0-.776.75v1.5c0 .414.348.75.776.75zM25.224 9h-1.552a.763.763 0 0 0-.776.75c0 .414.347.75.776.75h1.552A.764.764 0 0 0 26 9.75a.764.764 0 0 0-.776-.75zM21.399 5.196a.787.787 0 0 0 .548-.22l1.098-1.06a.732.732 0 0 0 0-1.06.795.795 0 0 0-1.098 0l-1.097 1.06a.732.732 0 0 0 0 1.06c.151.147.35.22.549.22zM9.873 4.977c.152.146.35.22.55.22a.787.787 0 0 0 .548-.22.732.732 0 0 0 0-1.06L9.873 2.855a.795.795 0 0 0-1.097 0 .732.732 0 0 0 0 1.06l1.097 1.06zM18.239 18H4.269c-1.498 0-2.717-1.178-2.717-2.625s1.22-2.625 2.717-2.625c.107 0 .28.025.463.06v.69c0 .414.347.75.776.75a.763.763 0 0 0 .776-.75v-1.209c.417-2.344 2.498-4.041 4.97-4.041 2.781 0 5.045 2.187 5.045 4.875v.375c0 .414.347.75.776.75a.764.764 0 0 0 .776-.75v-.375c0-2.85-1.945-5.267-4.618-6.081A3.955 3.955 0 0 1 15.91 6c2.14 0 3.881 1.682 3.881 3.75 0 .52-.113 1.032-.327 1.503-.02 0-.04-.003-.061-.003a.763.763 0 0 0-.776.75c0 .414.347.75.776.75.474 0 .916.206 1.212.564.223.268.34.592.34.936 0 .827-.696 1.5-1.552 1.5h-8.15a.763.763 0 0 0-.775.75c0 .414.347.75.776.75h8.149c1.712 0 3.104-1.346 3.104-3 0-.679-.241-1.344-.68-1.873a3.082 3.082 0 0 0-.859-.715 5.101 5.101 0 0 0 .375-1.912c0-2.895-2.437-5.25-5.433-5.25-1.786 0-3.453.856-4.462 2.26-.065-.002-.129-.01-.194-.01-2.974 0-5.518 1.88-6.33 4.569a3.98 3.98 0 0 0-.655-.069C1.915 11.25 0 13.1 0 15.375 0 17.649 1.915 19.5 4.269 19.5H18.239c1.497 0 2.716 1.178 2.716 2.625 0 .414.348.75.776.75a.764.764 0 0 0 .776-.75c0-2.274-1.915-4.125-4.268-4.125z"/>
+        <path d="M18.238 20.25H4.268a.763.763 0 0 0-.775.75c0 .414.347.75.776.75h13.97c.214 0 .387.168.387.375a.382.382 0 0 1-.388.375.763.763 0 0 0-.776.75c0 .414.348.75.776.75 1.07 0 1.94-.841 1.94-1.875s-.87-1.875-1.94-1.875zM23.672 15a.763.763 0 0 0-.776.75c0 .414.347.75.776.75.214 0 .388.168.388.375a.382.382 0 0 1-.388.375h-1.553a.763.763 0 0 0-.776.75c0 .414.348.75.776.75h1.553c1.07 0 1.94-.841 1.94-1.875S24.742 15 23.672 15z"/>
+    </g>
+</svg>

frontend/angular/src/app/oneit/assets/layout/images/exception/401.svg

+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="386px" height="205px" viewBox="0 0 386 205" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 46.2 (44496) - http://www.bohemiancoding.com/sketch -->
+    <title>401</title>
+    <desc>Created with Sketch.</desc>
+    <defs></defs>
+    <g id="Default-Pages" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" opacity="0.5">
+        <g id="access" transform="translate(-502.000000, -293.000000)" fill="#FFFFFF">
+            <g id="box" transform="translate(438.000000, 256.000000)">
+                <g id="header">
+                    <path d="M168.117188,177.339844 L202.570312,177.339844 L202.570312,184.722656 L168.117188,184.722656 L168.117188,239 L160.734375,239 L160.734375,184.722656 L64.2109375,184.722656 L64.2109375,180.621094 L159.230469,39.9375 L168.117188,39.9375 L168.117188,177.339844 Z M75.6953125,177.339844 L160.734375,177.339844 L160.734375,48.8242188 L149.25,67.6914062 L75.6953125,177.339844 Z M342.433594,157.789062 C342.433594,184.494925 337.238333,205.162036 326.847656,219.791016 C316.456979,234.419995 301.873792,241.734375 283.097656,241.734375 C264.412667,241.734375 249.783907,234.351636 239.210938,219.585938 C228.637968,204.820239 223.351562,184.039196 223.351562,157.242188 L223.351562,121.148438 C223.351562,94.7160137 228.569609,74.0944751 239.005859,59.2832031 C249.442109,44.4719312 264.048083,37.0664062 282.824219,37.0664062 C301.691501,37.0664062 316.343047,44.4719312 326.779297,59.2832031 C337.215547,74.0944751 342.433594,94.8983035 342.433594,121.695312 L342.433594,157.789062 Z M335.050781,121.148438 C335.050781,96.9946709 330.516321,78.1732445 321.447266,64.6835938 C312.37821,51.193943 299.50399,44.4492188 282.824219,44.4492188 C266.053302,44.4492188 253.179081,51.2167292 244.201172,64.7519531 C235.223262,78.2871771 230.734375,97.3136795 230.734375,121.832031 L230.734375,157.515625 C230.734375,181.578245 235.337194,200.399672 244.542969,213.980469 C253.748744,227.561266 266.600178,234.351562 283.097656,234.351562 C299.686281,234.351562 312.492142,227.561266 321.515625,213.980469 C330.539108,200.399672 335.050781,181.350383 335.050781,156.832031 L335.050781,121.148438 Z M449.621094,239 L442.238281,239 L442.238281,49.234375 L385.089844,70.6992188 L385.089844,62.6328125 L448.117188,39.390625 L449.621094,39.390625 L449.621094,239 Z" id="401"></path>
+                </g>
+            </g>
+        </g>
+    </g>
+</svg>
\ No newline at end of file