@sumaris-net/ngx-components 18.6.42 → 18.6.44

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/doc/changelog.md CHANGED
@@ -1184,3 +1184,6 @@ enh: Environment: add useHash property to configure Angular router to use hash U
1184
1184
 
1185
1185
  # 18.6.39
1186
1186
  - enh(pipes) Add some pipes for observables : `firstTrue`, `firstFalse`, `first`
1187
+
1188
+ # 18.6.42
1189
+ - fix(theme) Redirect CSS variables `--mat-sidenav-*` to theme variables `--ion-*` (need for dark theme)
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@sumaris-net/ngx-components",
3
3
  "description": "SUMARiS Angular components",
4
- "version": "18.6.42",
4
+ "version": "18.6.44",
5
5
  "author": "contact@e-is.pro",
6
6
  "license": "AGPL-3.0",
7
7
  "readmeFilename": "README.md",
@@ -2,7 +2,7 @@
2
2
  "name": "ngx-sumaris-components",
3
3
  "short_name": "ngx-sumaris-components",
4
4
  "manifest_version": 1,
5
- "version": "18.6.42",
5
+ "version": "18.6.44",
6
6
  "default_locale": "fr",
7
7
  "description": "Angular components for building beautiful and responsive Apps",
8
8
  "icons": [{
@@ -133,13 +133,6 @@
133
133
  --mat-toolbar-container-text-color: var(--ion-text-color);
134
134
  --mat-table-background-color: var(--ion-background-color);
135
135
 
136
- --mat-sidenav-container-text-color: var(--ion-text-color);
137
- --mat-sidenav-container-background-color: var(--ion-background-color);
138
- --mat-sidenav-content-text-color: var(--ion-text-color);
139
- --mat-sidenav-content-background-color: var(--ion-background-color);
140
- --mat-sidenav-container-elevation-shadow: 4px 0px 16px rgba(0, 0, 0, 0.18);
141
- --mat-sidenav-scrim-color: rgba(var(--ion-backdrop-color-rgb), var(--ion-backdrop-opacity));
142
-
143
136
  --as-gutter-background-color: var(--ion-toolbar-background);
144
137
 
145
138
  --app-table-header-height: #{$app-table-header-height};
@@ -6,7 +6,7 @@ html {
6
6
  }
7
7
 
8
8
  *::selection {
9
- background: var(--ion-color-shade, rgba(0, 0, 0, 0.3));
9
+ background: var(--ion-color-shade, rgba(var(--ion-color-text-rgb, 0, 0, 0), 0.3));
10
10
  }
11
11
 
12
12
  // Text style
@@ -646,6 +646,14 @@ mat-button-toggle.mat-button-toggle-checked.mat-button-toggle-disabled {
646
646
  @include font-size(12px);
647
647
  }
648
648
 
649
+ .mat-mdc-menu-content {
650
+ .mat-mdc-menu-item {
651
+ --mat-menu-item-label-text-color: var(--ion-text-color);
652
+ // Required for the dark theme (otherwise the icon will be dark)
653
+ --mat-menu-item-icon-color: rgba(var(--ion-text-color-rgb, 255, 255, 255), 0.54);
654
+ }
655
+ }
656
+
649
657
  .mat-mdc-menu-content ion-item > ion-icon[slot="start"] {
650
658
  margin-right: 16px;
651
659
  vertical-align: middle;
@@ -955,6 +963,19 @@ ion-refresher.refresher-native {
955
963
  z-index: 1000;
956
964
  }
957
965
 
966
+ // --------------------------------------------------
967
+ // Mat Side
968
+ // --------------------------------------------------
969
+ .mat-drawer-container {
970
+ --mat-sidenav-container-text-color: var(--ion-text-color);
971
+ --mat-sidenav-container-background-color: var(--ion-background-color);
972
+ --mat-sidenav-container-divider-color: var(--ion-border-color, rgba(0, 0, 0, 0.12));
973
+ --mat-sidenav-container-elevation-shadow: 4px 0px 16px rgba(0, 0, 0, 0.18);
974
+ --mat-sidenav-content-text-color: var(--ion-text-color);
975
+ --mat-sidenav-content-background-color: var(--ion-background-color);
976
+ --mat-sidenav-scrim-color: rgba(var(--ion-backdrop-color-rgb), var(--ion-backdrop-opacity));
977
+ }
978
+
958
979
  // --------------------------------------------------
959
980
  // Named filter
960
981
  // --------------------------------------------------