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

cleanup css

Browse Source
This commit is contained in:
Bolko Schreiber
2021-02-25 15:35:15 +01:00
parent cd2f36f86c
commit d5c694e042
5 changed files with 6 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -1,7 +1,7 @@
<div class="card mb-3 shadow-sm" [class.card-selected]="selected" [class.document-card]="selectable">
<div class="row no-gutters">
<div class="col-md-2 d-none d-lg-block doc-img-background rounded-left" [class.doc-img-background-selected]="selected" (click)="this.toggleSelected.emit($event)">
<img [src]="getThumbUrl()" class="card-img {{ getIsThumbInverted() ? 'doc-img-inverted' : 'doc-img' }} border-right rounded-left">
<img [src]="getThumbUrl()" class="card-img doc-img border-right rounded-left" [class.inverted]="getIsThumbInverted()">
<div style="top: 0; left: 0" class="position-absolute border-right border-bottom bg-light p-1" [class.document-card-check]="!selected">
<div class="custom-control custom-checkbox">

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

@@ -4,7 +4,7 @@
overflow-wrap: anywhere;
}
.doc-img, .doc-img-inverted {
.doc-img {
object-fit: cover;
object-position: top left;
height: 100%;

2
src-ui/src/app/components/document-list/document-card-small/document-card-small.component.html
View File

@@ -1,7 +1,7 @@
<div class="col p-2 h-100">
<div class="card h-100 shadow-sm document-card" [class.card-selected]="selected">
<div class="border-bottom doc-img-container" [class.doc-img-background-selected]="selected" (click)="this.toggleSelected.emit($event)">
<img class="card-img {{ getIsThumbInverted() ? 'doc-img-inverted' : 'doc-img' }} rounded-top" [src]="getThumbUrl()">
<img class="card-img doc-img rounded-top" [class.inverted]="getIsThumbInverted()" [src]="getThumbUrl()">
<div class="border-right border-bottom bg-light p-1 rounded document-card-check">
<div class="custom-control custom-checkbox">

2
src-ui/src/app/components/document-list/document-card-small/document-card-small.component.scss
View File

@@ -1,6 +1,6 @@
@import "/src/theme";
.doc-img, .doc-img-inverted {
.doc-img {
object-fit: cover;
object-position: top left;
height: 200px;

11
src-ui/src/theme_dark.scss
View File

@@ -147,18 +147,11 @@ $border-color-dark-mode: #47494f;
}
}
.doc-img-inverted {
mix-blend-mode: normal;
.doc-img.inverted {
filter: invert(95%) hue-rotate(180deg);
border-radius: 0;
border-color: $bg-dark-mode;
&.border-right {
border-right: none !important;
}
}
.card-selected .doc-img .doc-img-inverted {
.card-selected .doc-img {
mix-blend-mode: luminosity;
}