@igo2/core 16.2.0 → 16.3.0

package/src/theming/prebuilt-themes/bluedq-theme.scss

@@ -1,60 +1,60 @@
-@use 'sass:map';
-@use '@angular/material' as mat;
-@use '../all-theme';
-@use '../typography';
-
-$dq-palette: (
-  50: #e1f5fd,
-  100: #b4e5fb,
-  200: #82d4f8,
-  300: #53c3f4,
-  400: #31b6f2,
-  500: #0d81df,
-  600: #149be1,
-  700: #1088cd,
-  800: #0f77b9,
-  900: #095797,
-  A100: #6dc6ff,
-  A200: #3ab2ff,
-  A400: #079eff,
-  A700: #0090ec,
-  contrast: (
-    50: #000000,
-    100: #000000,
-    200: #000000,
-    300: #000000,
-    400: #000000,
-    500: #000000,
-    600: #ffffff,
-    700: #ffffff,
-    800: #ffffff,
-    900: #ffffff,
-    A100: #000000,
-    A200: #000000,
-    A400: #ffffff,
-    A700: #ffffff
-  )
-);
-
-$primary: mat.define-palette($dq-palette, 900);
-$accent: mat.define-palette($dq-palette, 500);
-$warn: mat.define-palette(mat.$red-palette);
-$typography: typography.$igo-typography;
-
-$theme: mat.define-light-theme(
-  (
-    color: (
-      primary: $primary,
-      accent: $accent,
-      warn: $warn
-    ),
-    typography: $typography,
-    density: 0
-  )
-);
-
-@include mat.core();
-@include mat.typography-hierarchy($typography);
-@include mat.all-component-themes($theme);
-
-@include all-theme.all-component-themes($theme);
+@use 'sass:map';
+@use '@angular/material' as mat;
+@use '../all-theme';
+@use '../typography';
+
+$dq-palette: (
+  50: #e1f5fd,
+  100: #b4e5fb,
+  200: #82d4f8,
+  300: #53c3f4,
+  400: #31b6f2,
+  500: #0d81df,
+  600: #149be1,
+  700: #1088cd,
+  800: #0f77b9,
+  900: #095797,
+  A100: #6dc6ff,
+  A200: #3ab2ff,
+  A400: #079eff,
+  A700: #0090ec,
+  contrast: (
+    50: #000000,
+    100: #000000,
+    200: #000000,
+    300: #000000,
+    400: #000000,
+    500: #000000,
+    600: #ffffff,
+    700: #ffffff,
+    800: #ffffff,
+    900: #ffffff,
+    A100: #000000,
+    A200: #000000,
+    A400: #ffffff,
+    A700: #ffffff
+  )
+);
+
+$primary: mat.define-palette($dq-palette, 900);
+$accent: mat.define-palette($dq-palette, 500);
+$warn: mat.define-palette(mat.$red-palette);
+$typography: typography.$igo-typography;
+
+$theme: mat.define-light-theme(
+  (
+    color: (
+      primary: $primary,
+      accent: $accent,
+      warn: $warn
+    ),
+    typography: $typography,
+    density: 0
+  )
+);
+
+@include mat.core();
+@include mat.typography-hierarchy($typography);
+@include mat.all-component-themes($theme);
+
+@include all-theme.all-component-themes($theme);

package/src/theming/prebuilt-themes/bluegrey-theme.scss

@@ -1,26 +1,26 @@
-@use '@angular/material' as mat;
-@use '../all-theme';
-@use '../typography';
-
-$primary: mat.define-palette(mat.$blue-grey-palette);
-$accent: mat.define-palette(mat.$pink-palette, A200, A100, A400);
-$warn: mat.define-palette(mat.$deep-orange-palette);
-$typography: typography.$igo-typography;
-
-$theme: mat.define-light-theme(
-  (
-    color: (
-      primary: $primary,
-      accent: $accent,
-      warn: $warn
-    ),
-    typography: $typography,
-    density: 0
-  )
-);
-
-@include mat.core();
-@include mat.typography-hierarchy($typography);
-@include mat.all-component-themes($theme);
-
-@include all-theme.all-component-themes($theme);
+@use '@angular/material' as mat;
+@use '../all-theme';
+@use '../typography';
+
+$primary: mat.define-palette(mat.$blue-grey-palette);
+$accent: mat.define-palette(mat.$pink-palette, A200, A100, A400);
+$warn: mat.define-palette(mat.$deep-orange-palette);
+$typography: typography.$igo-typography;
+
+$theme: mat.define-light-theme(
+  (
+    color: (
+      primary: $primary,
+      accent: $accent,
+      warn: $warn
+    ),
+    typography: $typography,
+    density: 0
+  )
+);
+
+@include mat.core();
+@include mat.typography-hierarchy($typography);
+@include mat.all-component-themes($theme);
+
+@include all-theme.all-component-themes($theme);

