Mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2025-02-24 00:38:49 +01:00
Code Issues Projects Releases Packages Wiki Activity

Restyle cards

Browse source 
Got to max-height it, and then make sure the images crop smaller
This commit is contained in:
Lim Chee Aun 2022-12-26 00:43:17 +08:00
parent c75bf36345
commit c8ea2e8703
1 changed files with 14 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
src/components/status.css
View file

@ -392,18 +392,17 @@
border: 1px solid var(--outline-color); border: 1px solid var(--outline-color);
overflow: hidden; overflow: hidden;
color: inherit; color: inherit;
align-items: center; align-items: stretch;
background: var(--bg-color); background: var(--bg-color);
max-height: 160px;
} }
.card .image { .card .image {
/* min-width: 120px; */ width: 35%;
width: 50%;
max-width: 160px;
height: auto; height: auto;
min-height: 120px; flex-grow: 1;
max-height: 160px;
object-fit: cover;
border-inline-end: 1px solid var(--outline-color); border-inline-end: 1px solid var(--outline-color);
object-fit: cover;
aspect-ratio: 1 / 1;
} }
.card:hover .image { .card:hover .image {
animation: position-object 5s ease-in-out 1s 5; animation: position-object 5s ease-in-out 1s 5;
@ -414,6 +413,8 @@
.card .meta-container { .card .meta-container {
padding: 8px; padding: 8px;
min-width: 0; min-width: 0;
flex-grow: 1;
align-self: center;
} }
.card .title { .card .title {
line-height: 1.25; line-height: 1.25;
@ -431,10 +432,14 @@
font-size: smaller; font-size: smaller;
opacity: 0.75; opacity: 0.75;
margin: 0; margin: 0;
white-space: nowrap;
text-overflow: ellipsis; text-overflow: ellipsis;
overflow: hidden; overflow: hidden;
display: block; display: -webkit-box;
display: box;
-webkit-box-orient: vertical;
box-orient: vertical;
-webkit-line-clamp: 2;
line-clamp: 2;
} }
.card .meta.domain { .card .meta.domain {
opacity: 1; opacity: 1;