@igo2/core 16.1.1 → 16.3.0

package/theming/prebuilt-themes/dark-theme.css

@@ -2942,40 +2942,34 @@ igo-search-bar mat-form-field .mat-mdc-form-field-focus-overlay {
 }
 
 igo-search-bar .mat-mdc-form-field-infix {
-  min-height: 48px;
+  min-height: 56px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label {
-  top: 24px;
+  top: 28px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
   --mat-mdc-form-field-label-transform: translateY(
-          -30.75px)
+          -34.75px)
           scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));
   transform: var(--mat-mdc-form-field-label-transform);
 }
 igo-search-bar .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
+  padding-top: 16px;
+  padding-bottom: 16px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
+  padding-top: 24px;
+  padding-bottom: 8px;
 }
 igo-search-bar .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
-}
-igo-search-bar .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-floating-label {
-  display: none;
+  padding-top: 16px;
+  padding-bottom: 16px;
 }
 igo-search-bar .mat-mdc-icon-button.mat-mdc-button-base {
-  --mdc-icon-button-state-layer-size: 40px;
+  --mdc-icon-button-state-layer-size: 48px;
   width: var(--mdc-icon-button-state-layer-size);
   height: var(--mdc-icon-button-state-layer-size);
-  padding: 8px;
-}
-igo-search-bar .mat-mdc-icon-button.mat-mdc-button-base .mat-mdc-button-touch-target {
-  display: none;
+  padding: 12px;
 }
 
 igo-search-bar mat-form-field .mdc-line-ripple {

package/theming/prebuilt-themes/deeppurple-theme.css

@@ -2935,40 +2935,34 @@ igo-search-bar mat-form-field .mat-mdc-form-field-focus-overlay {
 }
 
 igo-search-bar .mat-mdc-form-field-infix {
-  min-height: 48px;
+  min-height: 56px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label {
-  top: 24px;
+  top: 28px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
   --mat-mdc-form-field-label-transform: translateY(
-          -30.75px)
+          -34.75px)
           scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));
   transform: var(--mat-mdc-form-field-label-transform);
 }
 igo-search-bar .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
+  padding-top: 16px;
+  padding-bottom: 16px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
+  padding-top: 24px;
+  padding-bottom: 8px;
 }
 igo-search-bar .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
-}
-igo-search-bar .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-floating-label {
-  display: none;
+  padding-top: 16px;
+  padding-bottom: 16px;
 }
 igo-search-bar .mat-mdc-icon-button.mat-mdc-button-base {
-  --mdc-icon-button-state-layer-size: 40px;
+  --mdc-icon-button-state-layer-size: 48px;
   width: var(--mdc-icon-button-state-layer-size);
   height: var(--mdc-icon-button-state-layer-size);
-  padding: 8px;
-}
-igo-search-bar .mat-mdc-icon-button.mat-mdc-button-base .mat-mdc-button-touch-target {
-  display: none;
+  padding: 12px;
 }
 
 igo-search-bar mat-form-field .mdc-line-ripple {

package/theming/prebuilt-themes/indigo-theme.css

@@ -2935,40 +2935,34 @@ igo-search-bar mat-form-field .mat-mdc-form-field-focus-overlay {
 }
 
 igo-search-bar .mat-mdc-form-field-infix {
-  min-height: 48px;
+  min-height: 56px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label {
-  top: 24px;
+  top: 28px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
   --mat-mdc-form-field-label-transform: translateY(
-          -30.75px)
+          -34.75px)
           scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));
   transform: var(--mat-mdc-form-field-label-transform);
 }
 igo-search-bar .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
+  padding-top: 16px;
+  padding-bottom: 16px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
+  padding-top: 24px;
+  padding-bottom: 8px;
 }
 igo-search-bar .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