package/src/theming/prebuilt-themes/dark-theme.scss

@@ -1,26 +1,26 @@
-@use '@angular/material' as mat;
-@use '../all-theme';
-@use '../typography';
-
-$primary: mat.define-palette(mat.$blue-grey-palette);
-$accent: mat.define-palette(mat.$pink-palette, A200, A100, A400);
-$warn: mat.define-palette(mat.$deep-orange-palette);
-$typography: typography.$igo-typography;
-
-$theme: mat.define-dark-theme(
-  (
-    color: (
-      primary: $primary,
-      accent: $accent,
-      warn: $warn
-    ),
-    typography: $typography,
-    density: 0
-  )
-);
-
-@include mat.core();
-@include mat.typography-hierarchy($typography);
-@include mat.all-component-themes($theme);
-
-@include all-theme.all-component-themes($theme);
+@use '@angular/material' as mat;
+@use '../all-theme';
+@use '../typography';
+
+$primary: mat.define-palette(mat.$blue-grey-palette);
+$accent: mat.define-palette(mat.$pink-palette, A200, A100, A400);
+$warn: mat.define-palette(mat.$deep-orange-palette);
+$typography: typography.$igo-typography;
+
+$theme: mat.define-dark-theme(
+  (
+    color: (
+      primary: $primary,
+      accent: $accent,
+      warn: $warn
+    ),
+    typography: $typography,
+    density: 0
+  )
+);
+
+@include mat.core();
+@include mat.typography-hierarchy($typography);
+@include mat.all-component-themes($theme);
+
+@include all-theme.all-component-themes($theme);

package/src/theming/prebuilt-themes/deeppurple-theme.scss

@@ -1,26 +1,26 @@
-@use '@angular/material' as mat;
-@use '../all-theme';
-@use '../typography';
-
-$primary: mat.define-palette(mat.$deep-purple-palette);
-$accent: mat.define-palette(mat.$amber-palette, A200, A100, A400);
-$warn: mat.define-palette(mat.$red-palette);
-$typography: typography.$igo-typography;
-
-$theme: mat.define-light-theme(
-  (
-    color: (
-      primary: $primary,
-      accent: $accent,
-      warn: $warn
-    ),
-    typography: $typography,
-    density: 0
-  )
-);
-
-@include mat.core();
-@include mat.typography-hierarchy($typography);
-@include mat.all-component-themes($theme);
-
-@include all-theme.all-component-themes($theme);
+@use '@angular/material' as mat;
+@use '../all-theme';
+@use '../typography';
+
+$primary: mat.define-palette(mat.$deep-purple-palette);
+$accent: mat.define-palette(mat.$amber-palette, A200, A100, A400);
+$warn: mat.define-palette(mat.$red-palette);
+$typography: typography.$igo-typography;
+
+$theme: mat.define-light-theme(
+  (
+    color: (
+      primary: $primary,
+      accent: $accent,
+      warn: $warn
+    ),
+    typography: $typography,
+    density: 0
+  )
+);
+
+@include mat.core();
+@include mat.typography-hierarchy($typography);
+@include mat.all-component-themes($theme);
+
+@include all-theme.all-component-themes($theme);

package/src/theming/prebuilt-themes/indigo-theme.scss

