@igo2/core 16.0.0-rc.8 → 16.0.1

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

@@ -1,36 +1,36 @@
-@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;
-  }
-}
+@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/theming/prebuilt-themes/qcca/components/form-field.scss

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

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

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

package/theming/prebuilt-themes/qcca/components/list.scss

@@ -1,24 +1,24 @@
-@use 'sass:map';
-@use '@angular/material' as mat;
-@use '../base';
-
-// TODO rework this style to be more generic
-
-igo-search-results-item {
-  .mdc-list-item__primary-text {
-    white-space: normal;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    max-height: unset !important;
-    line-height: 18px !important;
-  }
-}
-
-igo-list [igolistitem][color='accent'].igo-list-item-selected > mat-list-item {
-  background-color: map.get(base.$palette, 400);
-
-  h4,
-  small {
-    color: map.get(base.$palette, contrast, 500) !important;
-  }
-}
+@use 'sass:map';
+@use '@angular/material' as mat;
+@use '../base';
+
+// TODO rework this style to be more generic
+
+igo-search-results-item {
+  .mdc-list-item__primary-text {
+    white-space: normal;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-height: unset !important;
+    line-height: 18px !important;
+  }
+}
+
+igo-list [igolistitem][color='accent'].igo-list-item-selected > mat-list-item {
+  background-color: map.get(base.$palette, 400);
+
+  h4,
+  small {
+    color: map.get(base.$palette, contrast, 500) !important;
+  }
+}

package/theming/prebuilt-themes/qcca/components/panel.scss

@@ -1,8 +1,8 @@
-@use 'sass:map';
-@use '../base';
-
-.igo-panel-header,
-.igo-panel-header button,
-.igo-panel-title {
-  color: map.get(base.$palette, contrast, 500) !important;
-}
+@use 'sass:map';
+@use '../base';
+
+.igo-panel-header,
+.igo-panel-header button,
+.igo-panel-title {
+  color: map.get(base.$palette, contrast, 500) !important;
+}

package/theming/prebuilt-themes/qcca/components/search-bar.scss

@@ -1,41 +1,41 @@
-@use 'sass:map';
-@use '@angular/material' as mat;
-@use '../base';
-
-igo-search-bar {
-  // Workaroung, OPEN SANS font add a mysterious 1px for the height
-  .mat-mdc-form-field-infix {
-    max-height: 40px;
-  }
-
-  button[mat-icon-button] {
-    background-color: map.get(base.$palette, 500);
-
-    &:hover {
-      background-color: map.get(base.$palette, 400);
-    }
-  }
-
-  mat-icon {
-    color: map.get(base.$palette, contrast, 500);
-  }
-}
-
-igo-search-results {
-  igo-collapsible {
-    .mdc-list-item__primary-text {
-      color: base.$blue-dark;
-      font-weight: bold;
-    }
-  }
-
-  igo-search-results-item {
-    .mdc-list-item__primary-text {
-      font-weight: normal;
-    }
-  }
-
-  .mdc-list-item--with-leading-icon .mdc-list-item__start {
-    color: base.$blue-dark;
-  }
-}
+@use 'sass:map';
+@use '@angular/material' as mat;
+@use '../base';
+
+igo-search-bar {
+  // Workaroung, OPEN SANS font add a mysterious 1px for the height
+  .mat-mdc-form-field-infix {
+    max-height: 40px;
+  }
+
+  button[mat-icon-button] {
+    background-color: map.get(base.$palette, 500);
+
+    &:hover {
+      background-color: map.get(base.$palette, 400);
+    }
+  }
+
+  mat-icon {
+    color: map.get(base.$palette, contrast, 500);
+  }
+}
+
+igo-search-results {
+  igo-collapsible {
+    .mdc-list-item__primary-text {
+      color: base.$blue-dark;
+      font-weight: bold;
+    }
+  }
+
+  igo-search-results-item {
+    .mdc-list-item__primary-text {
+      font-weight: normal;
+    }
+  }
+
+  .mdc-list-item--with-leading-icon .mdc-list-item__start {
+    color: base.$blue-dark;
+  }
+}

package/theming/prebuilt-themes/qcca/components/search-bar.theme.scss

