Update Angular, Angular Material and Flex Layout to 6

Updated additional project files
Updated Angular Material examples
This commit is contained in:
Sercan Yemen
2018-05-04 19:28:19 +03:00
parent 02df48ab4e
commit f4636d9a37
454 changed files with 13445 additions and 9629 deletions

View File

@@ -1,14 +1,14 @@
.example-h2 {
margin: 10px;
margin: 10px;
}
.example-section {
display: flex;
align-content: center;
align-items: center;
height: 60px;
display: flex;
align-content: center;
align-items: center;
height: 60px;
}
.example-margin {
margin: 10px;
margin: 10px;
}

View File

@@ -1,44 +1,44 @@
<mat-card>
<mat-card-content>
<h2 class="example-h2">Slider configuration</h2>
<mat-card-content>
<h2 class="example-h2">Slider configuration</h2>
<section class="example-section">
<label class="example-margin">Color:</label>
<mat-radio-group [(ngModel)]="color">
<mat-radio-button class="example-margin" value="primary">
Primary
</mat-radio-button>
<mat-radio-button class="example-margin" value="accent">
Accent
</mat-radio-button>
<mat-radio-button class="example-margin" value="warn">
Warn
</mat-radio-button>
</mat-radio-group>
</section>
<section class="example-section">
<label class="example-margin">Color:</label>
<mat-radio-group [(ngModel)]="color">
<mat-radio-button class="example-margin" value="primary">
Primary
</mat-radio-button>
<mat-radio-button class="example-margin" value="accent">
Accent
</mat-radio-button>
<mat-radio-button class="example-margin" value="warn">
Warn
</mat-radio-button>
</mat-radio-group>
</section>
<section class="example-section">
<mat-checkbox class="example-margin" [(ngModel)]="checked">Checked</mat-checkbox>
</section>
<section class="example-section">
<mat-checkbox class="example-margin" [(ngModel)]="checked">Checked</mat-checkbox>
</section>
<section class="example-section">
<mat-checkbox class="example-margin" [(ngModel)]="disabled">Disabled</mat-checkbox>
</section>
</mat-card-content>
<section class="example-section">
<mat-checkbox class="example-margin" [(ngModel)]="disabled">Disabled</mat-checkbox>
</section>
</mat-card-content>
</mat-card>
<mat-card class="result">
<mat-card-content>
<h2 class="example-h2">Result</h2>
<mat-card-content>
<h2 class="example-h2">Result</h2>
<section class="example-section">
<mat-slide-toggle
class="example-margin"
[color]="color"
[checked]="checked"
[disabled]="disabled">
Slide me!
</mat-slide-toggle>
</section>
</mat-card-content>
<section class="example-section">
<mat-slide-toggle
class="example-margin"
[color]="color"
[checked]="checked"
[disabled]="disabled">
Slide me!
</mat-slide-toggle>
</section>
</mat-card-content>
</mat-card>

View File

@@ -1,16 +1,15 @@
import { Component } from '@angular/core';
import {Component} from '@angular/core';
/**
* @title Configurable slide-toggle
*/
@Component({
selector : 'slide-toggle-configurable-example',
templateUrl: 'slide-toggle-configurable-example.html',
styleUrls : ['slide-toggle-configurable-example.css']
selector: 'slide-toggle-configurable-example',
templateUrl: 'slide-toggle-configurable-example.html',
styleUrls: ['slide-toggle-configurable-example.css'],
})
export class SlideToggleConfigurableExample
{
color = 'accent';
checked = false;
disabled = false;
export class SlideToggleConfigurableExample {
color = 'accent';
checked = false;
disabled = false;
}