@igo2/core 16.0.0-rc.0 → 16.0.0-rc.2

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

@@ -2523,44 +2523,16 @@ igo-entity-table table.igo-entity-table-with-selection tr.igo-entity-table-row-h
   color: white;
 }
 
+igo-entity-table .mat-mdc-table thead {
+  background-color: #fafafa;
+}
+
 igo-entity-table {
   --mat-table-header-container-height: 52px;
   --mat-table-footer-container-height: 48px;
   --mat-table-row-item-container-height: 48px;
 }
 
-igo-entity-selector {
-  --mat-paginator-container-size: 40px;
-}
-
-igo-entity-selector .mat-mdc-paginator .mat-mdc-form-field-infix {
-  min-height: 40px;
-}
-igo-entity-selector .mat-mdc-paginator .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label {
-  top: 20px;
-}
-igo-entity-selector .mat-mdc-paginator .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(
-          -26.75px)
-          scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));
-  transform: var(--mat-mdc-form-field-label-transform);
-}
-igo-entity-selector .mat-mdc-paginator .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix {
-  padding-top: 8px;
-  padding-bottom: 8px;
-}
-igo-entity-selector .mat-mdc-paginator .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix {
-  padding-top: 8px;
-  padding-bottom: 8px;
-}
-igo-entity-selector .mat-mdc-paginator .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix {
-  padding-top: 8px;
-  padding-bottom: 8px;
-}
-igo-entity-selector .mat-mdc-paginator .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-floating-label {
-  display: none;
-}
-
 igo-entity-selector .mat-mdc-form-field-infix {
   min-height: 48px;
 }
@@ -2589,6 +2561,24 @@ igo-entity-selector .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .
   display: none;
 }
 
+igo-list .mat-mdc-icon-button.mat-mdc-button-base {
+  --mdc-icon-button-state-layer-size: 48px;
+  width: var(--mdc-icon-button-state-layer-size);
+  height: var(--mdc-icon-button-state-layer-size);
+  padding: 12px;
+}
+igo-list .mat-mdc-list-base {
+  --mdc-list-list-item-one-line-container-height: 48px;
+  --mdc-list-list-item-two-line-container-height: 64px;
+  --mdc-list-list-item-three-line-container-height: 88px;
+}
+igo-list .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-one-line, igo-list .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-one-line, igo-list .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line {
+  height: 56px;
+}
+igo-list .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines, igo-list .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines, igo-list .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines {
+  height: 72px;
+}
+
 igo-list [igolistitem][color=primary].igo-list-item-selected > mat-list-item {
   background-color: #164e62;
   color: white;
@@ -2825,14 +2815,6 @@ igo-feature-details > table.igo-striped tbody tr:nth-child(odd) {
   background-color: #1b5f77;
 }
 
-igo-ogc-filter-time-slider {
-  /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
-}
-igo-ogc-filter-time-slider .mat-slider-thumb-label {
-  transform: rotate(45deg) !important;
-  border-radius: 50% 50% 0 !important;
-}
-
 igo-ogc-filter-selection mat-button-toggle.mat-button-toggle-checked {
   background-color: #8ba7b1;
   color: #424242;
@@ -2887,11 +2869,6 @@ igo-layer-item.igo-layer-item-focused > mat-list-item {
   color: white;
 }
 
-/* TODO(mdc-migration): The following rule targets internal classes of menu that may no longer apply for the MDC version. */
-.mat-menu-opacity-slider {
-  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.5), 0 4px 5px 0 rgba(0, 0, 0, 0.15), 0 1px 10px 0 rgba(0, 0, 0, 0.4);
-}
-
 igo-map-browser div.ol-attribution > button {
   color: #164e62;
   background-color: white;
@@ -2920,18 +2897,14 @@ igo-zoom-button > div.igo-zoom-button-container > button.mat-accent {
   background-color: black;
 }
 
-igo-menu-button > #menu-button {
-  color: #164e62;
-}
-
-igo-menu-button > #menu-button.menu-button-reverse-color-close {
+igo-menu-button > button#menu-button {
+  color: rgb(255, 255, 255);
   background-color: #164e62;
-  color: white;
 }
 
