Another attempt at a major redesign, but for real this time, i swear

This commit is contained in:
Firq 2024-10-21 16:57:02 +02:00
parent 676e5e2b00
commit 9d8493273d
Signed by: Firq
GPG key ID: 3ACC61C8CEC83C20
10 changed files with 54 additions and 69 deletions
src/components/cards

View file

@ -64,7 +64,8 @@ if (bond10 === false) {
}
article:hover {
transform: scale(var(--hover-scale));
transform: scale(1);
border-color: var(--c-darkpurple);
}
article {
@ -72,14 +73,13 @@ if (bond10 === false) {
flex-wrap: wrap;
flex-direction: column;
background-color: var(--c-darkergray);
border-color: var(--c-darkgray);
border: 2px var(--c-darkgray) solid;
padding: 0em 0.75em 0.5rem 0.75em;
width: max(40%, 100px);
height: auto;
justify-content: center;
align-items: center;
text-align: center;
transition: transform var(--speed) var(--ease);
border-radius: 1.25rem;
}
@ -98,27 +98,27 @@ if (bond10 === false) {
}
.expand-on-hover {
background-color: var(--c-duskgray);
background-color: var(--c-darkergray);
border: 2px var(--c-darkpurple) solid;
border-top: 0px;
z-index: 99;
transform: scaleY(0);
transform-origin: top;
position: absolute;
top: 92.5%;
left: 0px;
right: 0px;
border-radius: 0px 0px 1.25rem 1.25rem;
width: 100%;
}
article:hover .expand-on-hover {
transform: scaleY(1);
transition: transform 200ms ease-in-out;
background-color: var(--c-duskgray);
}
.bond-ce {
padding-top: 0.75rem;
width: auto;
height: 3rem;
height: 3.5rem;
}
.unobtained {
@ -133,16 +133,12 @@ if (bond10 === false) {
}
article > img {
width: 200px;
height: 200px;
width: 128px;
height: 128px;
}
.bond-ce {
height: 3.5rem;
}
.expand-on-hover {
top: 95%;
height: 3rem;
}
}
</style>