@sumaris-net/ngx-components 2.7.3-rc70 → 2.7.3-rc71

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sumaris-net/ngx-components",
   "description": "SUMARiS Angular components",
-  "version": "2.7.3-rc70",
+  "version": "2.7.3-rc71",
   "author": "contact@e-is.pro",
   "license": "AGPL-3.0",
   "readmeFilename": "README.md",

package/src/assets/manifest.json

@@ -2,7 +2,7 @@
   "name": "ngx-sumaris-components",
   "short_name": "ngx-sumaris-components",
   "manifest_version": 1,
-  "version": "2.7.3-rc70",
+  "version": "2.7.3-rc71",
   "default_locale": "fr",
   "description": "Angular components for building beautiful and responsive Apps",
   "icons": [{

package/src/theme/_ionic.globals.scss

@@ -54,7 +54,10 @@ $dark:        #222428 !default;
 $transparent: transparent;
 
 // Main background color
-$background-color: #fff !default;
+$background-color-value: #fff;
+$background-color-rgb-value: 255, 255, 255;
+$ion-toolbar-background: withesmoke !default;
+
 // Text color
 $dark-primary-text: rgba(black, 0.87);
 $dark-secondary-text: rgba(black, 0.54);
@@ -68,8 +71,6 @@ $text-color: $dark-primary-text;
 // --------------------------------------------------
 $overlay-background-color: var(--ion-overlay-background-color, #fafafa) !default;
 $ripple-background-color: var(--ion-ripple-background-color, #000) !default;
-$ion-toolbar-background: whitesomke !default;
-
 
 // Default padding
 // --------------------------------------------------

package/src/theme/_material.globals.scss

@@ -68,4 +68,4 @@ $mat-tab-bar-height: 48px !default;
 $mat-tab-animation-duration: 200ms !default;
 $mat-toolbar-height-desktop: 64px !default;
 $mat-toolbar-height-mobile: 56px !default;
-$mat-toolbar-background-color: var(--ion-toolbar-background) !default;
+$mat-toolbar-background-color: var(--ion-toolbar-background, var(--ion-background-color, whitesmoke)) !default;

package/src/theme/_mixins.scss

@@ -98,6 +98,8 @@
   --ion-grid-column-padding: #{$ion-grid-column-padding};
   --ion-padding: #{$ion-padding};
   --ion-margin: #{$ion-margin};
+  --ion-background-color: #{$background-color};
+  --ion-background-color-rgb: #{$background-color-rgb};
   --ion-toolbar-height: #{$ion-toolbar-height};
   --ion-toolbar-background: #{$ion-toolbar-background};
 

package/src/theme/_ngx-components.table.scss

@@ -546,7 +546,7 @@
 // Paginator
 .mat-mdc-paginator {
   --mat-paginator-container-size: var(--app-paginator-height, #{$app-paginator-height});
-  --mat-paginator-container-background-color: var(--ion-toolbar-background, #{$ion-toolbar-background});
+  --mat-paginator-container-background-color: var(--ion-toolbar-background, var(--ion-background-color, #{$ion-toolbar-background}));
   --mat-paginator-container-text-tracking: normal;
   --mat-paginator-container-text-color: var(--app-form-color, #{$app-form-color});
 

package/src/theme/_theme.variables.scss

@@ -1,12 +1,6 @@
-
-/** Ionic CSS Variables **/
+/** Inject all CSS Variables **/
 html {
   @include css-variables-to-root();
-
-  --ion-background-color: white;
-  --ion-background-color-rgb: 255, 255, 255;
-  --ion-toolbar-background: whitesmoke;
-
 }
 
 html.dark {
@@ -82,10 +76,11 @@ html.md.dark {
   --app-form-color: var(--ion-text-color);
 
   --ion-background-color: #121212;
-  --ion-background-color-rgb: 18, 18, 18;
+  --ion-background-color-rgb: 18,18,18; // #{color-to-rgb-list(#121212)};
+  --ion-toolbar-background: #1f1f1f;
 
   --ion-text-color: #ffffffde;
-  --ion-text-color-rgb: 255, 255, 255;
+  --ion-text-color-rgb: 255,255,255; // #{color-to-rgb-list(#ffffff)};
 
   --ion-border-color: #222222;
 
@@ -111,8 +106,6 @@ html.md.dark {
 
   --ion-item-background: #1e1e1e;
 
-  --ion-toolbar-background: #1f1f1f;
-
   --ion-tab-bar-background: #1f1f1f;
 
   --ion-card-background: #1e1e1e;