-igo-menu-button > #menu-button.menu-button-reverse-color {
-  background-color: #164e62;
-  color: white;
+igo-menu-button > button#menu-button.menu-button-white-background {
+  color: #164e62;
+  background-color: rgb(255, 255, 255);
 }
 
 .igo-map-tooltip-measure {
@@ -2983,4 +2956,25 @@ igo-search-bar .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-m
 igo-confirmation-popup-component h1 {
   font-size: 32px;
   font-family: Roboto, "Helvetica Neue", sans-serif;
+}
+
+igo-catalog-browser .mat-mdc-icon-button.mat-mdc-button-base {
+  --mdc-icon-button-state-layer-size: 40px;
+  width: var(--mdc-icon-button-state-layer-size);
+  height: var(--mdc-icon-button-state-layer-size);
+  padding: 8px;
+}
+igo-catalog-browser .mat-mdc-icon-button.mat-mdc-button-base .mat-mdc-button-touch-target {
+  display: none;
+}
+igo-catalog-browser .mat-mdc-list-base {
+  --mdc-list-list-item-one-line-container-height: 40px;
+  --mdc-list-list-item-two-line-container-height: 56px;
+  --mdc-list-list-item-three-line-container-height: 80px;
+}
+igo-catalog-browser .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-one-line, igo-catalog-browser .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-one-line, igo-catalog-browser .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line {
+  height: 48px;
+}
+igo-catalog-browser .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines, igo-catalog-browser .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines, igo-catalog-browser .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines {
+  height: 64px;
 }

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

@@ -1,67 +1,67 @@
-@use 'sass:map';
-@use '@angular/material' as mat;
-@use '../../index' as igo;
-
-$bluedark-palette: (
-  50: #e3eaec,
-  100: #b9cad0,
-  200: #8ba7b1,
-  300: #5c8391,
-  400: #39697a,
-  500: #164e62,
-  600: #13475a,
-  700: #103d50,
-  800: #0c3546,
-  900: #062534,
-  A100: #6dc6ff,
-  A200: #3ab2ff,
-  A400: #079eff,
-  A700: #0090ec,
-  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
-  )
-);
-
-$primary: mat.define-palette($bluedark-palette, 500);
-$accent: mat.define-palette($bluedark-palette, 200);
-$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
-  )
-);
-
-$foreground: igo.theme-foreground(mat.define-palette(mat.$grey-palette, 900));
-$theme: map.merge(
-  $theme,
-  (
-    foreground: $foreground
-  )
-);
-
-@include mat.core();
-@include mat.typography-hierarchy($typography);
-@include mat.all-component-themes($theme);
-
-@include igo.all-component-themes($theme);
+@use 'sass:map';
+@use '@angular/material' as mat;
+@use '../../index' as igo;
+
+$bluedark-palette: (
+  50: #e3eaec,
+  100: #b9cad0,
+  200: #8ba7b1,
+  300: #5c8391,
+  400: #39697a,
+  500: #164e62,
+  600: #13475a,
+  700: #103d50,
+  800: #0c3546,
+  900: #062534,
+  A100: #6dc6ff,
+  A200: #3ab2ff,
+  A400: #079eff,
+  A700: #0090ec,
+  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
+  )
+);
+
+$primary: mat.define-palette($bluedark-palette, 500);
+$accent: mat.define-palette($bluedark-palette, 200);
+$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
+  )
+);
+
+$foreground: igo.theme-foreground(mat.define-palette(mat.$grey-palette, 900));
+$theme: map.merge(
+  $theme,
+  (
+    foreground: $foreground
+  )
+);
+
+@include mat.core();
+@include mat.typography-hierarchy($typography);
+@include mat.all-component-themes($theme);
+
+@include igo.all-component-themes($theme);

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

