(apps/mailbox) Better label toggle behavior

(apps/tasks) Better tag toggle behavior
This commit is contained in:
Sercan Yemen 2022-08-22 10:53:19 +03:00
parent a24bc3fc95
commit 3fa878b3f2
3 changed files with 12 additions and 6 deletions

View File

@ -25,9 +25,12 @@
</button> </button>
<mat-menu #toggleLabelMenu="matMenu"> <mat-menu #toggleLabelMenu="matMenu">
<ng-container *ngFor="let label of labels; trackBy: trackByFn"> <ng-container *ngFor="let label of labels; trackBy: trackByFn">
<div mat-menu-item> <div
mat-menu-item
(click)="toggleLabel(label)"
matRipple>
<mat-checkbox <mat-checkbox
(change)="toggleLabel(label)" class="pointer-events-none"
[color]="'primary'" [color]="'primary'"
[checked]="mail.labels.includes(label.id)" [checked]="mail.labels.includes(label.id)"
[disableRipple]="true"> [disableRipple]="true">

View File

@ -9,6 +9,7 @@ import { MatIconModule } from '@angular/material/icon';
import { MatInputModule } from '@angular/material/input'; import { MatInputModule } from '@angular/material/input';
import { MatMenuModule } from '@angular/material/menu'; import { MatMenuModule } from '@angular/material/menu';
import { MatProgressBarModule } from '@angular/material/progress-bar'; import { MatProgressBarModule } from '@angular/material/progress-bar';
import { MatRippleModule } from '@angular/material/core';
import { MatSelectModule } from '@angular/material/select'; import { MatSelectModule } from '@angular/material/select';
import { MatSidenavModule } from '@angular/material/sidenav'; import { MatSidenavModule } from '@angular/material/sidenav';
import { QuillModule } from 'ngx-quill'; import { QuillModule } from 'ngx-quill';
@ -36,7 +37,7 @@ import { mailboxRoutes } from 'app/modules/admin/apps/mailbox/mailbox.routing';
MailboxSettingsComponent, MailboxSettingsComponent,
MailboxSidebarComponent MailboxSidebarComponent
], ],
imports : [ imports: [
RouterModule.forChild(mailboxRoutes), RouterModule.forChild(mailboxRoutes),
MatButtonModule, MatButtonModule,
MatCheckboxModule, MatCheckboxModule,
@ -47,6 +48,7 @@ import { mailboxRoutes } from 'app/modules/admin/apps/mailbox/mailbox.routing';
MatInputModule, MatInputModule,
MatMenuModule, MatMenuModule,
MatProgressBarModule, MatProgressBarModule,
MatRippleModule,
MatSelectModule, MatSelectModule,
MatSidenavModule, MatSidenavModule,
QuillModule.forRoot(), QuillModule.forRoot(),
@ -54,7 +56,7 @@ import { mailboxRoutes } from 'app/modules/admin/apps/mailbox/mailbox.routing';
FuseNavigationModule, FuseNavigationModule,
FuseScrollbarModule, FuseScrollbarModule,
FuseScrollResetModule, FuseScrollResetModule,
SharedModule SharedModule,
] ]
}) })
export class MailboxModule export class MailboxModule

View File

@ -148,9 +148,10 @@
(click)="toggleTaskTag(tag)" (click)="toggleTaskTag(tag)"
matRipple> matRipple>
<mat-checkbox <mat-checkbox
class="flex items-center h-10 min-h-10" class="flex items-center h-10 min-h-10 pointer-events-none"
[checked]="task.tags.includes(tag.id)"
[color]="'primary'" [color]="'primary'"
[checked]="task.tags.includes(tag.id)"> [disableRipple]="true">
</mat-checkbox> </mat-checkbox>
<div class="ml-1">{{tag.title}}</div> <div class="ml-1">{{tag.title}}</div>
</div> </div>