ipsos-components/src/material-examples/sidenav-mode/sidenav-mode-example.html

Material Design components for Angular

<mat-sidenav-container class="example-container" *ngIf="shouldRun">
  <mat-sidenav #sidenav [mode]="mode.value">
    <p><button mat-button (click)="sidenav.toggle()">Toggle</button></p>
    <p>
      <mat-radio-group class="example-radio-group" [formControl]="mode">
        <label>Mode:</label>
        <mat-radio-button value="over">Over</mat-radio-button>
        <mat-radio-button value="side">Side</mat-radio-button>
        <mat-radio-button value="push">Push</mat-radio-button>
      </mat-radio-group>
    </p>
  </mat-sidenav>

  <mat-sidenav-content>
    <p><button mat-button (click)="sidenav.toggle()">Toggle</button></p>
    <p>
      <mat-radio-group class="example-radio-group" [formControl]="mode">
        <label>Mode:</label>
        <mat-radio-button value="over">Over</mat-radio-button>
        <mat-radio-button value="side">Side</mat-radio-button>
        <mat-radio-button value="push">Push</mat-radio-button>
      </mat-radio-group>
    </p>
  </mat-sidenav-content>
</mat-sidenav-container>

<div *ngIf="!shouldRun">Please open on Stackblitz to see result</div>