@@ -2523,44 +2523,16 @@ igo-entity-table table.igo-entity-table-with-selection tr.igo-entity-table-row-h
   color: white;
 }
 
+igo-entity-table .mat-mdc-table thead {
+  background-color: #fafafa;
+}
+
 igo-entity-table {
   --mat-table-header-container-height: 52px;
   --mat-table-footer-container-height: 48px;
   --mat-table-row-item-container-height: 48px;
 }
 
-igo-entity-selector {
-  --mat-paginator-container-size: 40px;
-}
-
-igo-entity-selector .mat-mdc-paginator .mat-mdc-form-field-infix {
-  min-height: 40px;
-}
-igo-entity-selector .mat-mdc-paginator .mat-mdc-text-field-wrapper .mat-mdc-form-field-flex .mat-mdc-floating-label {
-  top: 20px;
-}
-igo-entity-selector .mat-mdc-paginator .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(
-          -26.75px)
-          scale(var(--mat-mdc-form-field-floating-label-scale, 0.75));
-  transform: var(--mat-mdc-form-field-label-transform);
-}
-igo-entity-selector .mat-mdc-paginator .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix {
-  padding-top: 8px;
-  padding-bottom: 8px;
-}
-igo-entity-selector .mat-mdc-paginator .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-form-field-infix {
-  padding-top: 8px;
-  padding-bottom: 8px;
-}
-igo-entity-selector .mat-mdc-paginator .mdc-text-field--no-label:not(.mdc-text-field--outlined):not(.mdc-text-field--textarea) .mat-mdc-form-field-infix {
-  padding-top: 8px;
-  padding-bottom: 8px;
-}
-igo-entity-selector .mat-mdc-paginator .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-mdc-floating-label {
-  display: none;
-}
-
 igo-entity-selector .mat-mdc-form-field-infix {
   min-height: 48px;
 }
@@ -2589,6 +2561,24 @@ igo-entity-selector .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .
   display: none;
 }
 