@@ -1,29 +1,29 @@
-@use 'sass:map';
-@use '@angular/material' as mat;
-
-@mixin theme($theme) {
-  @include density($theme);
-}
-
-@mixin density($theme) {
-  $density: mat.get-density-config($theme);
-
-  $theme4: map.merge(
-    $theme,
-    (
-      density: $density - 4
-    )
-  );
-
-  $theme2: map.merge(
-    $theme,
-    (
-      density: $density - 2
-    )
-  );
-
-  igo-search-bar {
-    @include mat.form-field-density($theme4);
-    @include mat.icon-button-density($theme2);
-  }
-}
+@use 'sass:map';
+@use '@angular/material' as mat;
+
+@mixin theme($theme) {
+  @include density($theme);
+}
+
+@mixin density($theme) {
+  $density: mat.get-density-config($theme);
+
+  $theme4: map.merge(
+    $theme,
+    (
+      density: $density - 4
+    )
+  );
+
+  $theme2: map.merge(
+    $theme,
+    (
+      density: $density - 2
+    )
+  );
+
+  igo-search-bar {
+    @include mat.form-field-density($theme4);
+    @include mat.icon-button-density($theme2);
+  }
+}

package/theming/prebuilt-themes/qcca-theme.scss

@@ -1,47 +1,47 @@
-@use 'sass:map';
-@use '@angular/material' as mat;
-@use '../../' as igo;
-@use './qcca';
-
-// https://design.quebec.ca/a-propos-systeme-design
-$primary: mat.define-palette(qcca.$palette, 500, 400, 700);
-$accent: mat.define-palette(qcca.$palette, 400, 100, 700);
-$warn: mat.define-palette(qcca.$palette, 800);
-$success: mat.define-palette(qcca.$palette, 900);
-$background: mat.define-palette(qcca.$palette, 100, 100, 100);
-$foreground: mat.define-palette(qcca.$palette, 700, 700, 700);
-
-$theme: mat.define-light-theme(
-  (
-    color: (
-      primary: $primary,
-      accent: $accent,
-      warn: $warn,
-      success: $success,
-      background: $background
-    ),
-    typography: qcca.$typo-typography,
-    density: 0
-  )
-);
-
-$theme: map.merge(
-  $theme,
-  (
-    foreground:
-      igo.theme-foreground(mat.define-palette(qcca.$palette, 500, 100, 700))
-  )
-);
-
-@include mat.core();
-@include mat.typography-hierarchy(qcca.$typo-typography);
-@include mat.all-component-themes($theme);
-
-@include igo.all-component-themes($theme);
-@include qcca.all-component-themes($theme);
-
-@media (max-width: 1200px) {
-  @include mat.typography-hierarchy(qcca.$typo-typography-mobile);
-}
-
-@include qcca.typo-set-base-styles();
+@use 'sass:map';
+@use '@angular/material' as mat;
+@use '../../' as igo;
+@use './qcca';
+
+// https://design.quebec.ca/a-propos-systeme-design
+$primary: mat.define-palette(qcca.$palette, 500, 400, 700);
+$accent: mat.define-palette(qcca.$palette, 400, 100, 700);
+$warn: mat.define-palette(qcca.$palette, 800);
+$success: mat.define-palette(qcca.$palette, 900);
+$background: mat.define-palette(qcca.$palette, 100, 100, 100);
+$foreground: mat.define-palette(qcca.$palette, 700, 700, 700);
+
+$theme: mat.define-light-theme(
+  (
+    color: (
+      primary: $primary,
+      accent: $accent,
+      warn: $warn,
+      success: $success,
+      background: $background
+    ),
+    typography: qcca.$typo-typography,
+    density: 0
+  )
+);
+
+$theme: map.merge(
+  $theme,
+  (
+    foreground:
+      igo.theme-foreground(mat.define-palette(qcca.$palette, 500, 100, 700))
+  )
+);
+
+@include mat.core();
+@include mat.typography-hierarchy(qcca.$typo-typography);
+@include mat.all-component-themes($theme);
+
+@include igo.all-component-themes($theme);
+@include qcca.all-component-themes($theme);
+
+@media (max-width: 1200px) {
+  @include mat.typography-hierarchy(qcca.$typo-typography-mobile);
+}
+
+@include qcca.typo-set-base-styles();

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

@@ -1,25 +1,25 @@
-@use '@angular/material' as mat;
-@use '../../index' as igo;
-
-$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: igo.$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 igo.all-component-themes($theme);
+@use '@angular/material' as mat;
+@use '../../index' as igo;
+
+$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: igo.$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 igo.all-component-themes($theme);

package/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)
+  );
+}