Dependency Day + Basic Setup #3
|
@ -3,52 +3,29 @@
|
||||||
<!--</button>-->
|
<!--</button>-->
|
||||||
|
|
||||||
<mat-stepper linear #stepper>
|
<mat-stepper linear #stepper>
|
||||||
<!-- Step 2-->
|
<!-- Step 0-->
|
||||||
<mat-step [stepControl]="secondFormGroup" [editable]="isEditable">
|
<mat-step [stepControl]="zeroFormGroup" class="firstStep">
|
||||||
<form [formGroup]="secondFormGroup" class="flexContainerColumn width30">
|
<form [formGroup]="zeroFormGroup">
|
||||||
<ng-template matStepLabel>Banking Information</ng-template>
|
<ng-template matStepLabel>Registration</ng-template>
|
||||||
<mat-form-field appearance="fill">
|
|
||||||
<mat-label>Account Holder</mat-label>
|
|
||||||
<input matInput formControlName="accountHolder"
|
|
||||||
required>
|
|
||||||
</mat-form-field>
|
|
||||||
|
|
||||||
<mat-form-field appearance="fill">
|
|
||||||
<mat-label>IBAN</mat-label>
|
|
||||||
<input matInput formControlName="iban" required>
|
|
||||||
</mat-form-field>
|
|
||||||
|
|
||||||
<mat-form-field appearance="fill">
|
|
||||||
<mat-label>BIC</mat-label>
|
|
||||||
<input matInput formControlName="bic"
|
|
||||||
required>
|
|
||||||
</mat-form-field>
|
|
||||||
|
|
||||||
<mat-form-field appearance="fill">
|
|
||||||
<mat-label>Name of Financial Institute</mat-label>
|
|
||||||
<input matInput formControlName="nameOfFinancialInstitute"
|
|
||||||
required>
|
|
||||||
</mat-form-field>
|
|
||||||
|
|
||||||
<mat-form-field appearance="fill">
|
|
||||||
<mat-label>Amount in €/Month</mat-label>
|
|
||||||
<input matInput formControlName="amount" required>
|
|
||||||
</mat-form-field>
|
|
||||||
|
|
||||||
<div class="flexContainerRow width20">
|
<div class="flexContainerRow width20">
|
||||||
<mat-checkbox formControlName="checked" required>Einzugsermächtigung</mat-checkbox>
|
<mat-checkbox formControlName="danceTraining">Für den Tanzunterricht (Tanz-Flatrate)</mat-checkbox>
|
||||||
<mat-icon aria-hidden="false" aria-label="Example home icon" matTooltip="{{infoText}}" matTooltipPosition="right">info</mat-icon>
|
</div>
|
||||||
|
<div class="flexContainerRow width20">
|
||||||
|
<mat-checkbox formControlName="karateTraining">Für den Karateunterricht</mat-checkbox>
|
||||||
|
</div>
|
||||||
|
<div class="flexContainerRow width20">
|
||||||
|
<mat-checkbox formControlName="freeTraining">Für freies Training (unterschriebenes Beiblatt muss der Anmeldung beiliegen)</mat-checkbox>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
|
<div>
|
||||||
<div class="buttonsContainer">
|
<button mat-button matStepperNext [disabled]="zeroFormGroup.status == 'INVALID'" (click)="onClick()">Next</button>
|
||||||
<button mat-button matStepperPrevious class="backButton">Back</button>
|
|
||||||
<button mat-button matStepperNext [disabled]="firstFormGroup.status == 'INVALID'" (click)="onClick()">Next</button>
|
|
||||||
</div>
|
</div>
|
||||||
</mat-step>
|
</mat-step>
|
||||||
|
|
||||||
|
|
||||||
<!-- Step 1-->
|
<!-- Step 1-->
|
||||||
<mat-step [stepControl]="firstFormGroup" class="firstStep">
|
<mat-step [stepControl]="firstFormGroup" class="firstStep">
|
||||||
<form [formGroup]="firstFormGroup" class="formContainer">
|
<form [formGroup]="firstFormGroup" class="flexContainerRow width50">
|
||||||
<ng-template matStepLabel>Personal Information</ng-template>
|
<ng-template matStepLabel>Personal Information</ng-template>
|
||||||
<div class="leftContainer">
|
<div class="leftContainer">
|
||||||
|
|
||||||
|
@ -105,89 +82,75 @@
|
||||||
</mat-form-field>
|
</mat-form-field>
|
||||||
</div>
|
</div>
|
||||||
</form>
|
</form>
|
||||||
<div>
|
<div class="buttonsContainer">
|
||||||
<button mat-button matStepperNext [disabled]="secondFormGroup.status == 'INVALID'" (click)="onClick()">Next</button>
|
<button mat-button matStepperPrevious class="backButton">Back</button>
|
||||||
|
<button mat-button matStepperNext [disabled]="firstFormGroup.status == 'INVALID'" >Next</button>
|
||||||
</div>
|
</div>
|
||||||
</mat-step>
|
</mat-step>
|
||||||
|
|
||||||
|
<!-- Step 2-->
|
||||||
|
<mat-step [stepControl]="secondFormGroup" [editable]="isEditable">
|
||||||
|
<form [formGroup]="secondFormGroup" class="flexContainerColumn width30">
|
||||||
|
<ng-template matStepLabel>Banking Information</ng-template>
|
||||||
|
<mat-form-field appearance="fill">
|
||||||
|
<mat-label>Account Holder</mat-label>
|
||||||
|
<input matInput formControlName="accountHolder"
|
||||||
|
required>
|
||||||
|
</mat-form-field>
|
||||||
|
|
||||||
|
<mat-form-field appearance="fill">
|
||||||
|
<mat-label>IBAN</mat-label>
|
||||||
|
<input matInput formControlName="iban" required>
|
||||||
|
</mat-form-field>
|
||||||
|
|
||||||
<!-- <!– Step 1–>-->
|
<mat-form-field appearance="fill">
|
||||||
<!-- <mat-step [stepControl]="firstFormGroup" class="firstStep">-->
|
<mat-label>BIC</mat-label>
|
||||||
<!-- <form [formGroup]="firstFormGroup">-->
|
<input matInput formControlName="bic"
|
||||||
<!-- <ng-template matStepLabel>Personal Information</ng-template>-->
|
required>
|
||||||
<!-- <div class="formContainer1 width50">-->
|
</mat-form-field>
|
||||||
<!-- <div class="leftContainer">-->
|
|
||||||
|
|
||||||
<!-- <mat-form-field appearance="fill">-->
|
<mat-form-field appearance="fill">
|
||||||
<!-- <mat-label>Name</mat-label>-->
|
<mat-label>Name of Financial Institute</mat-label>
|
||||||
<!-- <input matInput formControlName="firstName" placeholder="First name" required>-->
|
<input matInput formControlName="nameOfFinancialInstitute"
|
||||||
<!-- </mat-form-field>-->
|
required>
|
||||||
|
</mat-form-field>
|
||||||
|
|
||||||
<!-- <mat-form-field appearance="fill">-->
|
<mat-form-field appearance="fill">
|
||||||
<!-- <mat-label>Surname</mat-label>-->
|
<mat-label>Amount in €/Month</mat-label>
|
||||||
<!-- <input matInput formControlName="lastName" placeholder="Last name" required>-->
|
<input matInput formControlName="amount" required>
|
||||||
<!-- </mat-form-field>-->
|
</mat-form-field>
|
||||||
|
|
||||||
|
<div class="flexContainerRow width20">
|
||||||
|
<mat-checkbox formControlName="einzugsermaechtigung" required>Einzugsermächtigung</mat-checkbox>
|
||||||
|
<mat-icon aria-hidden="false" matTooltip="{{infoText}}" matTooltipPosition="right">info</mat-icon>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
|
||||||
<!-- <mat-form-field appearance="fill">-->
|
<div class="buttonsContainer">
|
||||||
<!-- <mat-label>Birthdate</mat-label>-->
|
<button mat-button matStepperPrevious class="backButton">Back</button>
|
||||||
<!-- <input matInput [matDatepicker]="birthdatePicker" formControlName="birthdate" required>-->
|
<button mat-button matStepperNext [disabled]="secondFormGroup.status == 'INVALID'" >Next</button>
|
||||||
<!-- <mat-hint>MM/DD/YYYY</mat-hint>-->
|
</div>
|
||||||
<!-- <mat-datepicker-toggle matSuffix [for]="birthdatePicker"></mat-datepicker-toggle>-->
|
</mat-step>
|
||||||
<!-- <mat-datepicker #birthdatePicker startView="multi-year"></mat-datepicker>-->
|
|
||||||
<!-- </mat-form-field>-->
|
|
||||||
|
|
||||||
|
|
||||||
<!-- <mat-form-field>-->
|
|
||||||
<!-- <mat-label>Gender</mat-label>-->
|
|
||||||
<!-- <mat-select>-->
|
|
||||||
<!-- <mat-option value="male">Male</mat-option>-->
|
|
||||||
<!-- <mat-option value="female">Female</mat-option>-->
|
|
||||||
<!-- <mat-option value="divers">Divers</mat-option>-->
|
|
||||||
<!-- </mat-select>-->
|
|
||||||
<!-- </mat-form-field>-->
|
|
||||||
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- <div class="rightContainer">-->
|
|
||||||
|
|
||||||
<!-- <mat-form-field appearance="fill">-->
|
|
||||||
<!-- <mat-label>Address</mat-label>-->
|
|
||||||
<!-- <input matInput formControlName="address" required>-->
|
|
||||||
<!-- </mat-form-field>-->
|
|
||||||
|
|
||||||
<!-- <mat-form-field appearance="fill">-->
|
|
||||||
<!-- <mat-label>Postal Code</mat-label>-->
|
|
||||||
<!-- <input matInput formControlName="postalCode" required>-->
|
|
||||||
<!-- </mat-form-field>-->
|
|
||||||
|
|
||||||
<!-- <mat-form-field appearance="fill">-->
|
|
||||||
<!-- <mat-label>Phone</mat-label>-->
|
|
||||||
<!-- <input matInput formControlName="phone" required>-->
|
|
||||||
<!-- </mat-form-field>-->
|
|
||||||
|
|
||||||
<!-- <mat-form-field appearance="fill">-->
|
|
||||||
<!-- <mat-label>E-Mail</mat-label>-->
|
|
||||||
<!-- <input matInput formControlName="email" required>-->
|
|
||||||
<!-- <mat-error>Invalid E-Mail Address</mat-error>-->
|
|
||||||
<!-- </mat-form-field>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
|
|
||||||
<!-- <div>-->
|
|
||||||
<!-- <button mat-button matStepperNext [disabled]="firstFormGroup.status == 'INVALID'">Next</button>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- </form>-->
|
|
||||||
<!-- </mat-step>-->
|
|
||||||
|
|
||||||
|
|
||||||
<!-- Step 3-->
|
<!-- Step 3-->
|
||||||
<mat-step>
|
<mat-step>
|
||||||
<ng-template matStepLabel>Done</ng-template>
|
<form [formGroup]="thirdFormGroup" class="flexContainerColumn width30">
|
||||||
<p>You are now done.</p>
|
<ng-template matStepLabel>Consent</ng-template>
|
||||||
<div>
|
<div class="flexContainerRow width20">
|
||||||
<button mat-button matStepperPrevious>Back</button>
|
<mat-checkbox formControlName="einwilligung" required>Einwilligung zur Erhebung, Speicherung, Verarbeitung und Nutzung von
|
||||||
<button mat-button (click)="stepper.reset()">Reset</button>
|
personenbezogenen Daten </mat-checkbox>
|
||||||
|
<mat-icon aria-hidden="false" matTooltip="{{infoTextEinwilligungserklaerung}}" matTooltipPosition="right">info</mat-icon>
|
||||||
|
</div>
|
||||||
|
<div class="flexContainerRow width20">
|
||||||
|
<mat-checkbox formControlName="einverstaendniserklaerung" required>Einverständniserklärung zur Nutzung von Bild- und Videomaterial </mat-checkbox>
|
||||||
|
<mat-icon aria-hidden="false" matTooltip="{{infoTextEinverstaendniserklaerung}}" matTooltipPosition="right">info</mat-icon>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
<div class="buttonsContainer">
|
||||||
|
<button mat-button matStepperPrevious class="backButton">Back</button>
|
||||||
|
<button mat-button matStepperNext [disabled]="thirdFormGroup.status == 'INVALID'" (click)="onClick()">Submit</button>
|
||||||
</div>
|
</div>
|
||||||
</mat-step>
|
</mat-step>
|
||||||
|
|
||||||
</mat-stepper>
|
</mat-stepper>
|
||||||
|
|
|
@ -65,11 +65,3 @@ mat-icon {
|
||||||
color: white;
|
color: white;
|
||||||
scale: 80%;
|
scale: 80%;
|
||||||
}
|
}
|
||||||
|
|
||||||
mat-checkbox {
|
|
||||||
color: white;
|
|
||||||
margin-bottom: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -8,8 +8,11 @@ import {FormBuilder, FormGroup, Validators} from "@angular/forms";
|
||||||
})
|
})
|
||||||
|
|
||||||
export class StudentRegisterComponent implements OnInit {
|
export class StudentRegisterComponent implements OnInit {
|
||||||
|
masterFormGroup!: FormGroup;
|
||||||
|
zeroFormGroup!: FormGroup;
|
||||||
firstFormGroup!: FormGroup;
|
firstFormGroup!: FormGroup;
|
||||||
secondFormGroup!: FormGroup;
|
secondFormGroup!: FormGroup;
|
||||||
|
thirdFormGroup!: FormGroup;
|
||||||
isEditable = false;
|
isEditable = false;
|
||||||
infoText = "Hiermit ermächtige ich die Tanz- und Sportschule Li-Dance, Inh. Lydia Kolepp (nachfolgend Li-\n" +
|
infoText = "Hiermit ermächtige ich die Tanz- und Sportschule Li-Dance, Inh. Lydia Kolepp (nachfolgend Li-\n" +
|
||||||
"Dance) die Monatsbeiträge i.H.v. oben genannten Betrag, diverse Einmalzahlungen und sonstige\n" +
|
"Dance) die Monatsbeiträge i.H.v. oben genannten Betrag, diverse Einmalzahlungen und sonstige\n" +
|
||||||
|
@ -18,9 +21,77 @@ export class StudentRegisterComponent implements OnInit {
|
||||||
"Verwaltungsaufwand entsteht und eine Gebühr i.H.v. derzeit 15,- € berechnet wird. Diese Gebühr\n" +
|
"Verwaltungsaufwand entsteht und eine Gebühr i.H.v. derzeit 15,- € berechnet wird. Diese Gebühr\n" +
|
||||||
"wird zusammen mit dem nachfolgenden Monatsbeitrag vom gleichen Konto abgebucht."
|
"wird zusammen mit dem nachfolgenden Monatsbeitrag vom gleichen Konto abgebucht."
|
||||||
|
|
||||||
|
infoTextEinwilligungserklaerung = "Ich bin darüber informiert worden, dass meine personenbezogenen Daten aufgrund rechtlicher\n" +
|
||||||
|
"Vorgaben mindestens 10 Jahre nach Vertragsende aufbewahrt werden müssen.\n" +
|
||||||
|
"Ich bin damit einverstanden, dass die oben genannten personenbezogenen Daten zu den oben\n" +
|
||||||
|
"genannten Zwecken erhoben, gespeichert, verarbeitet, genutzt und ggfs. weitergegeben werden.\n" +
|
||||||
|
"Ich bin darauf hingewiesen worden, dass die im Rahmen der vorstehend genannten Zwecke\n" +
|
||||||
|
"erhobenen persönlichen Daten meiner Person unter Beachtung der EU-\n" +
|
||||||
|
"Datenschutzgrundverordnung (DSGVO) erhoben, gespeichert, genutzt und übermittelt werden.\n" +
|
||||||
|
"Ich bin zudem darauf hingewiesen worden, dass die Erhebung, Speicherung, Verarbeitung und\n" +
|
||||||
|
"Nutzung meiner Daten auf freiwilliger Basis erfolgt.\n" +
|
||||||
|
"Ich bin darüber informiert worden, dass diese Einverständniserklärung jederzeit mit sofortiger\n" +
|
||||||
|
"Wirkung verweigert, bzw. jederzeit mit Wirkung für die Zukunft widerrufen werden kann. Meine\n" +
|
||||||
|
"Widerrufserklärung werde ich richten an die unten angegebene Adresse"
|
||||||
|
|
||||||
|
infoTextEinverstaendniserklaerung = "Ich bin damit einverstanden, dass Bilder und Videos der Tanzschule und der Veranstaltungen,\n" +
|
||||||
|
"die durch die Tanzschule organisiert sind und/oder an denen die Tanzschule teilnimmt, auf\n" +
|
||||||
|
"denen ich selbst, mein Sohn oder meine Tochter zu sehen ist auf den Webseiten von Li-Dance und in anderen Online- und/oder Printmedien veröffentlicht\n" +
|
||||||
|
"werden und für Werbezwecke von Li-Dance genutzt werden dürfen. Rechtsgrundlage: Das Recht am eigenen Bild ist ein Teil des vom Gesetz geschützten\n" +
|
||||||
|
"allgemeinen Persönlichkeitsrechts (§22 Kunsturheberrechtsgesetz). Es gilt der Grundsatz, dass\n" +
|
||||||
|
"Bild- und Video-Material nur mit Einwilligung des Abgebildeten verbreitet oder veröffentlicht\n" +
|
||||||
|
"werden kann. Es handelt sich hierbei um eine rechtsgeschäftliche Willenserklärung. Deshalb\n" +
|
||||||
|
"kann bei Minderjährigen eine Einwilligung nur durch den gesetzlichen Vertreter erfolgen.\n" +
|
||||||
|
"Diese Einverständniserklärung kann mit sofortiger Wirkung verweigert, bzw. jederzeit mit\n" +
|
||||||
|
"Wirkung für die Zukunft widerrufen werden. Ein Widerruf kann einen Ausschluss aus der\n" +
|
||||||
|
"jeweiligen Veranstaltung zur Folge haben.\n" +
|
||||||
|
"Ein späterer rückwirkender Widerruf für aktuell stattfindende bzw. bereits stattgefundene\n" +
|
||||||
|
"Veranstaltungen ist ausgeschlossen."
|
||||||
|
|
||||||
constructor(private _formBuilder: FormBuilder) {}
|
constructor(private _formBuilder: FormBuilder) {}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
|
//TODO Test to group all forms into one master form
|
||||||
|
// this.masterFormGroup = this._formBuilder.group({
|
||||||
|
// zeroFormGroup: this._formBuilder.group({
|
||||||
|
// danceTraining: [''],
|
||||||
|
// karateTraining: [''],
|
||||||
|
// freeTraining: [''],
|
||||||
|
// }, {
|
||||||
|
// validators: [this.requireAtLeastOne]
|
||||||
|
// }),
|
||||||
|
// firstFormGroup: this._formBuilder.group({
|
||||||
|
// firstName: ['', Validators.required],
|
||||||
|
// lastName: ['', Validators.required],
|
||||||
|
// birthdate: ['', Validators.required],
|
||||||
|
// postalCode: ['', [Validators.required, Validators.pattern(/^\d+$/)]],
|
||||||
|
// address: ['', Validators.required],
|
||||||
|
// phone: ['', [Validators.required, Validators.pattern(/^\d+$/)]],
|
||||||
|
// email: ['', [Validators.required, Validators.email]],
|
||||||
|
// }),
|
||||||
|
// secondFormGroup: this._formBuilder.group({
|
||||||
|
// accountHolder: ['', Validators.required],
|
||||||
|
// iban: ['', [Validators.required, Validators.pattern(/^\d+$/)]],
|
||||||
|
// bic: ['', Validators.required],
|
||||||
|
// nameOfFinancialInstitute: ['', Validators.required],
|
||||||
|
// amount: ['', [Validators.required, Validators.pattern(/^\d+$/)]],
|
||||||
|
// einzugsermaechtigung: ['', Validators.required],
|
||||||
|
// }),
|
||||||
|
// thirdFormGroup: this._formBuilder.group({
|
||||||
|
// einwilligung: ['', Validators.required],
|
||||||
|
// einverstaendniserklaerung: ['', Validators.required],
|
||||||
|
// }),
|
||||||
|
// });
|
||||||
|
// }
|
||||||
|
|
||||||
|
this.zeroFormGroup = this._formBuilder.group({
|
||||||
|
danceTraining: [''],
|
||||||
|
karateTraining: [''],
|
||||||
|
freeTraining: [''],
|
||||||
|
}, {
|
||||||
|
validators : [this.requireAtLeastOne]
|
||||||
|
}
|
||||||
|
)
|
||||||
this.firstFormGroup = this._formBuilder.group({
|
this.firstFormGroup = this._formBuilder.group({
|
||||||
firstName: ['', Validators.required],
|
firstName: ['', Validators.required],
|
||||||
lastName: ['', Validators.required],
|
lastName: ['', Validators.required],
|
||||||
|
@ -30,17 +101,38 @@ export class StudentRegisterComponent implements OnInit {
|
||||||
phone: ['', [Validators.required, Validators.pattern(/^\d+$/)]],
|
phone: ['', [Validators.required, Validators.pattern(/^\d+$/)]],
|
||||||
email: ['', [Validators.required, Validators.email]],
|
email: ['', [Validators.required, Validators.email]],
|
||||||
});
|
});
|
||||||
|
|
||||||
this.secondFormGroup = this._formBuilder.group({
|
this.secondFormGroup = this._formBuilder.group({
|
||||||
accountHolder: ['', Validators.required],
|
accountHolder: ['', Validators.required],
|
||||||
iban: ['', [Validators.required, Validators.pattern(/^\d+$/)]],
|
iban: ['', [Validators.required, Validators.pattern(/^\d+$/)]],
|
||||||
bic: ['', Validators.required],
|
bic: ['', Validators.required],
|
||||||
nameOfFinancialInstitute: ['', Validators.required],
|
nameOfFinancialInstitute: ['', Validators.required],
|
||||||
amount: ['', [Validators.required, Validators.pattern(/^\d+$/)]],
|
amount: ['', [Validators.required, Validators.pattern(/^\d+$/)]],
|
||||||
checked: ['', Validators.required],
|
einzugsermaechtigung: ['', Validators.required],
|
||||||
|
});
|
||||||
|
|
||||||
|
this.thirdFormGroup = this._formBuilder.group({
|
||||||
|
einwilligung: ['', Validators.required],
|
||||||
|
einverstaendniserklaerung: ['', Validators.required],
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
onClick() {
|
onClick() {
|
||||||
console.log(this.firstFormGroup)
|
console.log(this.zeroFormGroup)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Custom validator function
|
||||||
|
requireAtLeastOne(formGroup: FormGroup) {
|
||||||
|
const danceTraining = formGroup.get('danceTraining')?.value
|
||||||
|
const karateTraining = formGroup.get('karateTraining')?.value
|
||||||
|
const freeTraining = formGroup.get('freeTraining')?.value
|
||||||
|
|
||||||
|
if (!danceTraining && !karateTraining && !freeTraining ) {
|
||||||
|
return {requiredAtLeastOne: true}
|
||||||
|
}
|
||||||
|
|
||||||
|
return null
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,8 @@
|
||||||
/* Provide sufficient contrast against white background */
|
/* Provide sufficient contrast against white background */
|
||||||
|
|
||||||
@import "~bootstrap-icons/font/bootstrap-icons.css";
|
@import "~bootstrap-icons/font/bootstrap-icons.css";
|
||||||
|
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: #0366d6;
|
color: #0366d6;
|
||||||
}
|
}
|
||||||
|
@ -30,7 +32,24 @@ body {
|
||||||
font-size: 95%;
|
font-size: 95%;
|
||||||
}
|
}
|
||||||
|
|
||||||
// customize datepicker
|
|
||||||
|
.mat-checkbox-checked.mat-accent .mat-checkbox-background {
|
||||||
|
background-color: #0366d6 !important;
|
||||||
|
}
|
||||||
|
mat-checkbox-checked {
|
||||||
|
border-color: white;
|
||||||
|
}
|
||||||
|
mat-checkbox {
|
||||||
|
color: white;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
.mat-step-header .mat-step-icon-selected, .mat-step-icon-state-edit{
|
||||||
|
background-color: #0366d6 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// customize datepicker
|
||||||
//.mat-datepicker-content-container {
|
//.mat-datepicker-content-container {
|
||||||
// background:transparent;
|
// background:transparent;
|
||||||
//}
|
//}
|
||||||
|
|
Loading…
Reference in New Issue