@@ -1,26 +1,26 @@
-@use '@angular/material' as mat;
-@use '../all-theme';
-@use '../typography';
-
-$primary: mat.define-palette(mat.$indigo-palette);
-$accent: mat.define-palette(mat.$pink-palette, A200, A100, A400);
-$warn: mat.define-palette(mat.$red-palette);
-$typography: typography.$igo-typography;
-
-$theme: mat.define-light-theme(
-  (
-    color: (
-      primary: $primary,
-      accent: $accent,
-      warn: $warn
-    ),
-    typography: $typography,
-    density: 0
-  )
-);
-
-@include mat.core();
-@include mat.typography-hierarchy($typography);
-@include mat.all-component-themes($theme);
-
-@include all-theme.all-component-themes($theme);
+@use '@angular/material' as mat;
+@use '../all-theme';
+@use '../typography';
+
+$primary: mat.define-palette(mat.$indigo-palette);
+$accent: mat.define-palette(mat.$pink-palette, A200, A100, A400);
+$warn: mat.define-palette(mat.$red-palette);
+$typography: typography.$igo-typography;
+
+$theme: mat.define-light-theme(
+  (
+    color: (
+      primary: $primary,
+      accent: $accent,
+      warn: $warn
+    ),
+    typography: $typography,
+    density: 0
+  )
+);
+
+@include mat.core();
+@include mat.typography-hierarchy($typography);
+@include mat.all-component-themes($theme);
+
+@include all-theme.all-component-themes($theme);

package/src/theming/prebuilt-themes/orange-theme.scss

@@ -1,26 +1,26 @@
-@use '@angular/material' as mat;
-@use '../all-theme';
-@use '../typography';
-
-$primary: mat.define-palette(mat.$orange-palette, 800);
-$accent: mat.define-palette(mat.$light-blue-palette, 600, 100, 800);
-$warn: mat.define-palette(mat.$red-palette, 600);
-$typography: typography.$igo-typography;
-
-$theme: mat.define-light-theme(
-  (
-    color: (
-      primary: $primary,
-      accent: $accent,
-      warn: $warn
-    ),
-    typography: $typography,
-    density: 0
-  )
-);
-
-@include mat.core();
-@include mat.typography-hierarchy($typography);
-@include mat.all-component-themes($theme);
-
-@include all-theme.all-component-themes($theme);
+@use '@angular/material' as mat;
+@use '../all-theme';
+@use '../typography';
+
+$primary: mat.define-palette(mat.$orange-palette, 800);
+$accent: mat.define-palette(mat.$light-blue-palette, 600, 100, 800);
+$warn: mat.define-palette(mat.$red-palette, 600);
+$typography: typography.$igo-typography;
+
+$theme: mat.define-light-theme(
+  (
+    color: (
+      primary: $primary,
+      accent: $accent,
+      warn: $warn
+    ),
+    typography: $typography,
+    density: 0
+  )
+);
+
+@include mat.core();
+@include mat.typography-hierarchy($typography);
+@include mat.all-component-themes($theme);
+
+@include all-theme.all-component-themes($theme);

package/src/theming/prebuilt-themes/teal-theme.scss

@@ -1,26 +1,26 @@
-@use '@angular/material' as mat;
-@use '../all-theme';
-@use '../typography';
-
-$primary: mat.define-palette(mat.$teal-palette, 600, 400, 900);
-$accent: mat.define-palette(mat.$teal-palette, 400);
-$warn: mat.define-palette(mat.$red-palette);
-$typography: typography.$igo-typography;
-
-$theme: mat.define-light-theme(
-  (
-    color: (
-      primary: $primary,
-      accent: $accent,
-      warn: $warn
-    ),
-    typography: $typography,
-    density: 0
-  )
-);
-
-@include mat.core();
-@include mat.typography-hierarchy($typography);
-@include mat.all-component-themes($theme);
-
-@include all-theme.all-component-themes($theme);
+@use '@angular/material' as mat;
+@use '../all-theme';
+@use '../typography';
+
+$primary: mat.define-palette(mat.$teal-palette, 600, 400, 900);
+$accent: mat.define-palette(mat.$teal-palette, 400);
+$warn: mat.define-palette(mat.$red-palette);
+$typography: typography.$igo-typography;
+
+$theme: mat.define-light-theme(
+  (
+    color: (
+      primary: $primary,
+      accent: $accent,
+      warn: $warn
+    ),
+    typography: $typography,
+    density: 0
+  )
+);
+
+@include mat.core();
+@include mat.typography-hierarchy($typography);
+@include mat.all-component-themes($theme);
+
+@include all-theme.all-component-themes($theme);

