paradizelost/paperless-ngx
1
0
Fork 0
mirror of https://github.com/paperless-ngx/paperless-ngx.git synced 2025-10-30 03:56:23 -05:00
Code Issues Packages Projects Releases Wiki Activity

bs5: fix large card display

Browse Source
This commit is contained in:
Michael Shamoon
2022-02-19 21:38:07 -08:00
parent 8ba282362d
commit 7b7ba83a87
2 changed files with 7 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src-ui/src/app/components/document-list/document-card-large/document-card-large.component.html
View File

@@ -1,9 +1,9 @@
<div class="card mb-3 shadow-sm" [class.card-selected]="selected" [class.document-card]="selectable" [class.popover-hidden]="popoverHidden" (mouseleave)="mouseLeaveCard()"> <div class="card mb-3 shadow-sm" [class.card-selected]="selected" [class.document-card]="selectable" [class.popover-hidden]="popoverHidden" (mouseleave)="mouseLeaveCard()">
<div class="row no-gutters"> <div class="row g-0">
<div class="col-md-2 d-none d-lg-block doc-img-background rounded-start" [class.doc-img-background-selected]="selected" (click)="this.toggleSelected.emit($event)"> <div class="col-md-2 doc-img-background rounded-start" [class.doc-img-background-selected]="selected" (click)="this.toggleSelected.emit($event)">
<img [src]="getThumbUrl()" class="card-img doc-img border-end rounded-start" [class.inverted]="getIsThumbInverted()"> <img [src]="getThumbUrl()" class="card-img doc-img border-end rounded-start" [class.inverted]="getIsThumbInverted()">
<div style="top: 0; left: 0" class="position-absolute border-end border-bottom bg-light p-1" [class.document-card-check]="!selected"> <div style="top: 0; left: 0" class="position-absolute border-end border-bottom bg-light py-1 px-2" [class.document-card-check]="!selected">
<div class="custom-control custom-checkbox"> <div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="smallCardCheck{{document.id}}" [checked]="selected" (click)="this.toggleSelected.emit($event)"> <input type="checkbox" class="custom-control-input" id="smallCardCheck{{document.id}}" [checked]="selected" (click)="this.toggleSelected.emit($event)">
<label class="custom-control-label" for="smallCardCheck{{document.id}}"></label> <label class="custom-control-label" for="smallCardCheck{{document.id}}"></label>

4
src-ui/src/app/components/document-list/document-card-large/document-card-large.component.scss
View File

@@ -4,6 +4,10 @@
overflow-wrap: anywhere; overflow-wrap: anywhere;
} }
.doc-img-background {
position: relative;
}
.doc-img { .doc-img {
object-fit: cover; object-fit: cover;
object-position: top left; object-position: top left;