diff --git a/src/assets/css/main.scss b/src/assets/css/main.scss index 328e52a..6dd2ea9 100644 --- a/src/assets/css/main.scss +++ b/src/assets/css/main.scss @@ -5,6 +5,11 @@ opacity: .87; } +.card-image { + aspect-ratio: 5/7; + object-fit: cover; +} + .sticky { background-color: hsl(195, 4%, 22%); position: sticky; @@ -13,14 +18,15 @@ } .rarity-icon svg { - height: .9rem; - line-height: .9rem; + height: 1rem; + line-height: 1rem; display: inline-block; } .price-label { color: hsl(122, 39%, 49%); font-size: 0.825rem; + font-weight: 600; } .price-label:nth-of-type(n+2) { diff --git a/src/components/RarityIcon.astro b/src/components/RarityIcon.astro index 63cb976..df4b036 100644 --- a/src/components/RarityIcon.astro +++ b/src/components/RarityIcon.astro @@ -11,6 +11,9 @@ import doubleRare from "/src/svg/rarity/double_rare.svg?raw"; import promo from "/src/svg/rarity/promo.svg?raw"; import specialIllusRare from "/src/svg/rarity/special_illustration_rare.svg?raw"; import ultrarare from "/src/svg/rarity/rare_ultra.svg?raw"; +import secretrare from "/src/svg/rarity/rare_secret.svg?raw"; +import blackwhiterare from "/src/svg/rarity/black_white_rare.svg?raw"; +import raresecret from "/src/svg/rarity/rare_secret.svg?raw"; const { rarity } = Astro.props; @@ -27,6 +30,9 @@ const rarityMap = { "Promo": promo, "Special Illustration Rare": specialIllusRare, "Ultra Rare": ultrarare, + "Secret Rare": secretrare, + "Black White Rare": blackwhiterare, + "Shiny Holo Rare": raresecret, }; const svg = rarityMap[rarity as keyof typeof rarityMap] ?? ""; diff --git a/src/svg/rarity/promo.svg b/src/svg/rarity/promo.svg index 5ef7c1d..f29cb67 100644 --- a/src/svg/rarity/promo.svg +++ b/src/svg/rarity/promo.svg @@ -1,4 +1,4 @@ - +