<div class="result-header" (click)="openPath()">
    <span class="mdi mdi-{{result.file.icon}} file-{{result.file.icon}}"></span>
    <span class="file-name">{{result.file.fullName | highlightWord}}</span>
    <span class="file-size mat-small">{{result.file.size | formatBytes}}</span>
    <app-avatar [blob]="result.resourceAvatar"></app-avatar>
    <span class="resource-name">{{result.resourceName}}</span>
</div>
<div class="result-snippet">
    <span class="mat-small" *ngFor="let snippet of result.snippets" [innerHTML]="snippet"></span>
</div>
<div class="result-footer" (click)="openPath()">
    <span class="mat-small" class="drive-path">
        <ul>
            <li>
                <mat-icon>computer</mat-icon>
            </li>
            <li *ngFor="let pathSlice of result.path | pathToArray">
                <mat-icon>keyboard_arrow_right</mat-icon>
                <span class="mat-small">{{pathSlice}}</span>
            </li>
        </ul>
        
        
    </span>  
    <span class="date mat-small">{{result.file.createdAt | date:'short'}}</span>
</div>