tykayn/funky-framadate-front
1
1
Fork 1
mirror of https://framagit.org/framasoft/framadate/funky-framadate-front.git synced 2023-08-25 13:53:14 +02:00
Code Issues Projects Releases Wiki Activity

angular upgrade: migrate ng material component

Browse Source
This commit is contained in:
bmartins 2023-03-17 22:57:32 +01:00
parent ad9876633b
commit ea09c4e854
12 changed files with 33 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/app/core/services/modal.service.ts
View File

@ -1,9 +1,6 @@
import { ComponentType } from '@angular/cdk/portal';
import { Injectable, TemplateRef } from '@angular/core';
import {
MatLegacyDialog as MatDialog,
MatLegacyDialogConfig as MatDialogConfig,
} from '@angular/material/legacy-dialog';
import { MatDialog, MatDialogConfig } from '@angular/material/dialog';
@Injectable({
providedIn: 'root',

5
src/app/core/services/toast.service.ts
View File

@ -1,8 +1,5 @@
import { Injectable } from '@angular/core';
import {
MatLegacySnackBar as MatSnackBar,
MatLegacySnackBarConfig as MatSnackBarConfig,
} from '@angular/material/legacy-snack-bar';
import { MatSnackBar, MatSnackBarConfig } from '@angular/material/snack-bar';
@Injectable({
providedIn: 'root',

2
src/app/features/administration/form/date/list/day/day-list.component.ts
View File

@ -4,7 +4,7 @@ import { DOCUMENT } from '@angular/common';
import { UntypedFormGroup } from '@angular/forms';
import { ToastService } from '../../../../../../core/services/toast.service';
import { StorageService } from '../../../../../../core/services/storage.service';
import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
import { MatDialog } from '@angular/material/dialog';
import { DateChoice } from '../../../../../../core/models/dateChoice.model';
import { PollService } from '../../../../../../core/services/poll.service';
import { DateUtilitiesService } from '../../../../../../core/services/date.utilities.service';

2
src/app/features/consultation/poll-results-compact/poll-results-compact.component.ts
View File

@ -1,5 +1,5 @@
import { Component, Input, OnInit } from '@angular/core';
import { MatLegacyDialogConfig as MatDialogConfig } from '@angular/material/legacy-dialog';
import { MatDialogConfig } from '@angular/material/dialog';
import { Answer } from '../../../core/enums/answer.enum';
import { Choice } from '../../../core/models/choice.model';

5
src/app/shared/components/choice-details/choice-details.component.ts
View File

@ -1,8 +1,5 @@
import { Component, Inject, OnInit } from '@angular/core';
import {
MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA,
MatLegacyDialogRef as MatDialogRef,
} from '@angular/material/legacy-dialog';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
import { Answer } from '../../../core/enums/answer.enum';
import { Choice } from '../../../core/models/choice.model';

2
src/app/shared/components/settings/settings.component.ts
View File

@ -1,5 +1,5 @@
import { Component, OnInit } from '@angular/core';
import { MatLegacyDialogRef as MatDialogRef } from '@angular/material/legacy-dialog';
import { MatDialogRef } from '@angular/material/dialog';
import { Subscription } from 'rxjs';
import { Owner } from '../../../core/models/owner.model';

14
src/app/shared/shared.module.ts
View File

@ -2,15 +2,15 @@ import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
import { MatLegacyFormFieldModule as MatFormFieldModule } from '@angular/material/legacy-form-field';
import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
import { MatDialogModule } from '@angular/material/dialog';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatInputModule } from '@angular/material/input';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatLegacySlideToggleModule as MatSlideToggleModule } from '@angular/material/legacy-slide-toggle';
import { MatLegacySnackBarModule as MatSnackBarModule } from '@angular/material/legacy-snack-bar';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatStepperModule } from '@angular/material/stepper';
import { TranslateModule } from '@ngx-translate/core';
import { NgChartsModule } from 'ng2-charts';

12
src/styles.scss
View File

@ -13,9 +13,13 @@
// 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-typography-config());`
/* TODO(mdc-migration): Remove all-legacy-component-typographies once all legacy components are migrated*/
@include mat.all-legacy-component-typographies();
@include mat.all-component-typographies();
/* TODO(mdc-migration): Remove legacy-core once all legacy components are migrated*/
@include mat.legacy-core();
@include mat.core();
// import your custom themes
@import 'theme-light.scss';
@ -23,13 +27,19 @@
@import 'theme-contrast.scss';
.theme-light {
/* TODO(mdc-migration): Remove all-legacy-component-themes once all legacy components are migrated*/
@include mat.all-legacy-component-themes($theme-light);
@include mat.all-component-themes($theme-light);
}
.theme-dark {
/* TODO(mdc-migration): Remove all-legacy-component-themes once all legacy components are migrated*/
@include mat.all-legacy-component-themes($theme-dark);
@include mat.all-component-themes($theme-dark);
}
.theme-contrast {
/* TODO(mdc-migration): Remove all-legacy-component-themes once all legacy components are migrated*/
@include mat.all-legacy-component-themes($theme-contrast);
@include mat.all-component-themes($theme-contrast);
}
/*

4
src/styles/partials/_forms.scss
View File

@ -70,6 +70,7 @@ textarea {
}
// radio input structure
/* TODO(mdc-migration): The following rule targets internal classes of checkbox that may no longer apply for the MDC version.*/
.mat-checkbox-label,
.mat-checkbox-layout .mat-checkbox-label {
max-width: 90vw;
@ -190,12 +191,13 @@ textarea {
-moz-border-radius-bottomright: 1em;
}
.mat-error {
.mat-mdc-form-field-error {
display: block;
background: $warning;
padding: 1em;
}
/* TODO(mdc-migration): The following rule targets internal classes of checkbox that may no longer apply for the MDC version.*/
mat-checkbox {
display: block;
}

2
src/theme-contrast.scss
View File

@ -14,4 +14,6 @@ $theme-contrast: mat.define-light-theme($theme-contrast-primary, $theme-contrast
// Include theme styles for core and each component used in your app.
// Alternatively, you can import and @include the theme mixins for each component
// that you are using.
/* TODO(mdc-migration): Remove all-legacy-component-themes once all legacy components are migrated*/
@include mat.all-legacy-component-themes($theme-contrast);
@include mat.all-component-themes($theme-contrast);

2
src/theme-dark.scss
View File

@ -14,4 +14,6 @@ $theme-dark: mat.define-dark-theme($theme-dark-primary, $theme-dark-accent, $the
// Include theme styles for core and each component used in your app.
// Alternatively, you can import and @include the theme mixins for each component
// that you are using.
/* TODO(mdc-migration): Remove all-legacy-component-themes once all legacy components are migrated*/
@include mat.all-legacy-component-themes($theme-dark);
@include mat.all-component-themes($theme-dark);

2
src/theme-light.scss
View File

@ -14,4 +14,6 @@ $theme-light: mat.define-light-theme($theme-light-primary, $theme-light-accent,
// Include theme styles for core and each component used in your app.
// Alternatively, you can import and @include the theme mixins for each component
// that you are using.
/* TODO(mdc-migration): Remove all-legacy-component-themes once all legacy components are migrated*/
@include mat.all-legacy-component-themes($theme-light);
@include mat.all-component-themes($theme-light);