+igo-list .mat-mdc-icon-button.mat-mdc-button-base {
+  --mdc-icon-button-state-layer-size: 48px;
+  width: var(--mdc-icon-button-state-layer-size);
+  height: var(--mdc-icon-button-state-layer-size);
+  padding: 12px;
+}
+igo-list .mat-mdc-list-base {
+  --mdc-list-list-item-one-line-container-height: 48px;
+  --mdc-list-list-item-two-line-container-height: 64px;
+  --mdc-list-list-item-three-line-container-height: 88px;
+}
+igo-list .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-one-line, igo-list .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-one-line, igo-list .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line {
+  height: 56px;
+}
+igo-list .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines, igo-list .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines, igo-list .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines {
+  height: 72px;
+}
+
 igo-list [igolistitem][color=primary].igo-list-item-selected > mat-list-item {
   background-color: #095797;
   color: white;
@@ -2825,14 +2815,6 @@ igo-feature-details > table.igo-striped tbody tr:nth-child(odd) {
   background-color: #0a65af;
 }
 
-igo-ogc-filter-time-slider {
-  /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
-}
-igo-ogc-filter-time-slider .mat-slider-thumb-label {
-  transform: rotate(45deg) !important;
-  border-radius: 50% 50% 0 !important;
-}
-
 igo-ogc-filter-selection mat-button-toggle.mat-button-toggle-checked {
   background-color: #0d81df;
   color: #424242;
@@ -2887,11 +2869,6 @@ igo-layer-item.igo-layer-item-focused > mat-list-item {
   color: white;
 }
 
-/* TODO(mdc-migration): The following rule targets internal classes of menu that may no longer apply for the MDC version. */
-.mat-menu-opacity-slider {
-  box-shadow: 0 2px 4px -1px rgba(0, 0, 0, 0.5), 0 4px 5px 0 rgba(0, 0, 0, 0.15), 0 1px 10px 0 rgba(0, 0, 0, 0.4);
-}
-
 igo-map-browser div.ol-attribution > button {
   color: #095797;
   background-color: white;
@@ -2920,18 +2897,14 @@ igo-zoom-button > div.igo-zoom-button-container > button.mat-accent {
   background-color: black;
 }
 
-igo-menu-button > #menu-button {
-  color: #095797;
-}
-
-igo-menu-button > #menu-button.menu-button-reverse-color-close {
+igo-menu-button > button#menu-button {
+  color: rgb(255, 255, 255);
   background-color: #095797;
-  color: white;
 }
 
-igo-menu-button > #menu-button.menu-button-reverse-color {
-  background-color: #095797;
-  color: white;
+igo-menu-button > button#menu-button.menu-button-white-background {
+  color: #095797;
+  background-color: rgb(255, 255, 255);
 }
 
 .igo-map-tooltip-measure {
@@ -2983,4 +2956,25 @@ igo-search-bar .mat-mdc-text-field-wrapper:not(.mdc-text-field--outlined) .mat-m
 igo-confirmation-popup-component h1 {
   font-size: 32px;
   font-family: Roboto, "Helvetica Neue", sans-serif;
+}
+
+igo-catalog-browser .mat-mdc-icon-button.mat-mdc-button-base {
+  --mdc-icon-button-state-layer-size: 40px;
+  width: var(--mdc-icon-button-state-layer-size);
+  height: var(--mdc-icon-button-state-layer-size);
+  padding: 8px;
+}
+igo-catalog-browser .mat-mdc-icon-button.mat-mdc-button-base .mat-mdc-button-touch-target {
+  display: none;
+}
+igo-catalog-browser .mat-mdc-list-base {
+  --mdc-list-list-item-one-line-container-height: 40px;
+  --mdc-list-list-item-two-line-container-height: 56px;
+  --mdc-list-list-item-three-line-container-height: 80px;
+}
+igo-catalog-browser .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-one-line, igo-catalog-browser .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-one-line, igo-catalog-browser .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-one-line {
+  height: 48px;
+}
+igo-catalog-browser .mat-mdc-list-item.mdc-list-item--with-leading-avatar.mdc-list-item--with-two-lines, igo-catalog-browser .mat-mdc-list-item.mdc-list-item--with-leading-checkbox.mdc-list-item--with-two-lines, igo-catalog-browser .mat-mdc-list-item.mdc-list-item--with-leading-icon.mdc-list-item--with-two-lines {
+  height: 64px;
 }

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

@@ -1,66 +1,66 @@
-@use 'sass:map';
-@use '@angular/material' as mat;
-@use '../../index' as igo;
-
-$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: igo.$igo-typography;
-
-$theme: mat.define-light-theme(
-  (
-    color: (
-      primary: $primary,
-      accent: $accent,
-      warn: $warn
-    ),
-    typography: $typography,
-    density: 0
-  )
-);
-
-$theme: map.merge(
-  $theme,
-  (
-    foreground: igo.theme-foreground(mat.define-palette(mat.$grey-palette, 900))
-  )
-);
-
-@include mat.core();
-@include mat.typography-hierarchy($typography);
-@include mat.all-component-themes($theme);
-
-@include igo.all-component-themes($theme);
+@use 'sass:map';
+@use '@angular/material' as mat;
+@use '../../index' as igo;
+
+$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: igo.$igo-typography;
+
+$theme: mat.define-light-theme(
+  (
+    color: (
+      primary: $primary,
+      accent: $accent,
+      warn: $warn
+    ),
+    typography: $typography,
+    density: 0
+  )
+);
+
+$theme: map.merge(
+  $theme,
+  (
+    foreground: igo.theme-foreground(mat.define-palette(mat.$grey-palette, 900))
+  )
+);
+
+@include mat.core();
+@include mat.typography-hierarchy($typography);
+@include mat.all-component-themes($theme);
+
+@include igo.all-component-themes($theme);