-}
-igo-search-bar .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-floating-label {
-  display: none;
+  padding-top: 16px;
+  padding-bottom: 16px;
 }
 igo-search-bar .mat-mdc-icon-button.mat-mdc-button-base {
-  --mdc-icon-button-state-layer-size: 40px;
+  --mdc-icon-button-state-layer-size: 48px;
   width: var(--mdc-icon-button-state-layer-size);
   height: var(--mdc-icon-button-state-layer-size);
-  padding: 8px;
-}
-igo-search-bar .mat-mdc-icon-button.mat-mdc-button-base .mat-mdc-button-touch-target {
-  display: none;
+  padding: 12px;
 }
 
 igo-search-bar mat-form-field .mdc-line-ripple {

package/theming/prebuilt-themes/orange-theme.css

@@ -2935,40 +2935,34 @@ igo-search-bar mat-form-field .mat-mdc-form-field-focus-overlay {
 }
 
 igo-search-bar .mat-mdc-form-field-infix {
-  min-height: 48px;
+  min-height: 56px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label {
-  top: 24px;
+  top: 28px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
   --mat-mdc-form-field-label-transform: translateY(
-          -30.75px)
+          -34.75px)
           scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));
   transform: var(--mat-mdc-form-field-label-transform);
 }
 igo-search-bar .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
+  padding-top: 16px;
+  padding-bottom: 16px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
+  padding-top: 24px;
+  padding-bottom: 8px;
 }
 igo-search-bar .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
-}
-igo-search-bar .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-floating-label {
-  display: none;
+  padding-top: 16px;
+  padding-bottom: 16px;
 }
 igo-search-bar .mat-mdc-icon-button.mat-mdc-button-base {
-  --mdc-icon-button-state-layer-size: 40px;
+  --mdc-icon-button-state-layer-size: 48px;
   width: var(--mdc-icon-button-state-layer-size);
   height: var(--mdc-icon-button-state-layer-size);
-  padding: 8px;
-}
-igo-search-bar .mat-mdc-icon-button.mat-mdc-button-base .mat-mdc-button-touch-target {
-  display: none;
+  padding: 12px;
 }
 
 igo-search-bar mat-form-field .mdc-line-ripple {

package/theming/prebuilt-themes/teal-theme.css

@@ -2935,40 +2935,34 @@ igo-search-bar mat-form-field .mat-mdc-form-field-focus-overlay {
 }
 
 igo-search-bar .mat-mdc-form-field-infix {
-  min-height: 48px;
+  min-height: 56px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label {
-  top: 24px;
+  top: 28px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mdc-notched-outline--upgraded .mdc-floating-label--float-above {
   --mat-mdc-form-field-label-transform: translateY(
-          -30.75px)
+          -34.75px)
           scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));
   transform: var(--mat-mdc-form-field-label-transform);
 }
 igo-search-bar .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
+  padding-top: 16px;
+  padding-bottom: 16px;
 }
 igo-search-bar .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
+  padding-top: 24px;
+  padding-bottom: 8px;
 }
 igo-search-bar .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix {
-  padding-top: 12px;
-  padding-bottom: 12px;
-}
-igo-search-bar .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-floating-label {
-  display: none;
+  padding-top: 16px;
+  padding-bottom: 16px;
 }
 igo-search-bar .mat-mdc-icon-button.mat-mdc-button-base {
-  --mdc-icon-button-state-layer-size: 40px;
+  --mdc-icon-button-state-layer-size: 48px;
   width: var(--mdc-icon-button-state-layer-size);
   height: var(--mdc-icon-button-state-layer-size);
-  padding: 8px;
-}
-igo-search-bar .mat-mdc-icon-button.mat-mdc-button-base .mat-mdc-button-touch-target {
-  display: none;
+  padding: 12px;
 }
 
 igo-search-bar mat-form-field .mdc-line-ripple {

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);
-}

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