package/src/theming/typography.scss

@@ -1,28 +1,28 @@
-@use '@angular/material' as mat;
-
-$igo-typography: mat.define-typography-config(
-  $headline-1: mat.define-typography-level(110px, 110px, 500),
-  $headline-2: mat.define-typography-level(54px, 54px, 500),
-  $headline-3: mat.define-typography-level(43px, 46px, 500),
-  $headline-4: mat.define-typography-level(32px, 38px, 500),
-  // h1
-  $headline-5: mat.define-typography-level(24px, 32px, 400),
-  // h2
-  $headline-6: mat.define-typography-level(20px, 30px, 400),
-  // h3
-  $subtitle-1: mat.define-typography-level(16px, 26px, 500),
-  // h4
-  $subtitle-2: mat.define-typography-level(12px, 22px, 500),
-  $body-1: mat.define-typography-level(14px, 22px, 400),
-  $body-2: mat.define-typography-level(12px, 18px, 400),
-  $caption: mat.define-typography-level(12px, 18px, 400),
-  $button: mat.define-typography-level(13px, 13px, 500)
-);
-
-// WORKAROUND, mat-typography bad area of intersection, h4 is using mat-body-1
-// https://github.com/angular/components/issues/26351
-h4 {
-  font-size: 14px !important;
-  line-height: 22px !important;
-  font-weight: 500 !important;
-}
+@use '@angular/material' as mat;
+
+$igo-typography: mat.define-typography-config(
+  $headline-1: mat.define-typography-level(110px, 110px, 500),
+  $headline-2: mat.define-typography-level(54px, 54px, 500),
+  $headline-3: mat.define-typography-level(43px, 46px, 500),
+  $headline-4: mat.define-typography-level(32px, 38px, 500),
+  // h1
+  $headline-5: mat.define-typography-level(24px, 32px, 400),
+  // h2
+  $headline-6: mat.define-typography-level(20px, 30px, 400),
+  // h3
+  $subtitle-1: mat.define-typography-level(16px, 26px, 500),
+  // h4
+  $subtitle-2: mat.define-typography-level(12px, 22px, 500),
+  $body-1: mat.define-typography-level(14px, 22px, 400),
+  $body-2: mat.define-typography-level(12px, 18px, 400),
+  $caption: mat.define-typography-level(12px, 18px, 400),
+  $button: mat.define-typography-level(13px, 13px, 500)
+);
+
+// WORKAROUND, mat-typography bad area of intersection, h4 is using mat-body-1
+// https://github.com/angular/components/issues/26351
+h4 {
+  font-size: 14px !important;
+  line-height: 22px !important;
+  font-weight: 500 !important;
+}

package/src/theming/utils/_foreground.scss

@@ -1,22 +1,22 @@
-@use '@angular/material' as mat;
-
-@function theme-foreground($palette) {
-  $color: mat.get-color-from-palette($palette, 500);
-  @return (
-    base: $color,
-    divider: rgba($color, 0.12),
-    dividers: rgba($color, 0.12),
-    disabled: rgba($color, 0.38),
-    disabled-button: rgba($color, 0.26),
-    disabled-text: rgba($color, 0.38),
-    elevation: $color,
-    hint-text: rgba($color, 0.38),
-    secondary-text: rgba($color, 0.54),
-    icon: rgba($color, 0.54),
-    icons: rgba($color, 0.54),
-    text: rgba($color, 0.87),
-    slider-min: rgba($color, 0.87),
-    slider-off: rgba($color, 0.26),
-    slider-off-active: rgba($color, 0.38)
-  );
-}
+@use '@angular/material' as mat;
+
+@function theme-foreground($palette) {
+  $color: mat.get-color-from-palette($palette, 500);
+  @return (
+    base: $color,
+    divider: rgba($color, 0.12),
+    dividers: rgba($color, 0.12),
+    disabled: rgba($color, 0.38),
+    disabled-button: rgba($color, 0.26),
+    disabled-text: rgba($color, 0.38),
+    elevation: $color,
+    hint-text: rgba($color, 0.38),
+    secondary-text: rgba($color, 0.54),
+    icon: rgba($color, 0.54),
+    icons: rgba($color, 0.54),
+    text: rgba($color, 0.87),
+    slider-min: rgba($color, 0.87),
+    slider-off: rgba($color, 0.26),
+    slider-off-active: rgba($color, 0.38)
+  );
+}

