Checkbox

Checkbox

<mat-checkbox class="sz-medium" [checked]="true" [indeterminate]="false" [disabled]="false" [required]="false" labelPosition="after">
  Accept terms and conditions
</mat-checkbox>

Destructive Checkbox

<mat-checkbox class="destructive sz-medium" [checked]="true" [indeterminate]="false" [disabled]="false">
  Delete all personal data and logs
</mat-checkbox>

Checkbox Group

<div class="checkbox-group">
  <mat-checkbox class="sz-medium" [checked]="false" [indeterminate]="true" (change)="setAll($event.checked)">
    Select All Notifications
  </mat-checkbox>
  <div class="sub-tasks" style="display: flex; flex-direction: column; margin-left: 1.5rem; gap: 0.5rem;">
    @for (task of tasks(); track task.name) {
      <mat-checkbox class="sz-medium" [(ngModel)]="task.completed">
        {{task.name}}
      </mat-checkbox>
    }
  </div>
</div>