@@ -1,50 +0,0 @@
-@use 'sass:map';
-@use 'sass:color';
-@use './colors';
-
-$blue-light: colors.get(blue, light);
-$blue-light-2: colors.get(blue, light-2);
-$blue-normal: colors.get(blue, normal);
-$blue-normal-piv: colors.get(blue, normal-piv);
-$blue-medium: colors.get(blue, medium);
-$blue-dark: colors.get(blue, dark);
-
-// Design Quebec colors
-$primary: $blue-normal-piv;
-$accent: colors.get(red, pink);
-
-$dark-primary-text: $blue-dark;
-$light-primary-text: white;
-
-$palette: (
-  50: $blue-light,
-  100: color.adjust($blue-light-2, $lightness: 20%),
-  200: color.adjust($blue-light-2, $lightness: 10%),
-  300: $blue-light-2,
-  400: $blue-normal,
-  500: $primary,
-  600: color.adjust($primary, $lightness: -10%),
-  700: $blue-medium,
-  800: color.adjust($blue-medium, $lightness: -10%),
-  900: $blue-dark,
-  A100: $blue-normal,
-  A200: color.adjust($blue-normal, $lightness: 10%),
-  A400: colors.get(grey, light-2),
-  A700: colors.get(grey, light),
-  contrast: (
-    50: $dark-primary-text,
-    100: $dark-primary-text,
-    200: $dark-primary-text,
-    300: $dark-primary-text,
-    400: $dark-primary-text,
-    500: $light-primary-text,
-    600: $light-primary-text,
-    700: $light-primary-text,
-    800: $light-primary-text,
-    900: $light-primary-text,
-    A100: $dark-primary-text,
-    A200: $light-primary-text,
-    A400: $light-primary-text,
-    A700: $light-primary-text
-  )
-);

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

@@ -1,2 +0,0 @@
-@forward './typography' as typo-*;
-@forward './typography.utils';

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

@@ -1,138 +0,0 @@
-@use 'sass:map';
-@use '@angular/material' as mat;
-@use '../palette';
-@use '../breakpoints';
-@use './typography.utils' as typo-utils;
-
-// https://design.quebec.ca/bases/polices-caracteres
-// https://design.quebec.ca/bases/niveaux-titres
-// https://material.angular.io/guide/typography
-$typography: mat.define-typography-config(
-  $font-family: '"Open Sans", sans-serif',
-  $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(48px, 56px, bold),
-  // h2
-  $headline-6: mat.define-typography-level(36px, 40px, bold),
-  // h3
-  $subtitle-1: mat.define-typography-level(28px, 32px, bold),
-  // h4
-  $subtitle-2: mat.define-typography-level(21px, 24px, bold),
-  $body-1: mat.define-typography-level(16px, 24px, 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)
-);
-
-$typography-mobile: mat.define-typography-config(
-  // h1
-  $headline-5: mat.define-typography-level(36px, 40px, bold),
-  // h2
-  $headline-6: mat.define-typography-level(28px, 32px, bold),
-  // h3
-  $subtitle-1: mat.define-typography-level(25px, 32px, bold)
-);
-
-$font-color: map.get(palette.$palette, 900);
-
-@mixin set-base-styles {
-  body {
-    color: $font-color;
-  }
-
-  a {
-    word-break: break-word;
-    overflow-wrap: break-word;
-    cursor: pointer;
-    color: palette.$primary;
-    text-decoration: underline;
-    background-color: transparent;
-  }
-
-  p,
-  ul,
-  li,
-  u,
-  .text {
-    color: $font-color;
-    font-size: 16px;
-    line-height: 24px;
-  }
-
-  p {
-    margin-bottom: 24px;
-  }
-
-  strong {
-    font-weight: 600;
-  }
-
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6,
-  .h1,
-  .h2,
-  .h3,
-  .h4,
-  .h5,
-  .h6 {
-    font-family: Roboto, sans-serif !important;
-    color: $font-color;
-  }
-
-  h1 {
-    margin-top: 72px !important;
-    margin-bottom: 32px !important;
-
-    @include typo-utils.title-border;
-
-    @include breakpoints.media-breakpoint-down(tablet) {
-      margin-top: 48px !important;
-      margin-bottom: 16px !important;
-    }
-  }
-
-  h2 {
-    margin-top: 48px !important;
-    margin-bottom: 16px !important;
-  }
-
-  h3 {
-    margin-top: 24px !important;
-    margin-bottom: 16px !important;
-  }
-
-  // WORKAROUND, mat-typography area of intersection h4 is using mat-body-1
-  // https://github.com/angular/components/issues/26351
-  h4 {
-    @include typo-utils.title-level-4;
-  }
-
-  h4 {
-    margin-top: 24px !important;
-    margin-bottom: 8px !important;
-  }
-
-  h5 {
-    font-size: 19px !important;
-    line-height: 24px !important;
-  }
-
-  h6 {
-    font-size: 16px !important;
-    line-height: 20px !important;
-  }
-
-  h5,
-  h6 {
-    font-weight: bold !important;
-    margin-top: 16px !important;
-    margin-bottom: 0px !important;
-  }
-}

