@sumaris-net/ngx-components 18.6.65 → 18.6.67

package/package.json

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

package/src/app/core/home/home.d.ts

@@ -32,6 +32,7 @@ export interface HomePageState {
     showLegalInformation: boolean;
     showInstallLinks: boolean;
     pageHistory: HistoryPageReference[];
+    darkMode: boolean;
 }
 export declare class HomePage extends RxState<HomePageState> implements OnDestroy {
     private accountService;
@@ -49,6 +50,7 @@ export declare class HomePage extends RxState<HomePageState> implements OnDestro
     private readonly _debug;
     private _subscription;
     private _config;
+    protected darkMode$: import("rxjs").Observable<boolean>;
     protected pageHistory$: import("rxjs").Observable<HistoryPageReference[]>;
     protected loading$: import("rxjs").Observable<boolean>;
     protected readonly mobile: boolean;
@@ -79,6 +81,8 @@ export declare class HomePage extends RxState<HomePageState> implements OnDestro
     get showLegalInformation(): boolean;
     set showInstallLinks(value: boolean);
     get showInstallLinks(): boolean;
+    set darkMode(value: boolean);
+    get darkMode(): boolean;
     get currentLocaleCode(): string;
     get partnerBannerSize(): number;
     constructor(accountService: AccountService, modalCtrl: ModalController, translate: TranslateService, toastController: ToastController, configService: ConfigService, platform: PlatformService, cd: ChangeDetectorRef, network: NetworkService, settings: LocalSettingsService, environment: Environment, locales: LocaleConfig[], buttons: IMenuItem[]);
@@ -97,6 +101,7 @@ export declare class HomePage extends RxState<HomePageState> implements OnDestro
     protected onLogout(): void;
     protected refreshButtons(account?: Account): void;
     openMarkdownModal(event?: Event, item?: IMenuItem): Promise<void>;
+    protected toggleDarkMode(): Promise<void>;
     protected removePageHistory(path: string): Promise<void>;
     protected markForCheck(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<HomePage, [null, null, null, null, null, null, null, null, null, null, null, { optional: true; }]>;

package/src/app/core/services/platform.service.d.ts

@@ -92,6 +92,7 @@ export declare class PlatformService extends StartableService {
     } & Partial<DownloadRequest>): Observable<string | undefined>;
     copyToClipboard(data: string | WriteOptions, opts?: ShowToastOptions): Promise<void>;
     toggleDarkTheme(enable: boolean): void;
+    toggleHighContrast(enable: boolean): void;
     showToast(opts: ShowToastOptions): Promise<HTMLIonToastElement>;
     closeToast(id?: string): Promise<boolean>;
     protected configureTheme(mobile: boolean, win?: any): Promise<void>;

package/src/assets/i18n/en-US.json

@@ -261,6 +261,7 @@
     "BTN_DISCONNECT": "Disconnect this account",
     "BTN_MY_ACCOUNT": "My account",
     "BTN_REGISTER": "Register",
+    "BTN_DARK_MODE": "Dark or light theme",
     "SHOW_AT": "Show at",
     "LEGAL_INFORMATION": "Legal information",
     "PRIVACY_POLICY": "Privacy policy",

package/src/assets/i18n/en.json

@@ -63,6 +63,7 @@
     "BTN_DECIMAL_SEPARATOR": ".",
     "EMPTY_OPTION": "(Empty)",
     "All_OPTION": "(All)",
+
     "DATE_PATTERN": "DD/MM/YYYY",
     "DATE_TIME_PATTERN": "DD/MM/YYYY HH:mm",
     "DATE_TIME_SECONDS_PATTERN": "DD/MM/YYYY HH:mm:ss",
@@ -260,6 +261,7 @@
     "BTN_DISCONNECT": "Disconnect this account",
     "BTN_MY_ACCOUNT": "My account",
     "BTN_REGISTER": "Register",
+    "BTN_DARK_MODE": "Dark or light theme",
     "SHOW_AT": "Show at",
     "LEGAL_INFORMATION": "Legal information",
     "PRIVACY_POLICY": "Privacy policy",

package/src/assets/i18n/fr.json

@@ -260,6 +260,7 @@
     "BTN_DISCONNECT": "Déconnecter ce compte",
     "BTN_MY_ACCOUNT": "Mon compte",
     "BTN_REGISTER": "S'inscrire",
+    "BTN_DARK_MODE": "Thème (sombre ou clair)",
     "SHOW_AT": "Consulté le ",
     "LEGAL_INFORMATION": "Informations légales",
     "PRIVACY_POLICY": "Politique de confidentialité",
@@ -414,7 +415,7 @@
     "NETWORK_DIVIDER": "Paramètres réseau",
     "PEER_URL": "Adresse du nœud réseau",
     "BTN_CHANGE_PEER": "Voir les nœuds disponibles",
-    "BTN_DARK_MODE": "Mode sombre ? (expérimental)",
+    "BTN_DARK_MODE": "Thème sombre ? (expérimental)",
     "BTN_SHOW_ACCOUNT": "Voir mon compte",
     "BTN_SHOW_MORE_HELP": "Afficher plus de paramètres",
     "BTN_SHOW_OPTION_KEY": "Afficher le code des options ?",

package/src/assets/manifest.json

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

package/src/theme/_material.scss

@@ -208,3 +208,9 @@ mat-icon[slot] {
   }
 
 }
+
+// Mat dialog (e.g. timepicker)
+.mat-mdc-dialog-container {
+  --mdc-dialog-container-color: var(--ion-background-color);
+  --mdc-dialog-supporting-text-color: var(--ion-text-color);
+}

package/src/theme/_mixins.scss

@@ -188,8 +188,6 @@
   --app-form-color-rgb: #{$background-color-rgb-value};
   --app-form-field-focus-background-color: rgba(#{$background-color-rgb-value}, 0.87);
 
-  --mdc-dialog-container-color: var(--ion-background-color);
-
   // Step colors
   --ion-color-step-50: #{$text-color-step-50};
   --ion-color-step-100: #{$text-color-step-100};

package/src/theme/_ngx-components.scss

@@ -751,9 +751,15 @@ mat-calendar {
       --mat-toolbar-container-background-color: var(--ion-color-accent);
       --mat-toolbar-container-text-color: var(--ion-color-accent-contrast);
     }
-    button.mat-mdc-mini-fab.mat-accent {
-      --mdc-fab-small-container-color: var(--ion-color-accent);
-      --mat-fab-small-foreground-color: var(--ion-color-accent-contrast);
+    button.mat-mdc-mini-fab {
+      &.mat-unthemed {
+        --mat-fab-small-foreground-color: var(--ion-text-color);
+      }
+
+      &.mat-accent {
+        --mdc-fab-small-container-color: var(--ion-color-accent);
+        --mat-fab-small-foreground-color: var(--ion-color-accent-contrast);
+      }
     }
   }
 }