Cutlery/paperless-ngx
1
0
Fork 0
mirror of https://github.com/paperless-ngx/paperless-ngx.git synced 2025-07-08 18:54:13 -04:00
Code Issues Packages Projects Releases Wiki Activity

Better loading behavior / styling

Browse Source
This commit is contained in:
shamoon 2025-07-02 12:42:15 -07:00
parent a7cdecd5a2
commit d922ec4d6e
No known key found for this signature in database
1 changed files with 7 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src-ui/src/app/components/common/pdf-editor/pdf-editor.component.html
View File

@ -54,10 +54,15 @@
</div> </div>
<div class="pdf-viewer-container w-100" [class.selected]="p.selected"> <div class="pdf-viewer-container w-100" [class.selected]="p.selected">
@defer (on viewport) { @defer (on viewport) {
<pdf-viewer [class.opacity-0]="!p.loaded" [src]="pdfSrc" [page]="p.page" [rotation]="p.rotate" [original-size]="false" [show-all]="false" [render-text]="false" (page-rendered)="p.loaded = true"></pdf-viewer> @if (!p.loaded) {
<div class="placeholder-glow w-100 h-100 z-10">
<span class="placeholder w-100 h-100"></span>
</div>
}
<pdf-viewer class="fade" [class.show]="p.loaded" [src]="pdfSrc" [page]="p.page" [rotation]="p.rotate" [original-size]="false" [show-all]="false" [render-text]="false" (page-rendered)="p.loaded = true"></pdf-viewer>
} @placeholder { } @placeholder {
<div class="placeholder-glow w-100 h-100 z-10"> <div class="placeholder-glow w-100 h-100 z-10">
<span class="placeholder w-100"></span> <span class="placeholder w-100 h-100"></span>
</div> </div>
} }
</div> </div>