mirror of
https://github.com/tomfong/simple-qr.git
synced 2025-06-28 20:19:59 +00:00
chore: upgrade @angular/material, @ionic/storage, @ngx-translate and change to use angularx-qrcode
This commit is contained in:
Tom Fong
parent
f5dd413a93
commit
59791dfb42
17 changed files with 1120 additions and 335 deletions
1209
package-lock.json
generated
1209
package-lock.json
generated
File diff suppressed because it is too large
Load diff
16
package.json
16
package.json
|
|
@ -17,13 +17,13 @@
|
|||
"private": true,
|
||||
"dependencies": {
|
||||
"@angular/animations": "^15.2.9",
|
||||
"@angular/cdk": "^14.2.2",
|
||||
"@angular/cdk": "^15.2.9",
|
||||
"@angular/common": "^15.2.9",
|
||||
"@angular/core": "^15.2.9",
|
||||
"@angular/forms": "^15.2.9",
|
||||
"@angular/localize": "^15.2.9",
|
||||
"@angular/material": "^14.2.2",
|
||||
"@angular/material-moment-adapter": "^14.2.7",
|
||||
"@angular/material": "^15.2.9",
|
||||
"@angular/material-moment-adapter": "^15.2.9",
|
||||
"@angular/platform-browser": "^15.2.9",
|
||||
"@angular/platform-browser-dynamic": "^15.2.9",
|
||||
"@angular/router": "^15.2.9",
|
||||
|
|
@ -52,12 +52,12 @@
|
|||
"@capacitor/status-bar": "^4.1.1",
|
||||
"@capacitor/toast": "^4.1.0",
|
||||
"@ionic/angular": "^6.7.5",
|
||||
"@ionic/storage": "^3.0.6",
|
||||
"@ionic/storage-angular": "^3.0.6",
|
||||
"@ionic/storage": "^4.0.0",
|
||||
"@ionic/storage-angular": "^4.0.0",
|
||||
"@ng-bootstrap/ng-bootstrap": "^14.2.0",
|
||||
"@ngx-translate/core": "^13.0.0",
|
||||
"@ngx-translate/http-loader": "^6.0.0",
|
||||
"@techiediaries/ngx-qrcode": "^9.1.0",
|
||||
"@ngx-translate/core": "^14.0.0",
|
||||
"@ngx-translate/http-loader": "^7.0.0",
|
||||
"angularx-qrcode": "^15.0.1",
|
||||
"bootstrap": "^5.3.0",
|
||||
"cordova-plugin-aes256-encryption": "^2.0.1",
|
||||
"cordova-plugin-chooser": "^1.3.2",
|
||||
|
|
|
|||
|
|
@ -8,11 +8,7 @@ import { QrCodePage } from './qr-code.page';
|
|||
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
|
||||
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { MatFormFieldModule } from '@angular/material/form-field';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatInputModule } from '@angular/material/input';
|
||||
import { MatSelectModule } from '@angular/material/select';
|
||||
import { NgxQRCodeModule } from '@techiediaries/ngx-qrcode';
|
||||
import { QRCodeModule } from 'angularx-qrcode';
|
||||
|
||||
export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
|
||||
return new TranslateHttpLoader(http, './assets/i18n/', '.json');
|
||||
|
|
@ -23,7 +19,7 @@ export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
|
|||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
NgxQRCodeModule,
|
||||
QRCodeModule,
|
||||
TranslateModule.forChild({
|
||||
loader: {
|
||||
provide: TranslateLoader,
|
||||
|
|
|
|||
|
|
@ -11,10 +11,10 @@
|
|||
<div class="d-flex align-items-center justify-content-top flex-column" style="height: 100%;">
|
||||
<ion-row>
|
||||
<ion-col class="ion-text-center ion-padding" style="max-width: 100% !important;">
|
||||
<ngx-qrcode [elementType]="qrElementType" [value]="qrCodeContent" [width]="defaultWidth"
|
||||
<qrcode [elementType]="qrElementType" [qrdata]="qrCodeContent" [width]="defaultWidth"
|
||||
[errorCorrectionLevel]="errorCorrectionLevel" [colorDark]="qrColorDark" [colorLight]="qrColorLight"
|
||||
[margin]="env.qrCodeMargin" #qrcode [hidden]="isSharing">
|
||||
</ngx-qrcode>
|
||||
</qrcode>
|
||||
<div class="d-flex flex-column align-items-center" *ngIf="isSharing">
|
||||
<ion-spinner class="my-3"></ion-spinner>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -6,11 +6,11 @@ import { Haptics, ImpactStyle } from '@capacitor/haptics';
|
|||
import { Toast } from '@capacitor/toast';
|
||||
import { LoadingController, ModalController, Platform } from '@ionic/angular';
|
||||
import { TranslateService } from '@ngx-translate/core';
|
||||
import { NgxQrcodeElementTypes, NgxQrcodeErrorCorrectionLevels, QrcodeComponent } from '@techiediaries/ngx-qrcode';
|
||||
import { EnvService } from 'src/app/services/env.service';
|
||||
import { ScreenBrightness } from '@capacitor-community/screen-brightness';
|
||||
import { rgbToHex } from 'src/app/utils/helpers';
|
||||
import { Preferences } from '@capacitor/preferences';
|
||||
import { QRCodeComponent, QRCodeElementType } from 'angularx-qrcode';
|
||||
|
||||
@Component({
|
||||
selector: 'app-qr-code',
|
||||
|
|
@ -21,11 +21,11 @@ export class QrCodePage {
|
|||
|
||||
modal: HTMLIonModalElement;
|
||||
|
||||
@ViewChild('qrcode') qrcodeElement: QrcodeComponent;
|
||||
@ViewChild('qrcode') qrcodeElement: QRCodeComponent;
|
||||
|
||||
@Input() qrCodeContent: string;
|
||||
qrElementType: NgxQrcodeElementTypes = NgxQrcodeElementTypes.CANVAS;
|
||||
errorCorrectionLevel: NgxQrcodeErrorCorrectionLevels;
|
||||
qrElementType: QRCodeElementType = "canvas";
|
||||
errorCorrectionLevel: 'low' | 'medium' | 'quartile' | 'high' | 'L' | 'M' | 'Q' | 'H';
|
||||
scale: number = 0.8;
|
||||
readonly MAX_WIDTH = 350;
|
||||
defaultWidth: number = window.innerHeight * 0.32 > this.MAX_WIDTH ? this.MAX_WIDTH : window.innerHeight * 0.32;
|
||||
|
|
@ -64,7 +64,6 @@ export class QrCodePage {
|
|||
if (this.qrcodeElement.width > this.MAX_WIDTH) {
|
||||
this.qrcodeElement.width = this.MAX_WIDTH;
|
||||
}
|
||||
this.qrcodeElement.createQRCode();
|
||||
}, 500)
|
||||
}
|
||||
}
|
||||
|
|
@ -99,7 +98,6 @@ export class QrCodePage {
|
|||
if (this.qrcodeElement.width > this.MAX_WIDTH) {
|
||||
this.qrcodeElement.width = this.MAX_WIDTH;
|
||||
}
|
||||
this.qrcodeElement.createQRCode();
|
||||
}
|
||||
})
|
||||
this.modal.onDidDismiss().then(
|
||||
|
|
@ -132,19 +130,19 @@ export class QrCodePage {
|
|||
setErrorCorrectionLevel() {
|
||||
switch (this.env.errorCorrectionLevel) {
|
||||
case 'L':
|
||||
this.errorCorrectionLevel = NgxQrcodeErrorCorrectionLevels.LOW;
|
||||
this.errorCorrectionLevel = 'low';
|
||||
break;
|
||||
case 'M':
|
||||
this.errorCorrectionLevel = NgxQrcodeErrorCorrectionLevels.MEDIUM;
|
||||
this.errorCorrectionLevel = 'medium';
|
||||
break;
|
||||
case 'Q':
|
||||
this.errorCorrectionLevel = NgxQrcodeErrorCorrectionLevels.QUARTILE;
|
||||
this.errorCorrectionLevel = 'quartile';
|
||||
break;
|
||||
case 'H':
|
||||
this.errorCorrectionLevel = NgxQrcodeErrorCorrectionLevels.HIGH;
|
||||
this.errorCorrectionLevel = 'high';
|
||||
break;
|
||||
default:
|
||||
this.errorCorrectionLevel = NgxQrcodeErrorCorrectionLevels.MEDIUM;
|
||||
this.errorCorrectionLevel = 'medium';
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -170,7 +168,6 @@ export class QrCodePage {
|
|||
this.isSharing = true;
|
||||
const currentWidth = this.qrcodeElement.width;
|
||||
this.qrcodeElement.width = 1000;
|
||||
this.qrcodeElement.createQRCode();
|
||||
setTimeout(async () => {
|
||||
const canvases = document.querySelectorAll("canvas") as NodeListOf<HTMLCanvasElement>;
|
||||
const canvas = canvases[canvases.length - 1];
|
||||
|
|
@ -183,7 +180,6 @@ export class QrCodePage {
|
|||
await this.socialSharing.share(this.translate.instant('MSG.SHARE_QR'), this.translate.instant('SIMPLE_QR'), this.qrImageDataUrl, null).then(
|
||||
_ => {
|
||||
this.qrcodeElement.width = currentWidth;
|
||||
this.qrcodeElement.createQRCode();
|
||||
delete this.qrImageDataUrl;
|
||||
this.isSharing = false;
|
||||
loading2.dismiss();
|
||||
|
|
@ -194,7 +190,6 @@ export class QrCodePage {
|
|||
this.presentToast("Error when call SocialSharing.share: " + JSON.stringify(err), "long", "top");
|
||||
}
|
||||
this.qrcodeElement.width = currentWidth;
|
||||
this.qrcodeElement.createQRCode();
|
||||
delete this.qrImageDataUrl;
|
||||
this.isSharing = false;
|
||||
loading2.dismiss();
|
||||
|
|
|
|||
|
|
@ -25,20 +25,22 @@
|
|||
|
||||
<ion-row class="ion-padding-horizontal">
|
||||
<ion-col>
|
||||
<mat-form-field [class]="ngMatThemeClass" color="accent" appearance="legacy">
|
||||
<mat-form-field [class]="ngMatThemeClass" color="accent" appearance="outline" [floatLabel]="'always'">
|
||||
<mat-label>{{ 'CONTENT_TYPE' | translate}}</mat-label>
|
||||
<mat-select [(ngModel)]="contentType">
|
||||
<mat-select-trigger>
|
||||
<div style="display: flex; align-items: center;">
|
||||
<mat-icon style="margin-right: 16px; vertical-align: middle;">
|
||||
{{ getIcon(contentType) }}
|
||||
<div class="d-flex">
|
||||
<mat-icon class="me-3" [fontIcon]="getIcon(contentType)">
|
||||
</mat-icon>
|
||||
<span>{{ getText(contentType) }}</span>
|
||||
</div>
|
||||
</mat-select-trigger>
|
||||
<mat-option [value]="type.value" *ngFor="let type of contentTypes">
|
||||
<mat-icon>{{ getIcon(type.value) }}</mat-icon>
|
||||
<div class="d-flex">
|
||||
<mat-icon class="me-3" [fontIcon]="getIcon(type.value)">
|
||||
</mat-icon>
|
||||
<span>{{ type.text }}</span>
|
||||
</div>
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
|
|
@ -69,7 +71,7 @@
|
|||
<mat-label>{{ 'EMAIL_RECIPIENT' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="toEmails[i]" type="email" maxlength="254" #emailToInput>
|
||||
<mat-hint align="end">{{ emailToInput.value?.length || 0 }}/254</mat-hint>
|
||||
<mat-icon matSuffix color="accent">alternate_email</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="alternate_email"></mat-icon>
|
||||
<mat-hint>{{'MSG.EMAIL_MAX_LENGTH' | translate}}</mat-hint>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
|
|
@ -98,7 +100,7 @@
|
|||
<mat-label>{{ 'CC' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="ccEmails[i]" type="email" maxlength="254" #emailCcInput>
|
||||
<mat-hint align="end">{{ emailCcInput.value?.length || 0 }}/254</mat-hint>
|
||||
<mat-icon matSuffix color="accent">alternate_email</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="alternate_email"></mat-icon>
|
||||
<mat-hint>{{'MSG.EMAIL_MAX_LENGTH' | translate}}</mat-hint>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
|
|
@ -127,7 +129,7 @@
|
|||
<mat-label>{{ 'BCC' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="bccEmails[i]" type="email" maxlength="254" #emailBccInput>
|
||||
<mat-hint align="end">{{ emailBccInput.value?.length || 0 }}/254</mat-hint>
|
||||
<mat-icon matSuffix color="accent">alternate_email</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="alternate_email"></mat-icon>
|
||||
<mat-hint>{{'MSG.EMAIL_MAX_LENGTH' | translate}}</mat-hint>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
|
|
@ -182,7 +184,7 @@
|
|||
<mat-label>{{ 'EMAIL_RECIPIENT' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="toEmails[0]" type="email" maxlength="254" #emailToInput>
|
||||
<mat-hint align="end">{{ emailToInput.value?.length || 0 }}/254</mat-hint>
|
||||
<mat-icon matSuffix color="accent">alternate_email</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="alternate_email"></mat-icon>
|
||||
<mat-hint>{{'MSG.EMAIL_MAX_LENGTH' | translate}}</mat-hint>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
|
|
@ -219,7 +221,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'PHONE_NUMBER' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="phoneNumber" type="tel" #phoneNumberInput>
|
||||
<mat-icon matSuffix color="accent">call</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="call"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -231,7 +233,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'PHONE_NUMBER' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="phoneNumber" type="tel" #phoneNumberInput>
|
||||
<mat-icon matSuffix color="accent">call</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="call"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -254,7 +256,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'URL' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="url" type="url" #urlInput maxlength="1817">
|
||||
<mat-icon matSuffix color="accent">link</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="link"></mat-icon>
|
||||
<mat-hint align="end">{{ (urlInput.value?.length) || 0 }}/1817</mat-hint>
|
||||
<mat-hint>{{'MSG.CREATE_QRCODE_MAX_LENGTH' | translate}}</mat-hint>
|
||||
</mat-form-field>
|
||||
|
|
@ -278,7 +280,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'FIRST_NAME' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="firstName" #firstNameInput />
|
||||
<mat-icon matSuffix color="accent">badge</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="badge"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -287,7 +289,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'LAST_NAME' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="lastName" #lastNameInput />
|
||||
<mat-icon matSuffix color="accent">badge</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="badge"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -306,7 +308,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'MOBILE_PHONE_NUMBER' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="mobilePhoneNumber" #mobilePhoneInput type="tel" />
|
||||
<mat-icon matSuffix color="accent">call</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="call"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -315,7 +317,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'HOME_PHONE_NUMBER' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="homePhoneNumber" #homePhoneInput type="tel" />
|
||||
<mat-icon matSuffix color="accent">call</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="call"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -324,7 +326,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'WORK_PHONE_NUMBER' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="workPhoneNumber" #workPhoneInput type="tel" />
|
||||
<mat-icon matSuffix color="accent">call</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="call"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -333,7 +335,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'FAX_NUMBER' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="faxNumber" #faxInput type="tel" />
|
||||
<mat-icon matSuffix color="accent">print</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="print"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -342,7 +344,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'EMAIL_ADDRESS' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="email" #emailInput type="email" />
|
||||
<mat-icon matSuffix color="accent">alternate_email</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="alternate_email"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -361,7 +363,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'ORGANIZATION' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="organization" #organizationInput type="text" />
|
||||
<mat-icon matSuffix color="accent">business</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="business"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -370,7 +372,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'JOB_TITLE' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="jobTitle" #jobTitleInput type="text" />
|
||||
<mat-icon matSuffix color="accent">business</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="business"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -389,7 +391,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'STREET' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="street" #streetInput type="text" />
|
||||
<mat-icon matSuffix color="accent">home</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="home"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -398,7 +400,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'CITY' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="city" #cityInput type="text" />
|
||||
<mat-icon matSuffix color="accent">home</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="home"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -407,7 +409,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'STATE' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="state" #stateInput type="text" />
|
||||
<mat-icon matSuffix color="accent">home</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="home"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -416,7 +418,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'POSTAL_CODE' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="postalCode" #postalCodeInput type="text" />
|
||||
<mat-icon matSuffix color="accent">home</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="home"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -425,7 +427,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'COUNTRY' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="country" #countryInput type="text" />
|
||||
<mat-icon matSuffix color="accent">home</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="home"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -445,7 +447,7 @@
|
|||
<mat-label>{{ 'DATE_OF_BIRTH' | translate}}</mat-label>
|
||||
<input [ngModel]="birthday | date:'yyyy-MM-dd'" (ngModelChange)="birthday = $event" matInput type="date"
|
||||
[max]="today">
|
||||
<mat-icon matSuffix color="accent">cake</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="cake"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -466,7 +468,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'WEBSITE' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="personalUrl" type="url" #personalUrlInput>
|
||||
<mat-icon matSuffix color="accent">link</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="link"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
@ -478,7 +480,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'WIFI_SSID' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="ssid" #ssidInput maxlength="32">
|
||||
<mat-icon matSuffix color="accent">wifi</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="wifi"></mat-icon>
|
||||
<mat-hint align="end">{{ (ssidInput.value?.length) || 0 }}/32</mat-hint>
|
||||
<mat-hint>{{'MSG.SSID_MAX_LENGTH' | translate}}</mat-hint>
|
||||
</mat-form-field>
|
||||
|
|
@ -489,7 +491,7 @@
|
|||
<mat-form-field [class]="ngMatThemeClass" appearance="outline" color="accent">
|
||||
<mat-label>{{ 'PASSWORD' | translate}}</mat-label>
|
||||
<input matInput [(ngModel)]="wifiPassword" #wifiPasswordInput type="password">
|
||||
<mat-icon matSuffix color="accent">lock</mat-icon>
|
||||
<mat-icon matSuffix color="accent" fontIcon="lock"></mat-icon>
|
||||
</mat-form-field>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
|
|
|
|||
|
|
@ -9,7 +9,6 @@ import { ImportImagePageRoutingModule } from './import-image-routing.module';
|
|||
import { ImportImagePage } from './import-image.page';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
|
||||
|
||||
export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
|
||||
|
|
@ -29,7 +28,6 @@ export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
|
|||
}
|
||||
}),
|
||||
ImportImagePageRoutingModule,
|
||||
MatButtonModule,
|
||||
],
|
||||
declarations: [ImportImagePage]
|
||||
})
|
||||
|
|
|
|||
|
|
@ -7,7 +7,6 @@ import { IonicModule } from '@ionic/angular';
|
|||
import { ResultPageRoutingModule } from './result-routing.module';
|
||||
|
||||
import { ResultPage } from './result.page';
|
||||
import { NgxQRCodeModule } from '@techiediaries/ngx-qrcode';
|
||||
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
|
||||
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
|
||||
import { HttpClient } from '@angular/common/http';
|
||||
|
|
|
|||
|
|
@ -18,8 +18,7 @@
|
|||
<ion-col>
|
||||
<ion-badge class="p-2" color="primary">
|
||||
<div class="d-flex align-items-center">
|
||||
<mat-icon *ngIf="contentTypeIcon != ''" style="margin-right: 16px;">
|
||||
{{ contentTypeIcon }}
|
||||
<mat-icon class="me-3" *ngIf="contentTypeIcon != ''" [fontIcon]="contentTypeIcon">
|
||||
</mat-icon>
|
||||
<span>{{ contentTypeText }}</span>
|
||||
</div>
|
||||
|
|
@ -224,99 +223,99 @@
|
|||
<ng-container *ngIf="env.resultPageButtons === 'detailed'">
|
||||
<ion-row class="ion-padding-horizontal py-2">
|
||||
<div class="d-flex justify-content-between detailed-action-button-container">
|
||||
<ion-button class="pr-1"
|
||||
<ion-button class="pe-1"
|
||||
*ngIf="!resultSaved && this.env.scanRecordLogging == 'off' && this.qrCodeContent != null && this.qrCodeContent != '' "
|
||||
(click)="tapHaptic(); saveRecord()" [color]="env.colorTheme === 'light'? 'dark' : 'light'" fill="outline"
|
||||
shape="round" [@inAnimation]>
|
||||
<ion-icon class="pr-2" src="assets/icon/history.svg"></ion-icon>
|
||||
<ion-icon class="pe-2" src="assets/icon/history.svg"></ion-icon>
|
||||
<ion-label>{{ 'SAVE' | translate }}</ion-label>
|
||||
</ion-button>
|
||||
<ion-button class="pr-1"
|
||||
<ion-button class="pe-1"
|
||||
*ngIf="contentType === 'freeText' && env.showOpenFoodFactsButton === 'on' && isValidEan"
|
||||
(click)="tapHaptic(); searchOpenFoodFacts()" [color]="env.colorTheme === 'light'? 'dark' : 'light'"
|
||||
fill="outline" shape="round" [@inAnimation]>
|
||||
<ion-icon class="pr-2" name="fast-food"></ion-icon>
|
||||
<ion-icon class="pe-2" name="fast-food"></ion-icon>
|
||||
<ion-label>Facts</ion-label>
|
||||
</ion-button>
|
||||
<ion-button class="pr-1" *ngIf="contentType === 'url' && env.showBrowseButton === 'on' && isHttp"
|
||||
<ion-button class="pe-1" *ngIf="contentType === 'url' && env.showBrowseButton === 'on' && isHttp"
|
||||
(click)="tapHaptic(); browseWebsite()" [color]="env.colorTheme === 'light'? 'dark' : 'light'" fill="outline"
|
||||
shape="round" [@inAnimation]>
|
||||
<ion-icon class="pr-2" name="globe"></ion-icon>
|
||||
<ion-icon class="pe-2" name="globe"></ion-icon>
|
||||
<ion-label>{{ 'BROWSE' | translate}}</ion-label>
|
||||
</ion-button>
|
||||
<ion-button class="pr-1" *ngIf="contentType === 'url' && env.showOpenUrlButton === 'on' && !isHttp"
|
||||
<ion-button class="pe-1" *ngIf="contentType === 'url' && env.showOpenUrlButton === 'on' && !isHttp"
|
||||
(click)="tapHaptic(); openLink()" [color]="env.colorTheme === 'light'? 'dark' : 'light'" fill="outline"
|
||||
shape="round" [@inAnimation]>
|
||||
<ion-icon class="pr-2" name="open"></ion-icon>
|
||||
<ion-icon class="pe-2" name="open"></ion-icon>
|
||||
<ion-label>{{ 'OPEN' | translate}}</ion-label>
|
||||
</ion-button>
|
||||
<ion-button class="pr-1"
|
||||
<ion-button class="pe-1"
|
||||
*ngIf="(contentType === 'contact' || contentType === 'phone' || contentType === 'sms') && env.showAddContactButton === 'on'"
|
||||
(click)="tapHaptic(); addContact()" [color]="env.colorTheme === 'light'? 'dark' : 'light'" fill="outline"
|
||||
shape="round" [@inAnimation]>
|
||||
<ion-icon class="pr-2" name="person-add-sharp"></ion-icon>
|
||||
<ion-icon class="pe-2" name="person-add-sharp"></ion-icon>
|
||||
<ion-label>{{ 'ADD' | translate}}</ion-label>
|
||||
</ion-button>
|
||||
<ion-button class="pr-1" *ngIf="contentType === 'phone' && env.showCallButton === 'on'"
|
||||
<ion-button class="pe-1" *ngIf="contentType === 'phone' && env.showCallButton === 'on'"
|
||||
(click)="tapHaptic(); callPhone()" [color]="env.colorTheme === 'light'? 'dark' : 'light'" fill="outline"
|
||||
shape="round" [@inAnimation]>
|
||||
<ion-icon class="pr-2" name="call"></ion-icon>
|
||||
<ion-icon class="pe-2" name="call"></ion-icon>
|
||||
<ion-label>{{ 'CALL' | translate}}</ion-label>
|
||||
</ion-button>
|
||||
<ion-button class="pr-1" *ngIf="contentType === 'sms' && smsContent && env.showSendMessageButton === 'on'"
|
||||
<ion-button class="pe-1" *ngIf="contentType === 'sms' && smsContent && env.showSendMessageButton === 'on'"
|
||||
(click)="tapHaptic(); sendSms()" [color]="env.colorTheme === 'light'? 'dark' : 'light'" fill="outline"
|
||||
shape="round" [@inAnimation]>
|
||||
<ion-icon class="pr-2" name="send"></ion-icon>
|
||||
<ion-icon class="pe-2" name="send"></ion-icon>
|
||||
<ion-label>{{ 'SEND' | translate}}</ion-label>
|
||||
</ion-button>
|
||||
<ion-button class="pr-1"
|
||||
<ion-button class="pe-1"
|
||||
*ngIf="(contentType === 'emailW3C' || contentType === 'emailDocomo') && env.showSendEmailButton === 'on'"
|
||||
(click)="tapHaptic(); sendEmail()" [color]="env.colorTheme === 'light'? 'dark' : 'light'" fill="outline"
|
||||
shape="round" [@inAnimation]>
|
||||
<ion-icon class="pr-2" name="mail"></ion-icon>
|
||||
<ion-icon class="pe-2" name="mail"></ion-icon>
|
||||
<ion-label>{{ 'SEND' | translate}}</ion-label>
|
||||
</ion-button>
|
||||
<ion-button class="pr-1" *ngIf="env.showSearchButton === 'on'" (click)="tapHaptic(); webSearch()"
|
||||
<ion-button class="pe-1" *ngIf="env.showSearchButton === 'on'" (click)="tapHaptic(); webSearch()"
|
||||
[color]="env.colorTheme === 'light'? 'dark' : 'light'" fill="outline" shape="round" [@inAnimation]
|
||||
[disabled]="!qrCodeContent || (qrCodeContent && qrCodeContent.trim().length <= 0)">
|
||||
<ion-icon class="pr-2" *ngIf="env.searchEngine === 'google'" slot="icon-only" name="logo-google">
|
||||
<ion-icon class="pe-2" *ngIf="env.searchEngine === 'google'" slot="icon-only" name="logo-google">
|
||||
</ion-icon>
|
||||
<ion-icon class="pr-2" *ngIf="env.searchEngine === 'bing'" slot="icon-only"
|
||||
<ion-icon class="pe-2" *ngIf="env.searchEngine === 'bing'" slot="icon-only"
|
||||
src="assets/icon/microsoft-bing.svg">
|
||||
</ion-icon>
|
||||
<ion-icon class="pr-2" *ngIf="env.searchEngine === 'yahoo'" slot="icon-only" src="assets/icon/yahoo.svg">
|
||||
<ion-icon class="pe-2" *ngIf="env.searchEngine === 'yahoo'" slot="icon-only" src="assets/icon/yahoo.svg">
|
||||
</ion-icon>
|
||||
<ion-icon class="pr-2" *ngIf="env.searchEngine === 'duckduckgo'" slot="icon-only"
|
||||
<ion-icon class="pe-2" *ngIf="env.searchEngine === 'duckduckgo'" slot="icon-only"
|
||||
src="assets/icon/duck-duck-go.svg">
|
||||
</ion-icon>
|
||||
<ion-icon class="pr-2" *ngIf="env.searchEngine === 'yandex'" slot="icon-only" src="assets/icon/yandex.svg">
|
||||
<ion-icon class="pe-2" *ngIf="env.searchEngine === 'yandex'" slot="icon-only" src="assets/icon/yandex.svg">
|
||||
</ion-icon>
|
||||
<ion-icon class="pr-2" *ngIf="env.searchEngine === 'ecosia'" slot="icon-only" src="assets/icon/ecosia.svg">
|
||||
<ion-icon class="pe-2" *ngIf="env.searchEngine === 'ecosia'" slot="icon-only" src="assets/icon/ecosia.svg">
|
||||
</ion-icon>
|
||||
<ion-label>{{ 'SEARCH' | translate}}</ion-label>
|
||||
</ion-button>
|
||||
<ion-button class="pr-1" *ngIf="env.showCopyButton === 'on'" (click)="tapHaptic(); copyText()"
|
||||
<ion-button class="pe-1" *ngIf="env.showCopyButton === 'on'" (click)="tapHaptic(); copyText()"
|
||||
[color]="env.colorTheme === 'light'? 'dark' : 'light'" fill="outline" shape="round" [@inAnimation]
|
||||
[disabled]="!qrCodeContent || (qrCodeContent && qrCodeContent.trim().length <= 0)">
|
||||
<ion-icon class="pr-2" slot="icon-only" name="copy"></ion-icon>
|
||||
<ion-icon class="pe-2" slot="icon-only" name="copy"></ion-icon>
|
||||
<ion-label>{{ 'COPY' | translate}}</ion-label>
|
||||
</ion-button>
|
||||
<ion-button class="pr-1" *ngIf="env.showBase64Button === 'on'" (click)="tapHaptic(); base64()"
|
||||
<ion-button class="pe-1" *ngIf="env.showBase64Button === 'on'" (click)="tapHaptic(); base64()"
|
||||
[color]="env.colorTheme === 'light'? 'dark' : 'light'" fill="outline" shape="round" [@inAnimation]
|
||||
[disabled]="!qrCodeContent || (qrCodeContent && qrCodeContent.trim().length <= 0)">
|
||||
<ion-icon class="pr-2" slot="icon-only" name="code-working"></ion-icon>
|
||||
<ion-icon class="pe-2" slot="icon-only" name="code-working"></ion-icon>
|
||||
<ion-label>{{ 'BASE64' | translate}}</ion-label>
|
||||
</ion-button>
|
||||
<ion-button class="pr-1" *ngIf="env.showEnlargeButton === 'on'" (click)="tapHaptic(); enlarge()"
|
||||
<ion-button class="pe-1" *ngIf="env.showEnlargeButton === 'on'" (click)="tapHaptic(); enlarge()"
|
||||
[color]="env.colorTheme === 'light'? 'dark' : 'light'" fill="outline" shape="round" [@inAnimation]
|
||||
[disabled]="!qrCodeContent || (qrCodeContent && qrCodeContent.trim().length <= 0)">
|
||||
<ion-icon class="pr-2" slot="icon-only" name="qr-code-sharp"></ion-icon>
|
||||
<ion-icon class="pe-2" slot="icon-only" name="qr-code-sharp"></ion-icon>
|
||||
<ion-label>{{ 'SHOW' | translate}}</ion-label>
|
||||
</ion-button>
|
||||
<ion-button *ngIf="env.showBookmarkButton === 'on'" (click)="tapHaptic(); handleBookmark()"
|
||||
[color]="!bookmarked? (env.colorTheme === 'light'? 'dark' : 'light') : 'warning'" fill="outline" shape="round"
|
||||
[@inAnimation] [disabled]="!qrCodeContent || (qrCodeContent && qrCodeContent.trim().length <= 0)">
|
||||
<ion-icon class="pr-2" slot="icon-only" name="bookmark"></ion-icon>
|
||||
<ion-icon class="pe-2" slot="icon-only" name="bookmark"></ion-icon>
|
||||
<ion-label *ngIf="!bookmarked">{{ 'BOOKMARK' | translate}}</ion-label>
|
||||
<ion-label *ngIf="bookmarked">{{ 'BOOKMARKED' | translate}}</ion-label>
|
||||
</ion-button>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,6 @@ import { SMS } from '@awesome-cordova-plugins/sms/ngx';
|
|||
import { Haptics, ImpactStyle } from '@capacitor/haptics';
|
||||
import { AlertController, LoadingController, ModalController, Platform } from '@ionic/angular';
|
||||
import { TranslateService } from '@ngx-translate/core';
|
||||
import { NgxQrcodeElementTypes, NgxQrcodeErrorCorrectionLevels } from '@techiediaries/ngx-qrcode';
|
||||
import { VCardContact } from 'src/app/models/v-card-contact';
|
||||
import { EnvService } from 'src/app/services/env.service';
|
||||
import { Toast } from '@capacitor/toast';
|
||||
|
|
@ -14,6 +13,7 @@ import { BarcodeScanner } from '@capacitor-community/barcode-scanner';
|
|||
import { QrCodePage } from 'src/app/modals/qr-code/qr-code.page';
|
||||
import { fadeIn } from 'src/app/utils/animations';
|
||||
import { Router } from '@angular/router';
|
||||
import { QRCodeElementType } from 'angularx-qrcode';
|
||||
|
||||
@Component({
|
||||
selector: 'app-result',
|
||||
|
|
@ -26,8 +26,8 @@ export class ResultPage {
|
|||
contentType: "freeText" | "url" | "contact" | "phone" | "sms" | "emailW3C" | "emailDocomo" | "wifi" = "freeText";
|
||||
|
||||
qrCodeContent: string;
|
||||
qrElementType: NgxQrcodeElementTypes = NgxQrcodeElementTypes.CANVAS;
|
||||
errorCorrectionLevel: NgxQrcodeErrorCorrectionLevels = NgxQrcodeErrorCorrectionLevels.LOW;
|
||||
qrElementType: QRCodeElementType = "canvas";
|
||||
errorCorrectionLevel: 'low' | 'medium' | 'quartile' | 'high' | 'L' | 'M' | 'Q' | 'H' = 'low';
|
||||
qrMargin: number = 3;
|
||||
|
||||
phoneNumber: string;
|
||||
|
|
@ -596,7 +596,7 @@ export class ResultPage {
|
|||
} else if (!failEncoded && failDecoded) {
|
||||
await this.presentToast(this.translate.instant('MSG.NOT_BASE64_DE'), "short", "center");
|
||||
}
|
||||
setTimeout(() => this.formFields?.forEach(ff => ff.updateOutlineGap()), 100);
|
||||
// setTimeout(() => this.formFields?.forEach(ff => ff.updateOutlineGap()), 100);
|
||||
}
|
||||
|
||||
generateVCardContact(): void {
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@ import { SettingQrPage } from './setting-qr.page';
|
|||
import { HttpClient } from '@angular/common/http';
|
||||
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
|
||||
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
|
||||
import { NgxQRCodeModule } from '@techiediaries/ngx-qrcode';
|
||||
import { QRCodeModule } from 'angularx-qrcode';
|
||||
|
||||
export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
|
||||
return new TranslateHttpLoader(http, './assets/i18n/', '.json');
|
||||
|
|
@ -21,7 +21,7 @@ export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader {
|
|||
CommonModule,
|
||||
FormsModule,
|
||||
IonicModule,
|
||||
NgxQRCodeModule,
|
||||
QRCodeModule,
|
||||
TranslateModule.forChild({
|
||||
loader: {
|
||||
provide: TranslateLoader,
|
||||
|
|
|
|||
|
|
@ -20,10 +20,10 @@
|
|||
<div class="d-flex align-items-center justify-content-top flex-column ion-padding-bottom" slot="content">
|
||||
<ion-row class="ion-padding-vertical">
|
||||
<ion-col class="ion-text-center" style="max-width: 100% !important;">
|
||||
<ngx-qrcode [elementType]="qrElementType" [value]="qrCodeContent" [width]="defaultWidth"
|
||||
<qrcode [elementType]="qrElementType" [qrdata]="qrCodeContent" [width]="defaultWidth"
|
||||
[errorCorrectionLevel]="errorCorrectionLevel" [colorDark]="qrColorDark" [colorLight]="qrColorLight"
|
||||
[margin]="env.qrCodeMargin" #qrcode>
|
||||
</ngx-qrcode>
|
||||
</qrcode>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ import { Preferences } from '@capacitor/preferences';
|
|||
import { Toast } from '@capacitor/toast';
|
||||
import { AlertController, Platform } from '@ionic/angular';
|
||||
import { TranslateService } from '@ngx-translate/core';
|
||||
import { NgxQrcodeElementTypes, NgxQrcodeErrorCorrectionLevels } from '@techiediaries/ngx-qrcode';
|
||||
import { QRCodeElementType } from 'angularx-qrcode';
|
||||
import { EnvService } from 'src/app/services/env.service';
|
||||
import { rgbToHex } from 'src/app/utils/helpers';
|
||||
|
||||
|
|
@ -16,8 +16,8 @@ import { rgbToHex } from 'src/app/utils/helpers';
|
|||
export class SettingQrPage {
|
||||
|
||||
qrCodeContent: string = 'https://github.com/tomfong/simple-qr';
|
||||
qrElementType: NgxQrcodeElementTypes = NgxQrcodeElementTypes.CANVAS;
|
||||
errorCorrectionLevel: NgxQrcodeErrorCorrectionLevels;
|
||||
qrElementType: QRCodeElementType = "canvas";
|
||||
errorCorrectionLevel: 'low' | 'medium' | 'quartile' | 'high' | 'L' | 'M' | 'Q' | 'H';
|
||||
readonly MAX_WIDTH = 300;
|
||||
defaultWidth: number = window.innerWidth * 0.4 > this.MAX_WIDTH ? this.MAX_WIDTH : window.innerWidth * 0.4;
|
||||
|
||||
|
|
@ -51,19 +51,19 @@ export class SettingQrPage {
|
|||
setErrorCorrectionLevel() {
|
||||
switch (this.env.errorCorrectionLevel) {
|
||||
case 'L':
|
||||
this.errorCorrectionLevel = NgxQrcodeErrorCorrectionLevels.LOW;
|
||||
this.errorCorrectionLevel = 'low';
|
||||
break;
|
||||
case 'M':
|
||||
this.errorCorrectionLevel = NgxQrcodeErrorCorrectionLevels.MEDIUM;
|
||||
this.errorCorrectionLevel = 'medium';
|
||||
break;
|
||||
case 'Q':
|
||||
this.errorCorrectionLevel = NgxQrcodeErrorCorrectionLevels.QUARTILE;
|
||||
this.errorCorrectionLevel = 'quartile';
|
||||
break;
|
||||
case 'H':
|
||||
this.errorCorrectionLevel = NgxQrcodeErrorCorrectionLevels.HIGH;
|
||||
this.errorCorrectionLevel = 'high';
|
||||
break;
|
||||
default:
|
||||
this.errorCorrectionLevel = NgxQrcodeErrorCorrectionLevels.MEDIUM;
|
||||
this.errorCorrectionLevel = 'medium';
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -56,7 +56,7 @@
|
|||
<ion-modal #tutorialModal trigger="open-tutorial-modal" [initialBreakpoint]="0.8" [breakpoints]="[0, 0.8]">
|
||||
<ng-template>
|
||||
<ion-content [color]="color">
|
||||
<ion-list-header class="mt-4 ml-3" style="font-size: x-large;">{{ 'TUTORIAL' | translate }}</ion-list-header>
|
||||
<ion-list-header class="mt-4 ms-3" style="font-size: x-large;">{{ 'TUTORIAL' | translate }}</ion-list-header>
|
||||
<ion-item class="content-item ion-no-padding" lines="none" [color]="color">
|
||||
<ion-icon class="ion-padding-horizontal" src="assets/icon/swipe-left.svg" [color]="'primary'"></ion-icon>
|
||||
<ion-label>
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ export class EnvService {
|
|||
public scanRecordLogging: OnOffType = 'on';
|
||||
public recordsLimit: 30 | 50 | 100 | -1 = -1;
|
||||
public showNumberOfRecords: OnOffType = 'on';
|
||||
public autoMaxBrightness: OnOffType = 'on';
|
||||
public autoMaxBrightness: OnOffType = 'off';
|
||||
public errorCorrectionLevel: ErrorCorrectionLevelType = 'M';
|
||||
public qrCodeLightR: number = 255;
|
||||
public qrCodeLightG: number = 255;
|
||||
|
|
@ -500,7 +500,7 @@ export class EnvService {
|
|||
if (value != null) {
|
||||
this.autoMaxBrightness = value;
|
||||
} else {
|
||||
this.autoMaxBrightness = 'on';
|
||||
this.autoMaxBrightness = 'off';
|
||||
}
|
||||
await Preferences.set({
|
||||
key: this.KEY_AUTO_MAX_BRIGHTNESS,
|
||||
|
|
@ -995,7 +995,7 @@ export class EnvService {
|
|||
if (result.value != null) {
|
||||
this.autoMaxBrightness = result.value as OnOffType;
|
||||
} else {
|
||||
this.autoMaxBrightness = 'on';
|
||||
this.autoMaxBrightness = 'off';
|
||||
}
|
||||
}
|
||||
);
|
||||
|
|
@ -1193,7 +1193,7 @@ export class EnvService {
|
|||
this.scanRecordLogging = 'on';
|
||||
this.recordsLimit = -1;
|
||||
this.showNumberOfRecords = 'on';
|
||||
this.autoMaxBrightness = 'on';
|
||||
this.autoMaxBrightness = 'off';
|
||||
this.errorCorrectionLevel = 'M';
|
||||
this.qrCodeLightR = 255;
|
||||
this.qrCodeLightG = 255;
|
||||
|
|
@ -1264,7 +1264,7 @@ export class EnvService {
|
|||
this.showNumberOfRecords = 'on';
|
||||
await Preferences.set({ key: this.KEY_SHOW_NUMBER_OF_RECORDS, value: this.showNumberOfRecords });
|
||||
|
||||
this.autoMaxBrightness = 'on';
|
||||
this.autoMaxBrightness = 'off';
|
||||
await Preferences.set({ key: this.KEY_AUTO_MAX_BRIGHTNESS, value: this.autoMaxBrightness });
|
||||
|
||||
this.errorCorrectionLevel = 'M';
|
||||
|
|
|
|||
|
|
@ -134,3 +134,8 @@ ion-tab-button:not(.tab-selected)::part(native):hover {
|
|||
.pre-line {
|
||||
white-space: pre-line !important;
|
||||
}
|
||||
|
||||
.mat-icon {
|
||||
height: 28px !important;
|
||||
width: 28px !important;
|
||||
}
|
||||
|
|
@ -1,6 +1,15 @@
|
|||
@use "@angular/material" as mat;
|
||||
@import "@angular/material/theming";
|
||||
@include mat.core();
|
||||
// TODO(v15): As of v15 mat.legacy-core no longer includes default typography styles.
|
||||
// The following line adds:
|
||||
// 1. Default typography styles for all components
|
||||
// 2. Styles for typography hierarchy classes (e.g. .mat-headline-1)
|
||||
// If you specify typography styles for the components you use elsewhere, you should delete this line.
|
||||
// If you don't need the default component typographies but still want the hierarchy styles,
|
||||
// you can delete this line and instead use:
|
||||
// `@include mat.legacy-typography-hierarchy(mat.define-legacy-typography-config());`
|
||||
@include mat.legacy-typography-hierarchy(mat.define-legacy-typography-config());
|
||||
@include mat.legacy-core();
|
||||
$app-primary: mat.define-palette(mat.$cyan-palette, 600);
|
||||
$app-warn: mat.define-palette(mat.$red-palette);
|
||||
$app-light-theme: mat.define-light-theme(
|
||||
|
|
@ -27,7 +36,7 @@ $app-black-theme: mat.define-dark-theme(
|
|||
primary: $app-primary,
|
||||
accent: $app-primary,
|
||||
warn: $app-warn,
|
||||
),
|
||||
)
|
||||
)
|
||||
);
|
||||
|
||||
|
|
@ -41,6 +50,9 @@ $app-black-theme: mat.define-dark-theme(
|
|||
|
||||
.ng-mat-black {
|
||||
@include mat.all-component-themes($app-black-theme);
|
||||
.mdc-menu-surface {
|
||||
background-color: #0f0f0f !important;
|
||||
}
|
||||
}
|
||||
|
||||
:root {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue