Change taskLists selection display.
This commit is contained in:
@@ -104,7 +104,7 @@
|
|||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
justify-content: space-around;
|
justify-content: space-around;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
padding: .5rem 1rem;
|
padding: .5rem 0 .5rem 1rem;
|
||||||
|
|
||||||
button {
|
button {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|||||||
@@ -26,6 +26,6 @@
|
|||||||
Cliquez sur une liste pour la sélectionner
|
Cliquez sur une liste pour la sélectionner
|
||||||
</div>
|
</div>
|
||||||
<div class="actions">
|
<div class="actions">
|
||||||
<button mat-raised-button (click)="disableSelectionMode()">Annuler</button>
|
<button class="raised" (click)="disableSelectionMode()">Annuler</button>
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|||||||
@@ -15,9 +15,11 @@
|
|||||||
{{taskList.tasks?.length}} tâches
|
{{taskList.tasks?.length}} tâches
|
||||||
</ng-template>
|
</ng-template>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
||||||
|
<mat-icon *ngIf="isSelectionModeEnabled() && isSelected(taskList)" class="selection-icon">done</mat-icon>
|
||||||
</div>
|
</div>
|
||||||
{{taskList.name}}
|
{{taskList.name}}
|
||||||
<ng-container *ngIf="isSelectionModeEnabled() && isSelected(taskList)">
|
<ng-container >
|
||||||
SELECTED
|
SELECTED
|
||||||
</ng-container>
|
</ng-container>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -21,6 +21,16 @@
|
|||||||
border-radius: .5rem;
|
border-radius: .5rem;
|
||||||
background-color: aliceblue;
|
background-color: aliceblue;
|
||||||
margin-bottom: .5rem;
|
margin-bottom: .5rem;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.selection-icon {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
right: 0;
|
||||||
|
font-size: 3rem;
|
||||||
|
width: 3rem;
|
||||||
|
height: 3rem;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user