mirrors/calibre-web
1
0
Fork 0
mirror of https://github.com/janeczku/calibre-web synced 2024-11-15 22:34:56 +00:00
Code Issues Releases Wiki Activity

refactor: preserve aspect ratio of cover images

Browse Source
This commit is contained in:
Blondel MONDESIR 2023-07-15 07:10:02 -04:00
parent b650ab9025
commit 83c8bdba6c
1 changed files with 12 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
cps/static/css/style.css
View File

@ -141,31 +141,35 @@ table .bg-dark-danger a { color: #fff; }
.container-fluid .book { .container-fluid .book {
margin-top: 20px; margin-top: 20px;
margin-right: 10px; margin-right: 10px;
max-width: 180px; max-width: 150px;
display: inline-block; display: inline-block;
vertical-align: top; vertical-align: top;
box-sizing: border-box; box-sizing: border-box;
text-align: center;
} }
.container-fluid .book:last-child { .container-fluid .book:last-child {
margin-right: 0; /* Remove the margin on the last book */ margin-right: 0;
} }
.cover { margin-bottom: 10px; } .cover { margin-bottom: 10px; }
.container-fluid .book .cover { .container-fluid .book .cover {
width: 180px; /* Set a fixed width for the cover container */ width: 150px;
height: 180px; /* Set a fixed height for the cover container */ height: 150px;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
border: 1px solid #ddd; /* Add a subtle border */ border: 1px solid #ddd;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Add a box shadow effect */ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
} }
.container-fluid .book .cover img { .container-fluid .book .cover img {
width: 100%;
height: 100%; height: 100%;
object-fit: cover; width: auto;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
} }
.author-link img { .author-link img {