[frontend] Migrate to material 15 using mdc-migration

pull/15/head
ogdbd3h5qze42igcv8wcrqk3 2023-03-18 16:06:59 +01:00
parent d1ffcf928d
commit aed5710da7
48 changed files with 71 additions and 70 deletions

View File

@ -1,5 +1,5 @@
<div class="container">
<mat-card class="login-form">
<mat-card appearance="outlined" class="login-form">
<mat-card-header>
<h2>Log in as hood admin!</h2>
</mat-card-header>

View File

@ -7,7 +7,7 @@
margin-top: 3%;
}
.mat-card:not([class*="mat-elevation-z"]) {
.mat-mdc-card:not([class*="mat-elevation-z"]) {
box-shadow: none;
}

View File

@ -3,7 +3,7 @@ import { LoginService } from '../../core/auth/login.service';
import { Router, ActivatedRoute } from '@angular/router';
import { Validators, UntypedFormGroup, UntypedFormBuilder } from '@angular/forms';
import { first } from 'rxjs/operators';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
@Component({
selector: 'app-login',

View File

@ -1,5 +1,5 @@
<div class="container">
<mat-card class="login-form">
<mat-card appearance="outlined" class="login-form">
<mat-card-header>
<h2>Reset password</h2>
</mat-card-header>

View File

@ -6,7 +6,7 @@
margin-top: 3%;
}
.mat-card:not([class*="mat-elevation-z"]) {
.mat-mdc-card:not([class*="mat-elevation-z"]) {
box-shadow: none;
}

View File

@ -1,6 +1,6 @@
import { Component, OnInit } from '@angular/core';
import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
import { ActivatedRoute, Router } from '@angular/router';
import { first } from 'rxjs/operators';
import { AdminService } from 'src/app/core/api/api/admin.service';

View File

@ -1,5 +1,5 @@
<div class="container">
<mat-card class="login-form">
<mat-card appearance="outlined" class="login-form">
<mat-card-header>
<h2>Enter your new password</h2>
</mat-card-header>

View File

@ -6,7 +6,7 @@
margin-top: 3%;
}
.mat-card:not([class*="mat-elevation-z"]) {
.mat-mdc-card:not([class*="mat-elevation-z"]) {
box-shadow: none;
}

View File

@ -1,6 +1,6 @@
import { Component, OnInit } from '@angular/core';
import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
import { ActivatedRoute, Router } from '@angular/router';
import { first } from 'rxjs/operators';
import { AdminService } from 'src/app/core/api/api/admin.service';

View File

@ -1,6 +1,6 @@
<div class="container">
<div class="banner"></div>
<mat-card class="register-form">
<mat-card appearance="outlined" class="register-form">
<mat-card-header>
<h2>Register as a hood admin!</h2>
</mat-card-header>

View File

@ -7,7 +7,7 @@
margin-top: 3%;
}
.mat-card:not([class*="mat-elevation-z"]) {
.mat-mdc-card:not([class*="mat-elevation-z"]) {
box-shadow: none;
}

View File

@ -4,7 +4,7 @@ import { Validators, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms
import { first } from 'rxjs/operators';
import { Router, ActivatedRoute } from '@angular/router';
import { LoginService } from 'src/app/core/auth/login.service';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
@Component({
selector: 'app-register',

View File

@ -10,7 +10,7 @@ import { Observable, throwError } from 'rxjs';
import { LoginService } from './login.service';
import { catchError } from 'rxjs/operators';
import { Router } from '@angular/router';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
import { OverlayComponent } from 'src/app/shared/overlay/overlay.component';
@Injectable()

View File

@ -1,7 +1,7 @@
<app-heading-one [title]="title"></app-heading-one>
<div class="container">
<mat-card>
<mat-card appearance="outlined">
<form [formGroup]="form" class="form">
<mat-form-field appearance="fill">
<mat-label for="email">E-Mail</mat-label>
@ -47,7 +47,7 @@
</form>
</mat-card>
<mat-card>
<mat-card appearance="outlined">
<div class="delete">
<mat-card-title>Danger zone</mat-card-title>
<mat-divider></mat-divider>

View File

@ -1,6 +1,6 @@
import { Component, OnInit } from '@angular/core';
import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
import { MatDialog } from '@angular/material/dialog';
import { Router } from '@angular/router';
import { AdminService } from 'src/app/core/api/api/admin.service';
import { YesNoDialogComponent } from 'src/app/shared/yes-no-dialog/yes-no-dialog.component';

View File

@ -1,4 +1,4 @@
.mat-card {
.mat-mdc-card {
box-shadow: none;
}

View File

@ -1,4 +1,4 @@
<mat-card>
<mat-card appearance="outlined">
<mat-card-title>Badwords</mat-card-title>
<mat-card-content>
<form class="input" [formGroup]="regexForm" (ngSubmit)="onSubmit()">

View File

@ -11,7 +11,7 @@
margin: 10px;
}
.mat-form-field {
.mat-mdc-form-field {
width: 100%;
}

View File

@ -3,7 +3,7 @@ import { BadwordsService, BodyBadWord } from 'src/app/core/api';
import { Observable } from 'rxjs';
import { UntypedFormGroup, Validators, UntypedFormBuilder } from '@angular/forms';
import { first } from 'rxjs/operators';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
@Component({
selector: 'app-badwords',

View File

@ -36,21 +36,21 @@
<strong>not be distributed</strong>. For example:
</p>
<div class="example-container">
<mat-card>
<mat-card appearance="outlined">
<mat-card-title>xyz is an asshat!</mat-card-title>
<mat-card-subtitle
>This message will
<strong>not be distributed</strong>.</mat-card-subtitle
>
</mat-card>
<mat-card>
<mat-card appearance="outlined">
<mat-card-title>xyz is an verybigAsshat!</mat-card-title>
<mat-card-subtitle
>This message will
<strong>not be distributed</strong>.</mat-card-subtitle
>
</mat-card>
<mat-card>
<mat-card appearance="outlined">
<mat-card-title>xyz is nice!</mat-card-title>
<mat-card-subtitle
>This message will be distributed.</mat-card-subtitle

View File

@ -1,4 +1,4 @@
<mat-card>
<mat-card appearance="outlined">
<mat-card-title>Triggers</mat-card-title>
<mat-card-content>
<form class="input" [formGroup]="regexForm" (ngSubmit)="onSubmit()">

View File

@ -11,7 +11,7 @@
margin: 10px;
}
.mat-form-field {
.mat-mdc-form-field {
width: 100%;
}

View File

@ -4,7 +4,7 @@ import { Observable } from 'rxjs';
import { ResourceLoader } from '@angular/compiler';
import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
import { first } from 'rxjs/operators';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
@Component({
selector: 'app-trigger',

View File

@ -1,5 +1,5 @@
<div class="container">
<mat-card>
<mat-card appearance="outlined">
<form [formGroup]="form" class="form">
<mat-form-field>
<mat-label>Update hood name</mat-label>
@ -11,7 +11,7 @@
</form>
</mat-card>
<mat-card>
<mat-card appearance="outlined">
<div class="delete">
<mat-card-title>Danger zone</mat-card-title>
<mat-divider></mat-divider>

View File

@ -1,11 +1,11 @@
import { Component, OnInit, Input } from '@angular/core';
import { HoodsService } from 'src/app/core/api';
import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
import { MatDialog } from '@angular/material/dialog';
import { YesNoDialogComponent } from 'src/app/shared/yes-no-dialog/yes-no-dialog.component';
import { Router } from '@angular/router';
import { UntypedFormGroup, UntypedFormBuilder, Validators } from '@angular/forms';
import { first } from 'rxjs/operators';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
@Component({
selector: 'app-settings',

View File

@ -2,7 +2,7 @@ import { Component, OnInit } from '@angular/core';
import { AdminService, BodyHood } from 'src/app/core/api';
import { map } from 'rxjs/operators';
import { Observer } from 'rxjs';
import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
import { MatDialog } from '@angular/material/dialog';
import { NewHoodDialogComponent } from './new-hood-dialog/new-hood-dialog.component';
import { Router } from '@angular/router';

View File

@ -1,9 +1,9 @@
import { Component, OnInit, Inject } from '@angular/core';
import { MatLegacyDialogRef as MatDialogRef, MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA } from '@angular/material/legacy-dialog';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { HoodsService } from 'src/app/core/api';
import { first } from 'rxjs/operators';
import { UntypedFormBuilder, UntypedFormGroup, Validators } from '@angular/forms';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
@Component({
selector: 'app-new-hood-dialog',

View File

@ -1,6 +1,6 @@
<div *ngIf="emails$ | loading | async as emails">
<ng-template [ngIf]="emails.value">
<mat-card>
<mat-card appearance="outlined">
<mat-card-header>
<div mat-card-avatar class="email"></div>
<mat-card-title class="platform-title">

View File

@ -3,9 +3,9 @@ import { EmailService } from 'src/app/core/api';
import { environment } from 'src/environments/environment';
import { UntypedFormGroup, UntypedFormBuilder, Validators } from '@angular/forms';
import { EmailBotInfoDialogComponent } from './email-bot-info-dialog/email-bot-info-dialog.component';
import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
import { MatDialog } from '@angular/material/dialog';
import { first } from 'rxjs/operators';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
@Component({
selector: 'app-email-bot-card',

View File

@ -1,8 +1,8 @@
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { EmailService } from 'src/app/core/api';
import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatDialog } from '@angular/material/dialog';
import { MatSnackBar } from '@angular/material/snack-bar';
@Component({
selector: 'app-email-confirmation',

View File

@ -1,9 +1,9 @@
import { Component, OnInit, Input, Inject } from '@angular/core';
import { MatLegacyDialogRef as MatDialogRef, MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA } from '@angular/material/legacy-dialog';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { Validators, UntypedFormBuilder } from '@angular/forms';
import { EmailService } from 'src/app/core/api';
import { first } from 'rxjs/operators';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
@Component({
selector: 'app-email-dialog',

View File

@ -1,4 +1,4 @@
<mat-card>
<mat-card appearance="outlined">
<mat-card-header>
<div mat-card-avatar class="email"></div>
<mat-card-title class="platform-title">

View File

@ -1,11 +1,11 @@
import { Component, OnInit, Input } from '@angular/core';
import { Observable } from 'rxjs/internal/Observable';
import { EmailService, HoodsService } from 'src/app/core/api';
import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
import { MatDialog } from '@angular/material/dialog';
import { EmailDialogComponent } from './email-dialog/email-dialog.component';
import { EmailInfoDialogComponent } from './email-info-dialog/email-info-dialog.component';
import { BotStatus } from '../../../core/model/status';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
import { environment } from 'src/environments/environment';
@Component({

View File

@ -1,3 +1,3 @@
<mat-card class="card">
<mat-card appearance="outlined" class="card">
<p>{{ status }}</p>
</mat-card>

View File

@ -1,7 +1,7 @@
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { EmailService } from 'src/app/core/api';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
@Component({
selector: 'app-email-unsubscribe',

View File

@ -1,5 +1,5 @@
import { Component, OnInit, Input } from '@angular/core';
import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
import { MatDialog } from '@angular/material/dialog';
@Component({
selector: 'app-platforms-info-page',

View File

@ -1,6 +1,6 @@
<div *ngIf="telegrams$ | loading | async as telegrams">
<ng-template [ngIf]="telegrams.value">
<mat-card>
<mat-card appearance="outlined">
<mat-card-header>
<div mat-card-avatar class="telegram"></div>
<mat-card-title class="platform-title">

View File

@ -1,7 +1,7 @@
import { Component, OnInit, Input } from '@angular/core';
import { TelegramService } from 'src/app/core/api';
import { TelegramBotInfoDialogComponent } from './telegram-bot-info-dialog/telegram-bot-info-dialog.component';
import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
import { MatDialog } from '@angular/material/dialog';
@Component({
selector: 'app-telegram-bot-card',

View File

@ -1,8 +1,8 @@
import { Component, OnInit, Inject } from '@angular/core';
import { Validators, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
import { MatLegacyDialogRef as MatDialogRef, MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA } from '@angular/material/legacy-dialog';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { TelegramService, BodyTelegram } from 'src/app/core/api';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
import { first } from 'rxjs/operators';
@Component({

View File

@ -1,4 +1,4 @@
<mat-card>
<mat-card appearance="outlined">
<mat-card-header>
<div mat-card-avatar class="telegram"></div>
<mat-card-title class="platform-title">

View File

@ -2,10 +2,10 @@ import { Component, OnInit, Input } from '@angular/core';
import { TelegramService } from 'src/app/core/api';
import { Observable } from 'rxjs';
import { TelegramInfoDialogComponent } from './telegram-info-dialog/telegram-info-dialog.component';
import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
import { MatDialog } from '@angular/material/dialog';
import { TelegramDialogComponent } from './telegram-dialog/telegram-dialog.component';
import { YesNoDialogComponent } from 'src/app/shared/yes-no-dialog/yes-no-dialog.component';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatSnackBar } from '@angular/material/snack-bar';
@Component({
selector: 'app-telegram-settings',

View File

@ -1,6 +1,6 @@
<div *ngIf="twitters$ | loading | async as twitters">
<ng-template [ngIf]="twitters.value">
<mat-card>
<mat-card appearance="outlined">
<mat-card-header>
<div mat-card-avatar class="twitter"></div>
<mat-card-title class="platform-title">

View File

@ -1,7 +1,7 @@
import { Component, OnInit, Input } from '@angular/core';
import { TwitterService } from 'src/app/core/api';
import { TwitterBotInfoDialogComponent } from './twitter-bot-info-dialog/twitter-bot-info-dialog.component';
import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
import { MatDialog } from '@angular/material/dialog';
@Component({
selector: 'app-twitter-bot-card',

View File

@ -1,4 +1,4 @@
<mat-card>
<mat-card appearance="outlined">
<mat-card-header>
<div mat-card-avatar class="twitter"></div>
<mat-card-title class="platform-title">

View File

@ -2,8 +2,8 @@ import { Component, OnInit, Input } from '@angular/core';
import { Observable } from 'rxjs';
import { TwitterService } from 'src/app/core/api';
import { TwitterInfoDialogComponent } from './twitter-info-dialog/twitter-info-dialog.component';
import { MatLegacyDialog as MatDialog } from '@angular/material/legacy-dialog';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { MatDialog } from '@angular/material/dialog';
import { MatSnackBar } from '@angular/material/snack-bar';
@Component({
selector: 'app-twitter-settings',

View File

@ -1,18 +1,18 @@
import { NgModule } from '@angular/core';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
import { MatButtonModule } from '@angular/material/button';
import { MatIconModule } from '@angular/material/icon';
import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
import { MatLegacyTabsModule as MatTabsModule } from '@angular/material/legacy-tabs';
import { MatLegacyCardModule as MatCardModule } from '@angular/material/legacy-card';
import { MatMenuModule } from '@angular/material/menu';
import { MatTabsModule } from '@angular/material/tabs';
import { MatCardModule } from '@angular/material/card';
import { MatExpansionModule } from '@angular/material/expansion';
import { MatLegacyListModule as MatListModule } from '@angular/material/legacy-list';
import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
import { MatLegacySnackBarModule as MatSnackBarModule } from '@angular/material/legacy-snack-bar';
import { MatLegacySlideToggleModule as MatSlideToggleModule } from '@angular/material/legacy-slide-toggle';
import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
import { MatListModule } from '@angular/material/list';
import { MatInputModule } from '@angular/material/input';
import { MatDialogModule } from '@angular/material/dialog';
import { MatSnackBarModule } from '@angular/material/snack-bar';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatTooltipModule } from '@angular/material/tooltip';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
@NgModule({
declarations: [],

View File

@ -1,5 +1,5 @@
import { Component, OnInit, Inject } from '@angular/core';
import { MAT_LEGACY_DIALOG_DATA as MAT_DIALOG_DATA } from '@angular/material/legacy-dialog';
import { MAT_DIALOG_DATA } from '@angular/material/dialog';
@Component({
selector: 'app-yes-no-dialog',

View File

@ -11,6 +11,7 @@ body {
font-family: Roboto, "Helvetica Neue", sans-serif;
}
/* TODO(mdc-migration): The following rule targets internal classes of tabs that may no longer apply for the MDC version. */
.mat-tab-body-content {
overflow: hidden !important;
}