@sumaris-net/ngx-components 2.7.3-rc37 → 2.7.3-rc39

package/package.json

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

package/src/app/shared/material/datetime/material.datetime.d.ts

@@ -80,7 +80,6 @@ export declare class MatDateTime implements OnInit, AfterViewInit, OnDestroy, Co
     matError: MatError;
     constructor(dateAdapter: MomentDateAdapter, translate: TranslateService, formBuilder: UntypedFormBuilder, cd: ChangeDetectorRef, formGroupDir: FormGroupDirective, defaultOptions?: MatFormFieldDefaultOptions);
     ngOnInit(): void;
-    _getDisplayedMessages(): 'error' | 'hint';
     ngAfterViewInit(): void;
     ngOnDestroy(): void;
     writeValue(value: any): void;
@@ -101,7 +100,7 @@ export declare class MatDateTime implements OnInit, AfterViewInit, OnDestroy, Co
     protected _onBlur(): void;
     protected _checkIfTouched(): void;
     protected _preventEvent(event?: Event): void;
-    private updatePattern;
+    private updateTranslations;
     private onFormChange;
     private emitChange;
     private updateTabIndex;

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-rc37",
+  "version": "2.7.3-rc39",
   "default_locale": "fr",
   "description": "Angular components for building beautiful and responsive Apps",
   "icons": [{

package/src/theme/_material.scss

@@ -67,10 +67,6 @@
   --mat-select-trigger-text-line-height: inherit;
 }
 
-  // Badge
-.mdc-tab .mat-badge-content {
-    padding-left: 2px;
-}
 .mat-badge-primary .mat-badge-content {
   background-color: var(--ion-color-tertiary);
   color: var(--ion-color-tertiary-contrast);

package/src/theme/_ngx-components.scss

@@ -271,6 +271,12 @@ form.form-container {
     }
   }
 
+  .mat-mdc-form-field-subscript-wrapper {
+    mat-hint {
+      --color: rgb(115,115,115);
+      color: var(--color);
+    }
+  }
 
   /* -- Computed field -- */
 

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

@@ -12,21 +12,22 @@
 .mat-mdc-table {
   min-width: calc(100% - 1px);
   border-collapse: separate;
+  --mat-table-row-item-label-text-size: 14px;
+  --mat-table-row-item-label-text-tracking: normal;
   --mat-row-height: #{$app-table-row-height};
   --mat-row-max-height: #{$app-table-row-max-height};
   --mat-cell-horizontal-padding: #{$app-table-cell-horizontal-padding};
   --mat-cell-padding-top: calc(var(--mat-row-height) * 0.5 - 14px);
 
-  --mdc-checkbox-state-layer-size: 20px;
   --mdc-typography-body1-font-size: 14px;
-  --mat-table-row-item-label-text-tracking: normal;
-  --mat-form-field-container-text-tracking: normal;
   --mdc-typography-body1-letter-spacing: normal;
-  --mat-table-row-item-label-text-size: 14px;
 
+  --mat-form-field-container-text-tracking: normal;
+  --mat-form-field-state-layer-color: transparent;
+  --mat-form-field-subscript-text-size: 10px;
+  --mdc-checkbox-state-layer-size: 20px;
   --mdc-filled-text-field-container-color: transparent;
   --mdc-filled-text-field-disabled-container-color: transparent;
-  --mat-form-field-state-layer-color: transparent;
 
   .mat-mdc-header-cell {
     color: var(--ion-color-primary);
@@ -359,11 +360,11 @@
       // Suffix
       .mat-mdc-form-field-icon-suffix {
         white-space: nowrap;
+        padding: 0;
 
         .mat-mdc-icon-button {
-          width: 24px;
-          height: 24px;
-          padding: 2px 0 0 0;
+          --mdc-icon-button-state-layer-size: 24px;
+          padding: 0;
 
           ion-icon, .mat-icon {
             $font-size: calculateRem(18px);
@@ -372,7 +373,7 @@
           }
 
           .mat-mdc-button-touch-target {
-            width: 24px;
+            width: var(--mdc-icon-button-state-layer-size);
           }
         }
 
@@ -390,13 +391,6 @@
         }
       }
 
-      .mat-mdc-form-field-subscript-wrapper,
-      .mat-mdc-form-field-subscript-wrapper.mat-mdc-form-field-bottom-align {
-        margin-top: -1.5rem;
-        text-align: right;
-        pointer-events: none;
-      }
-
       // FIXME: in table, required indicator is only inside the float label
       .mat-mdc-floating-label {
         display: none;
@@ -408,13 +402,19 @@
         color: rgba(0, 0, 0, 0.6) !important;
         -webkit-text-fill-color: rgba(0, 0, 0, 0.6) !important;
       }
-
-      mat-error {
-        font-size: 10px;
-      }
-
     } // .mat-mdc-form-field
 
+    .mat-mdc-form-field-subscript-wrapper,
+    .mat-mdc-form-field-subscript-wrapper.mat-mdc-form-field-bottom-align {
+      margin-top: -1.5rem;
+      text-align: right;
+      pointer-events: none;
+
+      mat-error,
+      mat-hint {
+        font-size: var(--mat-form-field-subscript-text-size);
+      }
+    }
 
     .mat-boolean-field-radio.mat-mdc-form-field-appearance-fill .mat-mdc-form-field-infix,
     .mat-boolean-field-radio .mat-mdc-form-field-infix {
@@ -437,16 +437,20 @@
     mat-date-time-field,
     mat-latlong-field {
       height: calc(var(--mat-row-height) - 2px);
-      .mat-mdc-form-field-subscript-wrapper {
-        margin-top: -1.5rem;
-        text-align: right;
-        pointer-events: none;
-      }
-      mat-error {
-        font-size: 10px;
+    }
+
+    mat-date-time-field {
+      ion-col.hour {
+        --max-width: var(--min-width) !important;
       }
     }
 
+    mat-latlong-field {
+      ion-col.sign {
+        --min-width: 35px !important;
+        --max-width: 45px !important;
+      }
+    }
 
     .mat-mdc-cell > .ion-text-nowrap {
       width: 100%;

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

@@ -35,3 +35,4 @@
 .mat-mdc-tab-group.mat-mdc-tab-disabled-visible .mat-mdc-tab-disabled {
   display: inherit;
 }
+