feat: move the series count overlay & add title tooltip (#881)

* feat: move the series count overlay to right & add title
* small alignment tweaks
This commit is contained in:
Ionuț Staicu
2025-08-11 22:33:19 +03:00
committed by GitHub
parent ec5157464a
commit 3be321dda4
2 changed files with 12 additions and 5 deletions

View File

@@ -66,7 +66,7 @@
<div [hidden]="bottomBarHidden">
<div class="book-title-container flex items-center">
<h4 class="book-title m-0 pl-2">{{ book.metadata?.title }}</h4>
<h4 class="book-title m-0 pl-2" [title]="book.metadata?.title">{{ book.metadata?.title }}</h4>
<p-tieredmenu #menu [model]="items" [popup]="true" appendTo="body"></p-tieredmenu>
<p-button
class="custom-button-padding"

View File

@@ -112,6 +112,9 @@
transition: opacity 0.2s ease, visibility 0.2s ease;
z-index: 2;
}
.select-checkbox .p-checkbox {
vertical-align: top;
}
.cover-container:hover .select-checkbox,
.book-card.selected .select-checkbox {
@@ -144,8 +147,8 @@
.series-number-overlay {
position: absolute;
top: 4px;
left: 4px;
bottom: 8px;
left: 8px;
background-color: rgba(0, 0, 0, 0.7);
color: white;
font-size: 0.75rem;
@@ -156,8 +159,8 @@
.series-count-overlay {
position: absolute;
top: 4px;
right: 4px;
top: 8px;
left: 8px;
background-color: var(--primary-color);
color: var(--primary-text-color-dark);
font-size: 0.75rem;
@@ -171,6 +174,10 @@
box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
}
.series-number-overlay + .series-count-overlay {
top: calc(8px + 1.5rem)
}
::ng-deep .progress-incomplete .p-progressbar-value {
background-color: #3b82f6;
}