AZEN-SGG/Kavita
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fixed CSS for publisher flipper

Browse source
This commit is contained in:
Hippari 2024-12-16 13:42:51 +01:00
parent 6ae9cbf4aa
commit 8312f6c0d9
3 changed files with 19 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

8
UI/Web/src/app/_single-module/publisher-flipper/publisher-flipper.component.html
View file

@ -7,8 +7,8 @@
[imageUrl]="imageService.getPublisherImage(currentPublisher!.name)" [imageUrl]="imageService.getPublisherImage(currentPublisher!.name)"
[classes]="'me-2'" [classes]="'me-2'"
[hideOnError]="true" [hideOnError]="true"
width="32px" width="24px"
height="32px" height="24px"
aria-hidden="true"> aria-hidden="true">
</app-image> </app-image>
<div class="position-relative d-inline-block" <div class="position-relative d-inline-block"
@ -23,8 +23,8 @@
[imageUrl]="imageService.getPublisherImage(nextPublisher!.name)" [imageUrl]="imageService.getPublisherImage(nextPublisher!.name)"
[classes]="'me-2'" [classes]="'me-2'"
[hideOnError]="true" [hideOnError]="true"
width="32px" width="24px"
height="32px" height="24px"
aria-hidden="true"> aria-hidden="true">
</app-image> </app-image>
<div class="position-relative d-inline-block" <div class="position-relative d-inline-block"

18
UI/Web/src/app/_single-module/publisher-flipper/publisher-flipper.component.scss
View file

@ -23,11 +23,6 @@
padding: 2px 5px; padding: 2px 5px;
font-size: 0.8rem; font-size: 0.8rem;
vertical-align: middle; vertical-align: middle;
div {
min-height: 32px;
line-height: 32px;
}
} }
.publisher-flipper { .publisher-flipper {
@ -44,14 +39,25 @@
} }
.publisher-side { .publisher-side {
position: absolute;
width: 100%; width: 100%;
height: 100%; height: 100%;
backface-visibility: hidden; backface-visibility: hidden;
// Position: absolute on the second child
&:not(:first-child) {
position: absolute;
bottom: 0;
}
.publisher-img-container {
height: 100%;
width: 100%;
}
} }
.publisher-front { .publisher-front {
z-index: 2; z-index: 2;
transform: rotateX(0deg);
} }
.publisher-back { .publisher-back {

6
UI/Web/src/app/series-detail/_components/metadata-detail-row/metadata-detail-row.component.html
View file

@ -2,10 +2,10 @@
<div class="mt-2 mb-2"> <div class="mt-2 mb-2">
@if (entity.publishers.length > 0) { @if (entity.publishers.length > 0) {
<div class="publisher-img-container d-inline-flex align-items-center me-2 position-relative"> <div class="publisher-img-container d-inline-flex align-items-center me-2 position-relative">
<app-image [imageUrl]="imageService.getPublisherImage(entity.publishers[0].name)" [classes]="'me-2'" [hideOnError]="true" width="32px" height="32px" <!--<app-image [imageUrl]="imageService.getPublisherImage(entity.publishers[0].name)" [classes]="'me-2'" [hideOnError]="true" width="32px" height="32px"
aria-hidden="true"></app-image> aria-hidden="true"></app-image>
<div class="position-relative d-inline-block" (click)="openGeneric(FilterField.Publisher, entity.publishers[0].id)">{{entity.publishers[0].name}}</div> <div class="position-relative d-inline-block" (click)="openGeneric(FilterField.Publisher, entity.publishers[0].id)">{{entity.publishers[0].name}}</div>-->
<!-- <app-publisher-flipper [publishers]="entity.publishers"></app-publisher-flipper>--> <app-publisher-flipper [publishers]="entity.publishers"></app-publisher-flipper>
</div> </div>
} }
<span class="me-2"> <span class="me-2">