Fix Bug 2121: NG-UI uses unmaintained Chokidar version

	- Upgraded Angular from 11 to 14 version to remove chokidar
	  unmaintained version.
	- Changed linting tool tslint to eslint for angular 14 as tslint
	  is depreacted after angular 12
	- Resolved linting issues from code

Change-Id: I00e908ab651db0f080e0d18a9d1c9711f4e36b91
Signed-off-by: SANDHYA.JS <sandhya.j@tataelxsi.co.in>
diff --git a/src/assets/i18n/de.json b/src/assets/i18n/de.json
index dc1d2a0..5070068 100644
--- a/src/assets/i18n/de.json
+++ b/src/assets/i18n/de.json
@@ -306,7 +306,7 @@
             "DETAILS": "SDN-Controller-Details"
         },
         "USERS": {
-            "CREATEUSER": "Gebruiker aanmaken",
+            "CREATEUSER": "Nieuwe gebruiker",
             "NEWUSER": "Neuer Benutzer",
             "USERNAME": "Nutzername",
             "PASSWORD": "Passwort",
@@ -436,7 +436,7 @@
             "EXECUTEDSUCCESSFULLY": "NS Primitive Configuration ausgeführt"
         },
         "ROLES": {
-            "CREATEROLE": "Rolle erstellen",
+            "CREATEROLE": "Neue Rolle",
             "ROLE": "Rolle",
             "PERMISSIONS": "Berechtigungen",
             "YAMLPERMISSIONS": "YAML Berechtigungen",
diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json
index cb4ac32..659c0f5 100644
--- a/src/assets/i18n/en.json
+++ b/src/assets/i18n/en.json
@@ -306,7 +306,7 @@
             "DETAILS": "SDN Controller Details"
         },
         "USERS": {
-            "CREATEUSER": "Create User",
+            "CREATEUSER": "New User",
             "NEWUSER": "New User",
             "USERNAME": "User Name",
             "PASSWORD": "Password",
@@ -436,7 +436,7 @@
             "EXECUTEDSUCCESSFULLY": "Executed NS Primitive Configuration"
         },
         "ROLES": {
-            "CREATEROLE": "Create Role",
+            "CREATEROLE": "New Role",
             "ROLE": "Role",
             "PERMISSIONS": "Permissions",
             "YAMLPERMISSIONS": "YAML Permissions",
diff --git a/src/assets/i18n/es.json b/src/assets/i18n/es.json
index e4331c4..f8dfce6 100644
--- a/src/assets/i18n/es.json
+++ b/src/assets/i18n/es.json
@@ -306,7 +306,7 @@
             "DETAILS": "Detalles del controlador SDN"
         },
         "USERS": {
-            "CREATEUSER": "Crear usuario",
+            "CREATEUSER": "Nuevo usuario",
             "NEWUSER": "Nuevo usuario",
             "USERNAME": "Nombre de usuario",
             "PASSWORD": "Contraseña",
@@ -436,7 +436,7 @@
             "EXECUTEDSUCCESSFULLY": "Ejecutada NS Configuración primitiva"
         },
         "ROLES": {
-            "CREATEROLE": "Crear rol",
+            "CREATEROLE": "Nuevo rol",
             "ROLE": "Rol",
             "PERMISSIONS": "Permisos",
             "YAMLPERMISSIONS": "YAML Permisos",
diff --git a/src/assets/i18n/pt.json b/src/assets/i18n/pt.json
index 160ef8d..a37d187 100644
--- a/src/assets/i18n/pt.json
+++ b/src/assets/i18n/pt.json
@@ -306,7 +306,7 @@
             "DETAILS": "Detalhes do Controlador SDN"
         },
         "USERS": {
-            "CREATEUSER": "Criar usuário",
+            "CREATEUSER": "Novo usuário",
             "NEWUSER": "Novo usuário",
             "USERNAME": "Nome de Usuário",
             "PASSWORD": "Senha",
@@ -436,7 +436,7 @@
             "EXECUTEDSUCCESSFULLY": "Configuração primitiva do NS executada"
         },
         "ROLES": {
-            "CREATEROLE": "Criar função",
+            "CREATEROLE": "Novo função",
             "ROLE": "Função",
             "PERMISSIONS": "Permissões",
             "YAMLPERMISSIONS": "YAML Permissões",
diff --git a/src/assets/scss/app.scss b/src/assets/scss/app.scss
index 2e2eb92..cb96c93 100644
--- a/src/assets/scss/app.scss
+++ b/src/assets/scss/app.scss
@@ -16,9 +16,11 @@
  Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
  */
 /** Styles for the application **/
+@use "sass:math";
+
 @import "../../assets/scss/mixins/mixin";
 @import "../../assets/scss/variable";
-$customnavbar-padding-x: ($spacer / 0.5) !default;
+$customnavbar-padding-x: math.div($spacer, 0.5) !default;
 * {
   outline: 0;
 }
@@ -266,6 +268,7 @@
   }
   .resources-chart-popover {
     max-width: 60% !important;
+    width: 600px !important;
     @include font-family("Roboto");
     .popover-body {
       max-height: 60vh;
diff --git a/src/assets/scss/mixins/_rem.scss b/src/assets/scss/mixins/_rem.scss
index 960132a..4abd417 100644
--- a/src/assets/scss/mixins/_rem.scss
+++ b/src/assets/scss/mixins/_rem.scss
@@ -20,6 +20,8 @@
  * example: @include rem("font-size", 14);
  */
 
+@use "sass:math";
+
 @mixin rem($property, $values...) {
     $n: length($values);
     $i: 1;
@@ -29,7 +31,7 @@
         $itemVal: (nth($values, $i));
         @if $itemVal !="auto" {
             $pxlist: append($pxlist, $itemVal + px);
-            $remlist: append($remlist, ($itemVal / 16) + rem);
+            $remlist: append($remlist, math.div($itemVal, 16) + rem);
         }
         @else {
             $pxlist: append($pxlist, auto);
diff --git a/src/assets/scss/style.scss b/src/assets/scss/style.scss
index d39843b..0fb1c39 100644
--- a/src/assets/scss/style.scss
+++ b/src/assets/scss/style.scss
@@ -17,30 +17,30 @@
  */
 /*Roboto Fonts*/
 $roboto-font-path: "~roboto-fontface/fonts" !default;
-@import "~roboto-fontface/css/roboto/sass/roboto-fontface-regular";
+@import "../../../node_modules/roboto-fontface/css/roboto/sass/roboto-fontface-regular.scss";
 /*Custom mixin*/
 @import "mixins/mixin.scss";
 /*Theme setup color*/
 @import "variable";
 /*bootstrap styles*/
-@import "~bootstrap/scss/bootstrap";
+@import "../../../node_modules/bootstrap/scss/bootstrap.scss";
 /*Custom theme styles*/
 @import "app.scss";
 /*Code Mirror styles*/
-@import "~codemirror/lib/codemirror";
-@import "~codemirror/addon/fold/foldgutter";
-@import "~codemirror/theme/neat";
-@import "~codemirror/theme/material";
-@import "~codemirror/addon/dialog/dialog";
-@import "~codemirror/addon/display/fullscreen";
+@import "../../../node_modules/codemirror/lib/codemirror.css";
+@import "../../../node_modules/codemirror/addon/fold/foldgutter.css";
+@import "../../../node_modules/codemirror/theme/neat.css";
+@import "../../../node_modules/codemirror/theme/material.css";
+@import "../../../node_modules/codemirror/addon/dialog/dialog.css";
+@import "../../../node_modules/codemirror/addon/display/fullscreen.css";
 /*ng-select styles*/
-@import "~@ng-select/ng-select/themes/default.theme.css";
+@import "../../../node_modules/@ng-select/ng-select/themes/default.theme.css";
 /*Angular notifier styles*/
-@import "~angular-notifier/styles/core.scss";
-@import "~angular-notifier/styles/themes/theme-material.scss";
-@import "~angular-notifier/styles/themes/theme-material.scss";
-@import "~angular-notifier/styles/types/type-success.scss";
-@import "~angular-notifier/styles/types/type-error.scss";
-@import "~angular-notifier/styles/types/type-warning.scss";
-@import "~angular-notifier/styles/types/type-default.scss";
-@import "~angular-notifier/styles/types/type-info.scss";
\ No newline at end of file
+@import "../../../node_modules/angular-notifier/styles/core.scss";
+@import "../../../node_modules/angular-notifier/styles/themes/theme-material.scss";
+@import "../../../node_modules/angular-notifier/styles/themes/theme-material.scss";
+@import "../../../node_modules/angular-notifier/styles/types/type-success.scss";
+@import "../../../node_modules/angular-notifier/styles/types/type-error.scss";
+@import "../../../node_modules/angular-notifier/styles/types/type-warning.scss";
+@import "../../../node_modules/angular-notifier/styles/types/type-default.scss";
+@import "../../../node_modules/angular-notifier/styles/types/type-info.scss";
\ No newline at end of file
diff --git a/src/assets/scss/variable.scss b/src/assets/scss/variable.scss
index 6a274ce..3af9d3b 100644
--- a/src/assets/scss/variable.scss
+++ b/src/assets/scss/variable.scss
@@ -15,6 +15,7 @@
 
  Author: KUMARAN M (kumaran.m@tataelxsi.co.in), RAJESH S (rajesh.s@tataelxsi.co.in), BARATH KUMAR R (barath.r@tataelxsi.co.in)
  */
+ @use "sass:math";
 // Custom Variables
 $themecolor: #2962ff;
 $theme-light: #fff;
@@ -125,19 +126,19 @@
 $white-smoke: #f1f1f1 !default;
 $text-muted: $gray-500 !default;
 $colors: (
-  blue: $blue,
-  indigo: $indigo,
-  purple: $purple,
-  pink: $pink,
-  red: $red,
-  orange: $orange,
-  yellow: $yellow,
-  green: $green,
-  teal: $teal,
-  cyan: $cyan,
-  white: $white,
-  gray: $gray-600,
-  gray-dark: $gray-800
+  "blue": $blue,
+  "indigo": $indigo,
+  "purple": $purple,
+  "pink": $pink,
+  "red": $red,
+  "orange": $orange,
+  "yellow": $yellow,
+  "green": $green,
+  "teal": $teal,
+  "cyan": $cyan,
+  "white": $white,
+  "gray": $gray-600,
+  "gray-dark": $gray-800
 );
 $primary: $blue !default;
 $secondary: $gray-400 !default;
@@ -199,7 +200,7 @@
 $h4-font-size: 18px !default;
 $h5-font-size: 16px !default;
 $h6-font-size: 14px !default;
-$headings-margin-bottom: (1rem / 2) !default;
+$headings-margin-bottom: math.div(1rem, 2) !default;
 $headings-font-weight: 400 !default;
 $headings-color: inherit !default;
 // Breadcrumbs