From 52e6b455809bdf488ae50f1ef7ab690e3ee0dd06 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Sat, 19 Feb 2022 21:38:29 -0800
Subject: [PATCH] bs5: fix small cards display

---
 .../document-card-small/document-card-small.component.html   | 2 +-
 .../document-card-small/document-card-small.component.scss   | 5 -----
 .../components/document-list/document-list.component.html    | 2 +-
 3 files changed, 2 insertions(+), 7 deletions(-)

diff --git a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html
index c11f8b74e..7ffa1499d 100644
--- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html
+++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html
@@ -3,7 +3,7 @@
     <div class="border-bottom doc-img-container" [class.doc-img-background-selected]="selected" (click)="this.toggleSelected.emit($event)">
       <img class="card-img doc-img rounded-top" [class.inverted]="getIsThumbInverted()" [src]="getThumbUrl()">
 
-      <div class="border-end border-bottom bg-light p-1 rounded document-card-check">
+      <div class="border-end border-bottom bg-light py-1 px-2 document-card-check">
         <div class="custom-control custom-checkbox">
           <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>
diff --git a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.scss b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.scss
index 943df03b9..21230c7e3 100644
--- a/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.scss
+++ b/src-ui/src/app/components/document-list/document-card-small/document-card-small.component.scss
@@ -16,11 +16,6 @@
   position: absolute;
   top: 0;
   left: 0;
-
-  .custom-control {
-    margin-left: 4px;
-    margin-right: -3px;
-  }
 }
 
 .document-card:hover .document-card-check {
diff --git a/src-ui/src/app/components/document-list/document-list.component.html b/src-ui/src/app/components/document-list/document-list.component.html
index 804e93727..c154a5991 100644
--- a/src-ui/src/app/components/document-list/document-list.component.html
+++ b/src-ui/src/app/components/document-list/document-list.component.html
@@ -182,7 +182,7 @@
   </table>
 
   <div class="m-n2 row row-cols-paperless-cards" *ngIf="displayMode == 'smallCards'">
-    <app-document-card-small [selected]="list.isSelected(d)" (toggleSelected)="toggleSelected(d, $event)" [document]="d" *ngFor="let d of list.documents; trackBy: trackByDocumentId" (clickTag)="clickTag($event)" (clickCorrespondent)="clickCorrespondent($event)" (clickDocumentType)="clickDocumentType($event)"></app-document-card-small>
+    <app-document-card-small class="p-0" [selected]="list.isSelected(d)" (toggleSelected)="toggleSelected(d, $event)" [document]="d" *ngFor="let d of list.documents; trackBy: trackByDocumentId" (clickTag)="clickTag($event)" (clickCorrespondent)="clickCorrespondent($event)" (clickDocumentType)="clickDocumentType($event)"></app-document-card-small>
   </div>