package/packages.import.scss

@@ -1,4 +0,0 @@
-@forward './core-theme' show core-component-themes;
-@forward '../common/common-theme' show common-component-themes;
-@forward '../context/context-theme' show context-component-themes;
-@forward '../geo/geo-theme' show geo-component-themes;

package/src/theming/prebuilt-themes/qcca/_index.scss

@@ -1,2 +0,0 @@
-@forward './base';
-@forward './components';

package/src/theming/prebuilt-themes/qcca/base/_index.scss

@@ -1,4 +0,0 @@
-@forward './breakpoints';
-@forward './colors' as colors-*;
-@forward './palette';
-@forward './typography';

package/src/theming/prebuilt-themes/qcca/base/breakpoints.scss

@@ -1,57 +0,0 @@
-@use 'sass:map';
-
-// There is no standard for breakpoints for the Quebec.ca theme
-// This is the Material breakpoint design by devices
-$device-breakpoints: (
-  mobile: (
-    max: 599px
-  ),
-  tablet: (
-    min: 600px,
-    max: 1239px
-  ),
-  laptop: (
-    min: 1240px,
-    max: 1439px
-  ),
-  desktop: (
-    min: 1440px
-  )
-);
-
-// Source: https://github.com/twbs/bootstrap/blob/main/scss/mixins/_breakpoints.scss
-@function breakpoint-min($name, $breakpoints: $device-breakpoints) {
-  $min: map.get($breakpoints, $name, min);
-  @return if($min != 0, $min, null);
-}
-
-@function breakpoint-max($name, $breakpoints: $device-breakpoints) {
-  $max: map.get($breakpoints, $name, max);
-  @return if($max and $max > 0, $max, null);
-}
-
-// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.
-// Makes the @content apply to the given breakpoint and wider.
-@mixin media-breakpoint-up($name, $breakpoints: $device-breakpoints) {
-  $min: breakpoint-min($name, $breakpoints);
-  @if $min {
-    @media (min-width: $min) {
-      @content;
-    }
-  } @else {
-    @content;
-  }
-}
-
-// Media of at most the maximum breakpoint width. No query for the largest breakpoint.
-// Makes the @content apply to the given breakpoint and narrower.
-@mixin media-breakpoint-down($name, $breakpoints: $device-breakpoints) {
-  $max: breakpoint-max($name, $breakpoints);
-  @if $max {
-    @media (max-width: $max) {
-      @content;
-    }
-  } @else {
-    @content;
-  }
-}

package/src/theming/prebuilt-themes/qcca/base/colors.scss

@@ -1,40 +0,0 @@
-@use 'sass:map';
-
-// https://design.quebec.ca/bases/couleurs#c118192
-$colors: (
-  blue: (
-    light: #dae6f0,
-    light-2: #4a98d9,
-    normal: #1472bf,
-    normal-piv: #095797,
-    medium: #19406c,
-    dark: #223654
-  ),
-  grey: (
-    light: #f1f1f2,
-    light-2: #c5cad2,
-    normal: #8893a2,
-    medium: #6b778a,
-    dark: #4e5662
-  ),
-  red: (
-    pink-light: #ffdbd6,
-    pink: #e58271,
-    normal: #cb381f,
-    dark: #692519
-  ),
-  green: (
-    light: #d7f0bb,
-    normal: #4f813d,
-    dark: #2c4024
-  ),
-  yellow: (
-    light: #f8e69a,
-    normal: #e0ad03,
-    dark: #ad781c
-  )
-);
-
-@function get($color, $name) {
-  @return map.get($colors, $color, $name);
-}