Skip to content

Commit 6abc54f

Browse files
author
Iulianna_Stepanova
committed
button-toggle-added
1 parent bbc165b commit 6abc54f

File tree

10 files changed

+85
-1
lines changed

10 files changed

+85
-1
lines changed

‎angular-site/src/app/buttons-and-indicators/button-toggle/button-toggle.component.html‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,6 @@
11
<button-toggle-overview-example></button-toggle-overview-example>
22
<button-toggle-exclusive-example></button-toggle-exclusive-example>
3+
<app-button-toggle-appearance></app-button-toggle-appearance>
4+
<app-button-toggle-disabled></app-button-toggle-disabled>
5+
<app-button-toggle-vertical></app-button-toggle-vertical>
6+
<app-button-toggle-disable-ripple></app-button-toggle-disable-ripple>

‎angular-site/src/app/buttons-and-indicators/button-toggle/button-toggle.module.ts‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,10 +7,14 @@ import {ButtonToggleOverviewExample} from './components/button-toggle-overview-e
77
import {MatButtonToggleModule} from '@angular/material/button-toggle';
88
import {ButtonToggleExclusiveExample} from './components/button-toggle-exclusive-example';
99
import {MatIconModule} from '@angular/material/icon';
10+
import {ButtonToggleAppearanceComponent} from "./components/button-toggle-appearance/button-toggle-appearance.component";
11+
import { ButtonToggleDisabledComponent } from './components/button-toggle-disabled/button-toggle-disabled.component';
12+
import { ButtonToggleVerticalComponent } from './components/button-toggle-vertical/button-toggle-vertical.component';
13+
import { ButtonToggleDisableRippleComponent } from './components/button-toggle-disable-ripple/button-toggle-disable-ripple.component';
1014

1115

1216
@NgModule({
13-
declarations: [ButtonToggleComponent, ButtonToggleOverviewExample, ButtonToggleExclusiveExample],
17+
declarations: [ButtonToggleComponent, ButtonToggleOverviewExample, ButtonToggleExclusiveExample, ButtonToggleAppearanceComponent, ButtonToggleDisabledComponent, ButtonToggleVerticalComponent, ButtonToggleDisableRippleComponent],
1418
imports: [
1519
CommonModule,
1620
ButtonToggleRoutingModule,

‎angular-site/src/app/buttons-and-indicators/button-toggle/components/button-toggle-appearance/button-toggle-appearance.component.html‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<h2 class="example-h2">
2+
<a href="https://v15.material.angular.io/components/button-toggle/overview#appearance">
3+
Basic button-toggles appearance legacy
4+
</a>
5+
</h2>
6+
<mat-button-toggle-group appearance="legacy" id="mat-button-toggle-group-appearance" name="fontStyle" aria-label="Font Style" multiple>
7+
<mat-button-toggle value="bold" >Bold</mat-button-toggle>
8+
<mat-button-toggle value="italic" >Italic</mat-button-toggle>
9+
<mat-button-toggle value="underline">Underline</mat-button-toggle>
10+
</mat-button-toggle-group>

‎angular-site/src/app/buttons-and-indicators/button-toggle/components/button-toggle-appearance/button-toggle-appearance.component.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { Component } from '@angular/core';
2+
3+
@Component({
4+
selector: 'app-button-toggle-appearance',
5+
templateUrl: './button-toggle-appearance.component.html',
6+
})
7+
export class ButtonToggleAppearanceComponent {
8+
9+
}

‎angular-site/src/app/buttons-and-indicators/button-toggle/components/button-toggle-disable-ripple/button-toggle-disable-ripple.component.html‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<h2 class="example-h2">
2+
<a href="https://v15.material.angular.io/components/button-toggle/api#MatButtonToggle">
3+
Basic button-toggles disable ripple
4+
</a>
5+
</h2>
6+
<mat-button-toggle-group id="mat-button-toggle-group" name="fontStyle" aria-label="Font Style" multiple>
7+
<mat-button-toggle disableRipple id="mat-button-toggle-disable-ripple-option-one" value="bold" >Bold disable ripple</mat-button-toggle>
8+
<mat-button-toggle disableRipple id="mat-button-toggle-disable-ripple-option-two" value="italic" >Italic disable ripple</mat-button-toggle>
9+
<mat-button-toggle id="mat-button-toggle-disable-ripple-option-three" value="underline">Underline enable ripple</mat-button-toggle>
10+
</mat-button-toggle-group>

‎angular-site/src/app/buttons-and-indicators/button-toggle/components/button-toggle-disable-ripple/button-toggle-disable-ripple.component.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { Component } from '@angular/core';
2+
3+
@Component({
4+
selector: 'app-button-toggle-disable-ripple',
5+
templateUrl: './button-toggle-disable-ripple.component.html',
6+
})
7+
export class ButtonToggleDisableRippleComponent {
8+
9+
}

‎angular-site/src/app/buttons-and-indicators/button-toggle/components/button-toggle-disabled/button-toggle-disabled.component.html‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<h2 class="example-h2">
2+
<a href="https://v15.material.angular.io/components/button-toggle/api#MatButtonToggleGroup">
3+
Basic button-toggles group disabled
4+
</a>
5+
</h2>
6+
<mat-button-toggle-group disabled id="mat-button-toggle-group-disabled" name="fontStyle" aria-label="Font Style" multiple>
7+
<mat-button-toggle value="bold" >Bold</mat-button-toggle>
8+
<mat-button-toggle value="italic" >Italic</mat-button-toggle>
9+
<mat-button-toggle value="underline">Underline</mat-button-toggle>
10+
</mat-button-toggle-group>

‎angular-site/src/app/buttons-and-indicators/button-toggle/components/button-toggle-disabled/button-toggle-disabled.component.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { Component } from '@angular/core';
2+
3+
@Component({
4+
selector: 'app-button-toggle-disabled',
5+
templateUrl: './button-toggle-disabled.component.html',
6+
})
7+
export class ButtonToggleDisabledComponent {
8+
9+
}

‎angular-site/src/app/buttons-and-indicators/button-toggle/components/button-toggle-vertical/button-toggle-vertical.component.html‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<h2 class="example-h2">
2+
<a href="https://v15.material.angular.io/components/button-toggle/api#MatButtonToggleGroup">
3+
Basic button-toggles group vertical
4+
</a>
5+
</h2>
6+
<mat-button-toggle-group vertical id="mat-button-toggle-group-vertical" name="fontStyle" aria-label="Font Style" multiple>
7+
<mat-button-toggle value="bold" >Bold</mat-button-toggle>
8+
<mat-button-toggle value="italic" >Italic</mat-button-toggle>
9+
<mat-button-toggle value="underline">Underline</mat-button-toggle>
10+
</mat-button-toggle-group>

‎angular-site/src/app/buttons-and-indicators/button-toggle/components/button-toggle-vertical/button-toggle-vertical.component.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { Component } from '@angular/core';
2+
3+
@Component({
4+
selector: 'app-button-toggle-vertical',
5+
templateUrl: './button-toggle-vertical.component.html',
6+
})
7+
export class ButtonToggleVerticalComponent {
8+
9+
}

0 commit comments

Comments
 (0)