ontimize-web-ngx 15.0.0-beta.0 → 15.0.0-beta.2

package/theming/themes/implatform-fashion-default-theme.scss

@@ -1,148 +0,0 @@
-@use "sass:color";
-@use "sass:map";
-@use '@angular/material'as mat;
-
-@include mat.all-component-typographies();
-@include mat.core();
-
-//Definition primary and accent palettes
-$default-palette: (50: #e8e3f4,
-  100: #c5b9e4,
-  200: #9f8ad2,
-  300: #795bc0,
-  400: #5c37b3,
-  500: #3f14a5,
-  600: #39129d,
-  700: #310e93,
-  800: #290b8a,
-  900: #1b0679,
-  A100: #b3a8ff,
-  A200: #8775ff,
-  A400: #5b42ff,
-  A700: #4428ff,
-  contrast: (50: #000000,
-    100: #000000,
-    200: #000000,
-    300: #ffffff,
-    400: #ffffff,
-    500: #ffffff,
-    600: #ffffff,
-    700: #ffffff,
-    800: #ffffff,
-    900: #ffffff,
-    A100: #000000,
-    A200: #000000,
-    A400: #ffffff,
-    A700: #ffffff,
-  ),
-);
-
-// Define a theme.
-$primary: mat.define-palette($default-palette);
-$accent: mat.define-palette($default-palette);
-
-
-/*Application background-color*/
-$app-background-color: #eaeaea;
-/*Sidenav background-color*/
-$sidenav-background-color: #f5f5f5;
-
-// Background palette for light themes.
-@function fashion-light-theme-background($primary, $mat-theme) {
-  $primary-500: mat.get-color-from-palette($primary, 500);
-  $background: map.get($mat-theme, background);
-  @return map.merge($background,
-    (level-0: mix($app-background-color, $primary-500, 98%),
-      level-04: #f2f2f2,
-      level-06: #f6f6f6,
-      level-08: #fafafa,
-      level-1: white,
-      sidenav-overlay: #525252,
-      status-bar: mix($sidenav-background-color, mat.get-color-from-palette($primary), 97.2%),
-      app-bar: mix($sidenav-background-color, mat.get-color-from-palette($primary), 97.2%),
-      background: mix($app-background-color, mat.get-color-from-palette($primary), 97.2%)));
-}
-
-// Background palette for dark themes.
-@function fashion-dark-theme-background($primary, $mat-theme) {
-  $primary-500: mat.get-color-from-palette($primary, 500);
-  $background: map.get($mat-theme, background);
-  @return map.merge($background,
-    (level-0: mix(#171717, $primary-500, 94%),
-      level-04: mix(#1E1E1E, $primary-500, 94%),
-      level-06: mix(#2C2C2C, $primary-500, 94%),
-      level-08: mix(#333333, $primary-500, 94%),
-      level-1: mix(#383838, $primary-500, 94%),
-      sidenav-overlay: #525252,
-      status-bar: mix(#272727, $primary-500, 94%)));
-}
-
-// Foreground palette for light themes.
-$fashion-light-theme-foreground: (base: rgba(black, 0.6),
-  divider: rgba(black, 0.12),
-  dividers: rgba(black, 0.12),
-  disabled: rgba(black, 0.38),
-  disabled-button: rgba(black, 0.38),
-  disabled-text: rgba(black, 0.38),
-  elevation: black,
-  hint-text: rgba(black, 0.38),
-  secondary-text: rgba(black, 0.54),
-  title: rgba(black, 0.87),
-  icon: rgba(black, 0.6),
-  icons: rgba(black, 0.6),
-  text: rgba(black, 0.87),
-  slider-min: rgba(black, 0.38),
-  slider-off: rgba(black, 0.38),
-  slider-off-active: rgba(black, 0.38),
-  button: rgba(black, 0.74));
-
-// Foreground palette for dark themes.
-$fashion-dark-theme-foreground: (base: rgba(white, 0.6),
-  divider: rgba(white, 0.12),
-  dividers: rgba(white, 0.12),
-  disabled: rgba(white, 0.38),
-  disabled-button: rgba(white, 0.38),
-  disabled-text: rgba(white, 0.38),
-  elevation: black,
-  hint-text: rgba(white, 0.38),
-  secondary-text: rgba(white, 0.54),
-  title: rgba(white, 0.87),
-  icon: rgba(white, 0.6),
-  icons: rgba(white, 0.6),
-  text: rgba(white, 0.87),
-  slider-min: rgba(white, 0.38),
-  slider-off: rgba(white, 0.38),
-  slider-off-active: rgba(white, 0.38),
-  button: rgba(white, 0.74));
-
-
-// Creates a container object for a light theme to be given to individual component theme mixins.
-@function fashion-mat-light-theme($primary, $accent, $warn: mat.define-palette(mat.$red-palette)) {
-  $mat-theme: mat.define-light-theme((color:(primary: $primary, accent: $accent, warn: $warn)));
-  $color: map.get($mat-theme, color);
-  @return (color:(primary: $primary,
-      accent: $accent,
-      warn: $warn,
-      is-dark: false,
-      foreground: $fashion-light-theme-foreground,
-      background: fashion-light-theme-background($primary, $color)),
-    typography:mat.define-typography-config())
-}
-
-// Creates a container object for a dark theme to be given to individual component theme mixins.
-@function fashion-mat-dark-theme($primary, $accent, $warn: mat.define-palette(mat.$red-palette)) {
-  $mat-theme: mat.define-dark-theme((color:(primary: $primary, accent: $accent, warn: $warn)));
-  $color: map.get($mat-theme, color);
-  @return (color:(primary: $primary,
-      accent: $accent,
-      warn: $warn,
-      is-dark: true,
-      foreground: $fashion-dark-theme-foreground,
-      background: fashion-dark-theme-background($primary, $color)),
-    typography: mat.define-typography-config());
-}
-
-/* Light theme */
-$theme: fashion-mat-light-theme($primary, $accent);
-/* Dark theme */
-$dark-theme: fashion-mat-dark-theme($primary, $accent);

package/theming/themes/mat-deeppurple-amber.scss

@@ -1,12 +0,0 @@
-@use '@angular/material'as mat;
-@use '../ontimize-theme.scss';
-
-@include mat.all-component-typographies();
-@include mat.core();
-
-$primary: mat.define-palette(mat.$deep-purple-palette);
-$accent: mat.define-palette(mat.$amber-palette, A200, A100, A400);
-
-
-$theme: ontimize-theme.o-mat-light-theme($primary, $accent);
-$dark-theme: ontimize-theme.o-mat-dark-theme($primary,$accent);

package/theming/themes/mat-indigo-pink.scss

@@ -1,11 +0,0 @@
-@use '@angular/material'as mat;
-@use '../ontimize-theme.scss';
-
-@include mat.all-component-typographies();
-@include mat.core();
-
-$primary: mat.define-palette(mat.$indigo-palette);
-$accent: mat.define-palette(mat.$pink-palette, A200, A100, A400);
-
-$theme: ontimize-theme.o-mat-light-theme($primary, $accent);
-$dark-theme: ontimize-theme.o-mat-dark-theme($primary, $accent);

package/theming/themes/mat-pink-bluegrey.scss

@@ -1,11 +0,0 @@
-@use '@angular/material'as mat;
-@use '../ontimize-theme.scss';
-
-@include mat.all-component-typographies();
-@include mat.core();
-
-$primary: mat.define-palette(mat.$pink-palette);
-$accent: mat.define-palette(mat.$blue-grey-palette, A200, A100, A400);
-
-$theme: ontimize-theme.o-mat-light-theme($primary, $accent);
-$dark-theme: ontimize-theme.o-mat-dark-theme($primary, $accent);

package/theming/themes/mat-purple-green.scss

@@ -1,11 +0,0 @@
-@use '@angular/material'as mat;
-@use '../ontimize-theme.scss';
-
-@include mat.all-component-typographies();
-@include mat.core();
-
-$primary: mat.define-palette(mat.$purple-palette, 700, 500, 800);
-$accent: mat.define-palette(mat.$green-palette, A200, A100, A400);
-
-$theme: ontimize-theme.o-mat-light-theme($primary, $accent);
-$dark-theme: ontimize-theme.o-mat-dark-theme($primary, $accent);

package/theming/themes/ontimize-lite.scss

@@ -1,29 +0,0 @@
-@use "sass:map";
-@use '@angular/material'as mat;
-@use '../ontimize-theme.scss';
-
-@include mat.all-component-typographies();
-@include mat.core();
-
-/* Color definitions */
-$mat-custom-primary: (50 : #e3ecf4, 100 : #b9d1e4, 200 : #8ab2d2, 300 : #5b93c0, 400 : #377bb3, 500 : #1464a5, 600 : #125c9d, 700 : #0e5293, 800 : #0b488a, 900 : #063679, A100 : #a8c7ff, A200 : #75a7ff, A400 : #4286ff, A700 : #2876ff, contrast: (50 : #000000, 100 : #000000, 200 : #000000, 300 : #000000, 400 : #ffffff, 500 : #ffffff, 600 : #ffffff, 700 : #ffffff, 800 : #ffffff, 900 : #ffffff, A100 : #000000, A200 : #000000, A400 : #ffffff, A700 : #ffffff));
-
-$mat-custom-accent: (50 : #e3ecf4, 100 : #b9d1e4, 200 : #8ab2d2, 300 : #5b93c0, 400 : #377bb3, 500 : #1464a5, 600 : #125c9d, 700 : #0e5293, 800 : #0b488a, 900 : #063679, A100 : #a8c7ff, A200 : #75a7ff, A400 : #4286ff, A700 : #2876ff, contrast: (50 : #000000, 100 : #000000, 200 : #000000, 300 : #000000, 400 : #ffffff, 500 : #ffffff, 600 : #ffffff, 700 : #ffffff, 800 : #ffffff, 900 : #ffffff, A100 : #000000, A200 : #000000, A400 : #ffffff, A700 : #ffffff));
-
-// Define a theme.
-$primary: mat.define-palette($mat-custom-primary);
-$accent: mat.define-palette($mat-custom-accent);
-$background-color: #eceff1;
-
-/* Light theme */
-$theme: ontimize-theme.o-mat-light-theme((color: (primary: $primary, accent: $accent), typography: mat.define-typography-config()));
-
-// Insert custom background color
-$background: map.get($theme, color, background);
-$background: map.merge($background, (background: $background-color));
-
-$theme: map.merge($theme, color, (background: $background));
-/* Dark theme */
-$primary-dark: mat.define-palette($mat-custom-primary);
-$accent-dark: mat.define-palette($mat-custom-accent);
-$dark-theme: ontimize-theme.o-mat-dark-theme((color: (primary: $primary, accent: $accent), typography: mat.define-typography-config()));