package/src/theming/prebuilt-themes/qcca/base/typography/typography.utils.scss

@@ -1,18 +0,0 @@
-@use '../palette';
-
-@mixin title-border {
-  &:after {
-    content: '';
-    display: block;
-    margin: 0;
-    width: 48px;
-    padding-top: 4px;
-    border-bottom: 4px solid palette.$accent;
-  }
-}
-
-@mixin title-level-4 {
-  font-size: 21px !important;
-  line-height: 24px !important;
-  font-weight: bold !important;
-}

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

@@ -1,10 +0,0 @@
-@use './button';
-@use './dialog';
-@use './form-field';
-@use './input';
-@use './list';
-@use './panel';
-@use './search-bar';
-@use './scrollbar';
-
-@forward './_index.theme' as all-component-*;

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

@@ -1,5 +0,0 @@
-@use './search-bar.theme' as search-bar;
-
-@mixin themes($theme) {
-  @include search-bar.theme($theme);
-}

package/src/theming/prebuilt-themes/qcca/components/button.scss

@@ -1,24 +0,0 @@
-@use 'sass:map';
-@use '@angular/material' as mat;
-@use '../base';
-
-$color-500: map.get(base.$palette, 500);
-
-.mdc-button {
-  font-size: mat.font-size(base.$typo-typography, body-1) !important;
-  line-height: mat.line-height(base.$typo-typography, body-1) !important;
-  font-weight: bold !important;
-}
-
-.mat-mdc-outlined-button {
-  border: 2px solid currentColor;
-}
-
-.mat-mdc-button-base {
-  border-radius: 0 !important;
-}
-
-.mat-mdc-raised-button {
-  color: $color-500 !important;
-  border-color: $color-500 !important;
-}

package/src/theming/prebuilt-themes/qcca/components/dialog.scss

@@ -1,36 +0,0 @@
-@use '../base';
-
-.mdc-dialog {
-  max-width: 600px;
-
-  &__surface {
-    border-radius: 0 !important;
-  }
-
-  &__title {
-    padding-top: 8px !important; // Workaround, this should be 32px but Material apply a default height for the title.
-    padding-bottom: 24px !important;
-
-    @include base.title-level-4;
-    @include base.title-border;
-  }
-
-  &__tile,
-  &__content,
-  &__actions {
-    padding-left: 32px !important;
-    padding-right: 32px !important;
-  }
-
-  &__actions {
-    padding-top: 24px !important;
-    padding-bottom: 32px !important;
-  }
-
-  .close-button {
-    $iconButtonPadding: 8px;
-    position: absolute;
-    top: 16px - $iconButtonPadding;
-    right: 16px - $iconButtonPadding;
-  }
-}

package/src/theming/prebuilt-themes/qcca/components/form-field.scss

@@ -1,5 +0,0 @@
-.mat-mdc-text-field-wrapper,
-.mdc-notched-outline__leading,
-.mdc-notched-outline__trailing {
-  border-radius: 0 !important;
-}

package/src/theming/prebuilt-themes/qcca/components/input.scss

@@ -1,6 +0,0 @@
-@use 'sass:map';
-@use '../base';
-
-.mat-mdc-input-element {
-  color: base.colors-get(grey, medium) !important;
-}