rtzjssr
This commit is contained in:
parent
350c2e7bdd
commit
a1e75f6229
@ -142,7 +142,6 @@
|
||||
background: #1a0f04;
|
||||
cursor: pointer;
|
||||
transition: transform 0.2s, box-shadow 0.2s, border-color 0.2s;
|
||||
aspect-ratio: 3/4;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
@ -152,13 +151,19 @@
|
||||
box-shadow: 0 8px 24px rgba(0,0,0,0.7), 0 0 14px rgba(200,160,60,0.3);
|
||||
z-index: 10;
|
||||
}
|
||||
.baz-card-img {
|
||||
position: relative;
|
||||
aspect-ratio: 3/4;
|
||||
overflow: visible;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.baz-card img {
|
||||
width: 100%; height: 100%;
|
||||
object-fit: cover; display: block;
|
||||
border-radius: 6px 6px 0 0;
|
||||
}
|
||||
|
||||
/* Stats */
|
||||
/* Stats – relativ zur Bild-Wrapper */
|
||||
.baz-stat-atk {
|
||||
position: absolute; right: 8px; top: 38%;
|
||||
transform: translateY(-50%);
|
||||
@ -176,7 +181,7 @@
|
||||
padding: 2px 4px; z-index: 5;
|
||||
}
|
||||
.baz-stat-cd {
|
||||
position: absolute; bottom: 32px; right: 5px;
|
||||
position: absolute; bottom: 6px; right: 5px;
|
||||
width: 18px; height: 18px; border-radius: 50%;
|
||||
background: rgba(0,0,0,0.75); border: 1px solid #f0d060;
|
||||
display: flex; align-items: center; justify-content: center;
|
||||
@ -205,18 +210,21 @@
|
||||
.baz-badge-range { background: rgba(30,20,0,0.82); border: 1px solid #e8b84b; color: #e8b84b; }
|
||||
.baz-badge-race { background: rgba(0,25,0,0.82); border: 1px solid #7de87d; color: #7de87d; }
|
||||
|
||||
/* Preis-Badge */
|
||||
/* Preis-Leiste unter dem Bild */
|
||||
.baz-price {
|
||||
position: absolute; bottom: 0; left: 0; right: 0;
|
||||
display: flex; justify-content: center; gap: 4px; flex-wrap: wrap;
|
||||
padding: 2px 3px 3px;
|
||||
background: linear-gradient(transparent, rgba(0,0,0,0.85));
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 4px;
|
||||
flex-wrap: wrap;
|
||||
padding: 4px 4px;
|
||||
background: rgba(0,0,0,0.6);
|
||||
border-top: 1px solid #3a2810;
|
||||
border-radius: 0 0 6px 6px;
|
||||
z-index: 7; pointer-events: none;
|
||||
min-height: 20px;
|
||||
}
|
||||
.baz-price-gold, .baz-price-silver {
|
||||
font-family: "Cinzel", serif; font-size: 8px; font-weight: bold;
|
||||
line-height: 1.3;
|
||||
.baz-price-wood, .baz-price-iron,
|
||||
.baz-price-gold, .baz-price-gems, .baz-price-silver {
|
||||
font-family: "Cinzel", serif; font-size: 9px; font-weight: bold; line-height: 1.4;
|
||||
}
|
||||
.baz-price-wood { color: #c8a050; }
|
||||
.baz-price-iron { color: #a0b0c0; }
|
||||
|
||||
@ -145,6 +145,7 @@ async function loadShopCards() {
|
||||
|
||||
return `
|
||||
<div class="baz-card" data-card-id="${c.id}" title="${c.name}">
|
||||
<div class="baz-card-img">
|
||||
<img src="/images/cards/${c.image}" alt="${c.name}"
|
||||
onerror="this.src='/images/avatar_placeholder.svg'">
|
||||
${c.attack != null ? `<span class="baz-stat-atk">${c.attack}</span>` : ""}
|
||||
@ -156,6 +157,7 @@ async function loadShopCards() {
|
||||
${c.range != null ? `<span class="baz-badge-range">${BAZ_SVG_RANGE} ${c.range}</span>` : ""}
|
||||
${c.race != null ? `<span class="baz-badge-race">${BAZ_SVG_RACE} ${c.race}</span>` : ""}
|
||||
</div>` : ""}
|
||||
</div>
|
||||
<div class="baz-price">${prices || "<span style='color:#8b6a3c;font-size:8px;'>Kostenlos</span>"}</div>
|
||||
</div>`;
|
||||
}).join("");
|
||||
|
||||
Loading…
Reference in New Issue
Block a user