purchasing/fuse-angular
3
0
Fork 0
mirror of https://github.com/richard-loafle/fuse-angular.git synced 2025-01-08 19:45:08 +00:00
Code Issues Packages Projects Releases Wiki Activity

(apps/file-manager) Better grid

Browse Source
This commit is contained in:
sercan 2021-04-20 22:44:12 +03:00
parent 5e8701f517
commit 4b268e5d1b
1 changed files with 8 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/app/modules/admin/apps/file-manager/list/list.component.html
View File

@ -47,8 +47,7 @@
<!-- Folders -->
<div class="font-medium">Folders</div>
<div
class="grid gap-4 mt-4"
style="grid-template-columns: repeat(auto-fill,minmax(160px,1fr))">
class="flex flex-wrap -m-2 mt-2">
<ng-container *ngFor="let folder of items.folders; trackBy:trackByFn">
<ng-container *ngTemplateOutlet="item, context: {$implicit: folder}"></ng-container>
</ng-container>
@ -57,8 +56,7 @@
<!-- Files -->
<div class="font-medium mt-8">Files</div>
<div
class="grid gap-4 mt-4"
style="grid-template-columns: repeat(auto-fill,minmax(160px,1fr))">
class="flex flex-wrap -m-2 mt-2">
<ng-container *ngFor="let file of items.files; trackBy:trackByFn">
<ng-container *ngTemplateOutlet="item, context: {$implicit: file}"></ng-container>
</ng-container>
@ -71,7 +69,7 @@
#item
let-item>
<div
class="flex flex-col shadow rounded-2xl cursor-pointer bg-card"
class="flex flex-col w-40 h-40 m-2 p-4 shadow rounded-2xl cursor-pointer bg-card"
(click)="goToItem(item.id)">
<div class="aspect-w-9 aspect-h-6">
<div class="flex items-center justify-center">
@ -103,12 +101,12 @@
</ng-container>
</div>
</div>
<div class="flex flex-col flex-auto justify-center text-center text-sm font-medium">
<div
class="pb-4 px-4 text-center text-sm font-medium"
[matTooltip]="item.name">
<div class="truncate">{{item.name}}</div>
class="truncate"
[matTooltip]="item.name">{{item.name}}</div>
<ng-container *ngIf="item.contents">
<div class="mt-0.5 text-secondary truncate">{{item.contents}}</div>
<div class="text-secondary truncate">{{item.contents}}</div>
</ng-container>
</div>
</div>