diff --git a/src/components/game/GameCard.tsx b/src/components/game/GameCard.tsx
index 1d3adc7..68df8f2 100644
--- a/src/components/game/GameCard.tsx
+++ b/src/components/game/GameCard.tsx
@@ -1,18 +1,11 @@
import { type GameCard as GameCardType } from "@/types/game";
-import {
- Sparkles,
- Zap,
- Star,
- Circle,
- Coins,
- Trophy,
- RefreshCw,
- Sword,
- Leaf,
- LucideIcon,
-} from "lucide-react";
-import { formatNumber } from "@/lib/utils";
import { resolveCardStats } from "@/store/gameStore";
+import { RARITY_STYLES, getPrimaryType } from "@/config/rarityConfig";
+import { CardImage } from "./card-parts/CardImage";
+import { CardStatusBadge } from "./card-parts/CardStatusBadge";
+import { CardStats } from "./card-parts/CardStats";
+import { CardTypes } from "./card-parts/CardTypes";
+import { CardRarityOverlay } from "./card-parts/CardRarityOverlay";
interface GameCardProps {
card: GameCardType;
@@ -20,82 +13,14 @@ interface GameCardProps {
isActive?: boolean;
}
-type RarityOrType =
- | "COMMON"
- | "NORMAL"
- | "RARE"
- | "HOLO"
- | "FULL_ART"
- | "SILVER"
- | "GOLD"
- | "REVERT"
- | "SWORD";
-
-const typeIcons = {
- COMMON: Circle,
- NORMAL: Circle,
- RARE: Star,
- HOLO: Sparkles,
- FULL_ART: Zap,
- SILVER: Coins,
- GOLD: Trophy,
- REVERT: RefreshCw,
- SWORD: Sword,
-} satisfies Record;
-
-const rarityConfig = {
- COMMON: { border: "border-border", bg: "bg-card" },
- NORMAL: { border: "border-border", bg: "bg-card" },
- RARE: { border: "border-blue-400/60 animate-rare-pulse", bg: "bg-card" },
- HOLO: { border: "border-rarity-holo", bg: "bg-card" },
- FULL_ART: { border: "border-rarity-fullart", bg: "bg-card" },
- SILVER: { border: "border-slate-300", bg: "bg-slate-900/40" },
- GOLD: { border: "border-yellow-500", bg: "bg-yellow-900/20" },
- REVERT: { border: "border-red-500", bg: "bg-black" },
-} satisfies Record;
-
export function GameCard({ card, onClick, isActive }: GameCardProps) {
const stats = resolveCardStats(card);
const { character, income, power } = stats;
const types = card.types || [];
- const isHolo = types.includes("HOLO");
const isFullArt = types.includes("FULL_ART");
- const isGold = types.includes("GOLD");
- const isSilver = types.includes("SILVER");
- const isRevert = types.includes("REVERT");
-
- const primaryType = types.includes("REVERT")
- ? "REVERT"
- : types.includes("GOLD")
- ? "GOLD"
- : types.includes("SILVER")
- ? "SILVER"
- : types.includes("FULL_ART")
- ? "FULL_ART"
- : types.includes("HOLO")
- ? "HOLO"
- : types.includes("RARE")
- ? "RARE"
- : types.includes("NORMAL")
- ? "NORMAL"
- : "COMMON";
-
- const config = rarityConfig[primaryType] || rarityConfig.COMMON;
-
- let imgSrc = `https://rickandmortyapi.com/api/character/avatar/${character.avatarId}.jpeg`;
-
- if (character.customImage) {
- imgSrc = character.customImage;
- }
-
- const imageFilter = isRevert
- ? "invert(1) hue-rotate(180deg)"
- : isGold
- ? "sepia(1) saturate(5) brightness(0.8) hue-rotate(-15deg)"
- : isSilver
- ? "grayscale(1) brightness(1.2) contrast(1.1)"
- : "";
+ const primaryType = getPrimaryType(types);
+ const config = RARITY_STYLES[primaryType] || RARITY_STYLES.COMMON;
return (
-
- {types.map((tId) => {
- const Icon = typeIcons[tId];
- if (!Icon) return null;
- return (
-
- );
- })}
-
-
-
-
-
- {formatNumber(income)}/s
-
-
-
-
-
- {formatNumber(power)}
-
-
-
+
+
diff --git a/src/components/game/card-parts/CardImage.tsx b/src/components/game/card-parts/CardImage.tsx
new file mode 100644
index 0000000..f3220ba
--- /dev/null
+++ b/src/components/game/card-parts/CardImage.tsx
@@ -0,0 +1,39 @@
+import { getCardImageFilter } from "@/lib/utils";
+import { Character } from "@/types/game";
+
+interface CardImageProps {
+ character: Character;
+ types: string[];
+ isFullArt: boolean;
+}
+
+export function CardImage({ character, types, isFullArt }: CardImageProps) {
+ const imageFilter = getCardImageFilter(types);
+ let imgSrc = `https://rickandmortyapi.com/api/character/avatar/${character.avatarId}.jpeg`;
+
+ if (character.customImage) {
+ imgSrc = character.customImage;
+ }
+
+ if (isFullArt) {
+ return (
+
+ );
+ }
+
+ return (
+
+

+
+ );
+}
diff --git a/src/components/game/card-parts/CardRarityOverlay.tsx b/src/components/game/card-parts/CardRarityOverlay.tsx
new file mode 100644
index 0000000..e76a122
--- /dev/null
+++ b/src/components/game/card-parts/CardRarityOverlay.tsx
@@ -0,0 +1,19 @@
+interface CardRarityOverlayProps {
+ types: string[];
+}
+
+export function CardRarityOverlay({ types }: CardRarityOverlayProps) {
+ const isHolo = types.includes("HOLO");
+ const isGold = types.includes("GOLD");
+
+ return (
+ <>
+ {isHolo && (
+
+ )}
+ {isGold && (
+
+ )}
+ >
+ );
+}
diff --git a/src/components/game/card-parts/CardStats.tsx b/src/components/game/card-parts/CardStats.tsx
new file mode 100644
index 0000000..d41f73f
--- /dev/null
+++ b/src/components/game/card-parts/CardStats.tsx
@@ -0,0 +1,26 @@
+import { Leaf, Sword } from "lucide-react";
+import { formatNumber } from "@/lib/utils";
+
+interface CardStatsProps {
+ income: number;
+ power: number;
+}
+
+export function CardStats({ income, power }: CardStatsProps) {
+ return (
+
+
+
+
+ {formatNumber(income)}/s
+
+
+
+
+
+ {formatNumber(power)}
+
+
+
+ );
+}
diff --git a/src/components/game/card-parts/CardStatusBadge.tsx b/src/components/game/card-parts/CardStatusBadge.tsx
new file mode 100644
index 0000000..122e64b
--- /dev/null
+++ b/src/components/game/card-parts/CardStatusBadge.tsx
@@ -0,0 +1,19 @@
+interface CardStatusBadgeProps {
+ status: string;
+}
+
+export function CardStatusBadge({ status }: CardStatusBadgeProps) {
+ const statusStyles = {
+ Alive: "bg-green-500/20 text-green-400 border border-green-500/40",
+ Dead: "bg-red-500/20 text-red-400 border border-red-500/40",
+ unknown: "bg-gray-500/20 text-gray-400 border border-gray-500/40",
+ }[status] || "bg-gray-500/20 text-gray-400 border border-gray-500/40";
+
+ return (
+
+ {status}
+
+ );
+}
diff --git a/src/components/game/card-parts/CardTypes.tsx b/src/components/game/card-parts/CardTypes.tsx
new file mode 100644
index 0000000..0b8f0e4
--- /dev/null
+++ b/src/components/game/card-parts/CardTypes.tsx
@@ -0,0 +1,19 @@
+import { TYPE_ICONS } from "@/config/rarityConfig";
+
+interface CardTypesProps {
+ types: string[];
+}
+
+export function CardTypes({ types }: CardTypesProps) {
+ return (
+
+ {types.map((tId) => {
+ const Icon = TYPE_ICONS[tId];
+ if (!Icon) return null;
+ return (
+
+ );
+ })}
+
+ );
+}
diff --git a/src/config/rarityConfig.ts b/src/config/rarityConfig.ts
new file mode 100644
index 0000000..851bbac
--- /dev/null
+++ b/src/config/rarityConfig.ts
@@ -0,0 +1,56 @@
+import {
+ Sparkles,
+ Zap,
+ Star,
+ Circle,
+ Coins,
+ Trophy,
+ RefreshCw,
+ Sword,
+ LucideIcon,
+} from "lucide-react";
+
+export type RarityOrType =
+ | "COMMON"
+ | "NORMAL"
+ | "RARE"
+ | "HOLO"
+ | "FULL_ART"
+ | "SILVER"
+ | "GOLD"
+ | "REVERT"
+ | "SWORD";
+
+export const TYPE_ICONS: Record = {
+ COMMON: Circle,
+ NORMAL: Circle,
+ RARE: Star,
+ HOLO: Sparkles,
+ FULL_ART: Zap,
+ SILVER: Coins,
+ GOLD: Trophy,
+ REVERT: RefreshCw,
+ SWORD: Sword,
+};
+
+export const RARITY_STYLES: Record = {
+ COMMON: { border: "border-border", bg: "bg-card" },
+ NORMAL: { border: "border-border", bg: "bg-card" },
+ RARE: { border: "border-blue-400/60 animate-rare-pulse", bg: "bg-card" },
+ HOLO: { border: "border-rarity-holo", bg: "bg-card" },
+ FULL_ART: { border: "border-rarity-fullart", bg: "bg-card" },
+ SILVER: { border: "border-slate-300", bg: "bg-slate-900/40" },
+ GOLD: { border: "border-yellow-500", bg: "bg-yellow-900/20" },
+ REVERT: { border: "border-red-500", bg: "bg-black" },
+};
+
+export function getPrimaryType(types: string[]): string {
+ if (types.includes("REVERT")) return "REVERT";
+ if (types.includes("GOLD")) return "GOLD";
+ if (types.includes("SILVER")) return "SILVER";
+ if (types.includes("FULL_ART")) return "FULL_ART";
+ if (types.includes("HOLO")) return "HOLO";
+ if (types.includes("RARE")) return "RARE";
+ if (types.includes("NORMAL")) return "NORMAL";
+ return "COMMON";
+}
diff --git a/src/data/characters.json b/src/data/characters.json
index 766bee5..947c3e1 100644
--- a/src/data/characters.json
+++ b/src/data/characters.json
@@ -244,6 +244,7 @@
"origin": "unknown",
"location": "unknown",
"customImage": "https://static.wikia.nocookie.net/rickandmorty/images/4/49/Antenna_Rick.png/revision/latest?cb=20161121231006",
+ "avatarId": 19,
"baseMultiplier": 450,
"basePower": 350
},
@@ -259,5 +260,265 @@
"avatarId": 20,
"baseMultiplier": 120,
"basePower": 10
+ },
+ {
+ "id": 21,
+ "name": "Aqua Morty",
+ "status": "unknown",
+ "species": "Humanoid",
+ "type": "Fish-Person",
+ "gender": "Male",
+ "origin": "unknown",
+ "location": "Citadel of Ricks",
+ "avatarId": 21,
+ "baseMultiplier": 40,
+ "basePower": 110
+ },
+ {
+ "id": 22,
+ "name": "Aqua Rick",
+ "status": "unknown",
+ "species": "Humanoid",
+ "type": "Fish-Person",
+ "gender": "Male",
+ "origin": "unknown",
+ "location": "Citadel of Ricks",
+ "avatarId": 22,
+ "baseMultiplier": 600,
+ "basePower": 450
+ },
+ {
+ "id": 23,
+ "name": "Arcade Alien",
+ "status": "unknown",
+ "species": "Alien",
+ "type": "",
+ "gender": "Male",
+ "origin": "unknown",
+ "location": "Immortality Field Resort",
+ "avatarId": 23,
+ "baseMultiplier": 120,
+ "basePower": 50
+ },
+ {
+ "id": 24,
+ "name": "Armagheadon",
+ "status": "Alive",
+ "species": "Alien",
+ "type": "Cromulon",
+ "gender": "Male",
+ "origin": "Signus 5 Expanse",
+ "location": "Signus 5 Expanse",
+ "avatarId": 24,
+ "baseMultiplier": 2000,
+ "basePower": 10
+ },
+ {
+ "id": 25,
+ "name": "Armothy",
+ "status": "Dead",
+ "species": "unknown",
+ "type": "Self-aware arm",
+ "gender": "Male",
+ "origin": "Post-Apocalyptic Earth",
+ "location": "Post-Apocalyptic Earth",
+ "avatarId": 25,
+ "baseMultiplier": 80,
+ "basePower": 250
+ },
+ {
+ "id": 26,
+ "name": "Arthricia",
+ "status": "Alive",
+ "species": "Alien",
+ "type": "Cat-Person",
+ "gender": "Female",
+ "origin": "Purge Planet",
+ "location": "Purge Planet",
+ "avatarId": 26,
+ "baseMultiplier": 90,
+ "basePower": 180
+ },
+ {
+ "id": 27,
+ "name": "Artist Morty",
+ "status": "Alive",
+ "species": "Human",
+ "type": "",
+ "gender": "Male",
+ "origin": "unknown",
+ "location": "Citadel of Ricks",
+ "avatarId": 27,
+ "baseMultiplier": 50,
+ "basePower": 95
+ },
+ {
+ "id": 28,
+ "name": "Attila Starwar",
+ "status": "Alive",
+ "species": "Human",
+ "type": "",
+ "gender": "Male",
+ "origin": "unknown",
+ "location": "Interdimensional Cable",
+ "avatarId": 28,
+ "baseMultiplier": 150,
+ "basePower": 300
+ },
+ {
+ "id": 29,
+ "name": "Baby Legs",
+ "status": "Alive",
+ "species": "Human",
+ "type": "Human with baby legs",
+ "gender": "Male",
+ "origin": "unknown",
+ "location": "Interdimensional Cable",
+ "avatarId": 29,
+ "baseMultiplier": 100,
+ "basePower": 40
+ },
+ {
+ "id": 30,
+ "name": "Baby Poopybutthole",
+ "status": "Alive",
+ "species": "Poopybutthole",
+ "type": "",
+ "gender": "Male",
+ "origin": "unknown",
+ "location": "unknown",
+ "avatarId": 30,
+ "baseMultiplier": 250,
+ "basePower": 50
+ },
+ {
+ "id": 31,
+ "name": "Baby Wizard",
+ "status": "Dead",
+ "species": "Alien",
+ "type": "Parasite",
+ "gender": "Male",
+ "origin": "unknown",
+ "location": "Earth (Replacement Dimension)",
+ "avatarId": 31,
+ "baseMultiplier": 300,
+ "basePower": 150
+ },
+ {
+ "id": 32,
+ "name": "Bearded Lady",
+ "status": "Dead",
+ "species": "Alien",
+ "type": "Parasite",
+ "gender": "Female",
+ "origin": "unknown",
+ "location": "Earth (Replacement Dimension)",
+ "avatarId": 32,
+ "baseMultiplier": 75,
+ "basePower": 45
+ },
+ {
+ "id": 33,
+ "name": "Beebo",
+ "status": "Dead",
+ "species": "Alien",
+ "type": "",
+ "gender": "Male",
+ "origin": "Venzenulon 7",
+ "location": "Venzenulon 7",
+ "avatarId": 33,
+ "baseMultiplier": 40,
+ "basePower": 20
+ },
+ {
+ "id": 34,
+ "name": "Benjamin",
+ "status": "Alive",
+ "species": "Poopybutthole",
+ "type": "",
+ "gender": "Male",
+ "origin": "unknown",
+ "location": "Interdimensional Cable",
+ "avatarId": 34,
+ "baseMultiplier": 120,
+ "basePower": 60
+ },
+ {
+ "id": 35,
+ "name": "Bepisian",
+ "status": "Alive",
+ "species": "Alien",
+ "type": "Bepisian",
+ "gender": "unknown",
+ "origin": "Bepis 9",
+ "location": "Bepis 9",
+ "avatarId": 35,
+ "baseMultiplier": 85,
+ "basePower": 35
+ },
+ {
+ "id": 36,
+ "name": "Beta-Seven",
+ "status": "Alive",
+ "species": "Alien",
+ "type": "Hivemind",
+ "gender": "unknown",
+ "origin": "unknown",
+ "location": "unknown",
+ "avatarId": 36,
+ "baseMultiplier": 1500,
+ "basePower": 200
+ },
+ {
+ "id": 37,
+ "name": "Beth Sanchez",
+ "status": "Alive",
+ "species": "Human",
+ "type": "",
+ "gender": "Female",
+ "origin": "Earth (C-500A)",
+ "location": "Earth (C-500A)",
+ "avatarId": 37,
+ "baseMultiplier": 55,
+ "basePower": 20
+ },
+ {
+ "id": 38,
+ "name": "Beth Smith",
+ "status": "Alive",
+ "species": "Human",
+ "type": "",
+ "gender": "Female",
+ "origin": "Earth (C-137)",
+ "location": "Earth (C-137)",
+ "avatarId": 38,
+ "baseMultiplier": 50,
+ "basePower": 15
+ },
+ {
+ "id": 39,
+ "name": "Beth Smith",
+ "status": "Alive",
+ "species": "Human",
+ "type": "",
+ "gender": "Female",
+ "origin": "Earth (Evil Rick's Target Dimension)",
+ "location": "Earth (Evil Rick's Target Dimension)",
+ "avatarId": 39,
+ "baseMultiplier": 50,
+ "basePower": 15
+ },
+ {
+ "id": 40,
+ "name": "Beth's Mytholog",
+ "status": "Dead",
+ "species": "Mythological Creature",
+ "type": "Mytholog",
+ "gender": "Female",
+ "origin": "Nuptia 4",
+ "location": "Nuptia 4",
+ "avatarId": 40,
+ "baseMultiplier": 400,
+ "basePower": 250
}
]
diff --git a/src/data/rickandmortyapi.json b/src/data/rickandmortyapi.json
index e6a4499..abfd831 100644
--- a/src/data/rickandmortyapi.json
+++ b/src/data/rickandmortyapi.json
@@ -5,405 +5,5 @@
"next": "https://rickandmortyapi.com/api/character?page=3",
"prev": "https://rickandmortyapi.com/api/character?page=1"
},
- "results": [
- {
- "id": 21,
- "name": "Aqua Morty",
- "status": "unknown",
- "species": "Humanoid",
- "type": "Fish-Person",
- "gender": "Male",
- "origin": { "name": "unknown", "url": "" },
- "location": {
- "name": "Citadel of Ricks",
- "url": "https://rickandmortyapi.com/api/location/3"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/21.jpeg",
- "episode": [
- "https://rickandmortyapi.com/api/episode/10",
- "https://rickandmortyapi.com/api/episode/22"
- ],
- "url": "https://rickandmortyapi.com/api/character/21",
- "created": "2017-11-04T22:39:48.055Z"
- },
- {
- "id": 22,
- "name": "Aqua Rick",
- "status": "unknown",
- "species": "Humanoid",
- "type": "Fish-Person",
- "gender": "Male",
- "origin": { "name": "unknown", "url": "" },
- "location": {
- "name": "Citadel of Ricks",
- "url": "https://rickandmortyapi.com/api/location/3"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/22.jpeg",
- "episode": [
- "https://rickandmortyapi.com/api/episode/10",
- "https://rickandmortyapi.com/api/episode/22",
- "https://rickandmortyapi.com/api/episode/28"
- ],
- "url": "https://rickandmortyapi.com/api/character/22",
- "created": "2017-11-04T22:41:07.171Z"
- },
- {
- "id": 23,
- "name": "Arcade Alien",
- "status": "unknown",
- "species": "Alien",
- "type": "",
- "gender": "Male",
- "origin": { "name": "unknown", "url": "" },
- "location": {
- "name": "Immortality Field Resort",
- "url": "https://rickandmortyapi.com/api/location/7"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/23.jpeg",
- "episode": [
- "https://rickandmortyapi.com/api/episode/13",
- "https://rickandmortyapi.com/api/episode/19",
- "https://rickandmortyapi.com/api/episode/21",
- "https://rickandmortyapi.com/api/episode/25",
- "https://rickandmortyapi.com/api/episode/26"
- ],
- "url": "https://rickandmortyapi.com/api/character/23",
- "created": "2017-11-05T08:43:05.095Z"
- },
- {
- "id": 24,
- "name": "Armagheadon",
- "status": "Alive",
- "species": "Alien",
- "type": "Cromulon",
- "gender": "Male",
- "origin": {
- "name": "Signus 5 Expanse",
- "url": "https://rickandmortyapi.com/api/location/22"
- },
- "location": {
- "name": "Signus 5 Expanse",
- "url": "https://rickandmortyapi.com/api/location/22"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/24.jpeg",
- "episode": ["https://rickandmortyapi.com/api/episode/16"],
- "url": "https://rickandmortyapi.com/api/character/24",
- "created": "2017-11-05T08:48:30.776Z"
- },
- {
- "id": 25,
- "name": "Armothy",
- "status": "Dead",
- "species": "unknown",
- "type": "Self-aware arm",
- "gender": "Male",
- "origin": {
- "name": "Post-Apocalyptic Earth",
- "url": "https://rickandmortyapi.com/api/location/8"
- },
- "location": {
- "name": "Post-Apocalyptic Earth",
- "url": "https://rickandmortyapi.com/api/location/8"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/25.jpeg",
- "episode": ["https://rickandmortyapi.com/api/episode/23"],
- "url": "https://rickandmortyapi.com/api/character/25",
- "created": "2017-11-05T08:54:29.343Z"
- },
- {
- "id": 26,
- "name": "Arthricia",
- "status": "Alive",
- "species": "Alien",
- "type": "Cat-Person",
- "gender": "Female",
- "origin": {
- "name": "Purge Planet",
- "url": "https://rickandmortyapi.com/api/location/9"
- },
- "location": {
- "name": "Purge Planet",
- "url": "https://rickandmortyapi.com/api/location/9"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/26.jpeg",
- "episode": ["https://rickandmortyapi.com/api/episode/20"],
- "url": "https://rickandmortyapi.com/api/character/26",
- "created": "2017-11-05T08:56:46.165Z"
- },
- {
- "id": 27,
- "name": "Artist Morty",
- "status": "Alive",
- "species": "Human",
- "type": "",
- "gender": "Male",
- "origin": { "name": "unknown", "url": "" },
- "location": {
- "name": "Citadel of Ricks",
- "url": "https://rickandmortyapi.com/api/location/3"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/27.jpeg",
- "episode": [
- "https://rickandmortyapi.com/api/episode/10",
- "https://rickandmortyapi.com/api/episode/28"
- ],
- "url": "https://rickandmortyapi.com/api/character/27",
- "created": "2017-11-05T08:59:07.457Z"
- },
- {
- "id": 28,
- "name": "Attila Starwar",
- "status": "Alive",
- "species": "Human",
- "type": "",
- "gender": "Male",
- "origin": { "name": "unknown", "url": "" },
- "location": {
- "name": "Interdimensional Cable",
- "url": "https://rickandmortyapi.com/api/location/6"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/28.jpeg",
- "episode": [
- "https://rickandmortyapi.com/api/episode/8",
- "https://rickandmortyapi.com/api/episode/13",
- "https://rickandmortyapi.com/api/episode/17"
- ],
- "url": "https://rickandmortyapi.com/api/character/28",
- "created": "2017-11-05T09:02:16.595Z"
- },
- {
- "id": 29,
- "name": "Baby Legs",
- "status": "Alive",
- "species": "Human",
- "type": "Human with baby legs",
- "gender": "Male",
- "origin": { "name": "unknown", "url": "" },
- "location": {
- "name": "Interdimensional Cable",
- "url": "https://rickandmortyapi.com/api/location/6"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/29.jpeg",
- "episode": ["https://rickandmortyapi.com/api/episode/8"],
- "url": "https://rickandmortyapi.com/api/character/29",
- "created": "2017-11-05T09:06:19.644Z"
- },
- {
- "id": 30,
- "name": "Baby Poopybutthole",
- "status": "Alive",
- "species": "Poopybutthole",
- "type": "",
- "gender": "Male",
- "origin": { "name": "unknown", "url": "" },
- "location": { "name": "unknown", "url": "" },
- "image": "https://rickandmortyapi.com/api/character/avatar/30.jpeg",
- "episode": ["https://rickandmortyapi.com/api/episode/31"],
- "url": "https://rickandmortyapi.com/api/character/30",
- "created": "2017-11-05T09:13:16.483Z"
- },
- {
- "id": 31,
- "name": "Baby Wizard",
- "status": "Dead",
- "species": "Alien",
- "type": "Parasite",
- "gender": "Male",
- "origin": { "name": "unknown", "url": "" },
- "location": {
- "name": "Earth (Replacement Dimension)",
- "url": "https://rickandmortyapi.com/api/location/20"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/31.jpeg",
- "episode": ["https://rickandmortyapi.com/api/episode/15"],
- "url": "https://rickandmortyapi.com/api/character/31",
- "created": "2017-11-05T09:15:11.286Z"
- },
- {
- "id": 32,
- "name": "Bearded Lady",
- "status": "Dead",
- "species": "Alien",
- "type": "Parasite",
- "gender": "Female",
- "origin": { "name": "unknown", "url": "" },
- "location": {
- "name": "Earth (Replacement Dimension)",
- "url": "https://rickandmortyapi.com/api/location/20"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/32.jpeg",
- "episode": ["https://rickandmortyapi.com/api/episode/15"],
- "url": "https://rickandmortyapi.com/api/character/32",
- "created": "2017-11-05T09:18:04.184Z"
- },
- {
- "id": 33,
- "name": "Beebo",
- "status": "Dead",
- "species": "Alien",
- "type": "",
- "gender": "Male",
- "origin": {
- "name": "Venzenulon 7",
- "url": "https://rickandmortyapi.com/api/location/10"
- },
- "location": {
- "name": "Venzenulon 7",
- "url": "https://rickandmortyapi.com/api/location/10"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/33.jpeg",
- "episode": ["https://rickandmortyapi.com/api/episode/29"],
- "url": "https://rickandmortyapi.com/api/character/33",
- "created": "2017-11-05T09:21:55.595Z"
- },
- {
- "id": 34,
- "name": "Benjamin",
- "status": "Alive",
- "species": "Poopybutthole",
- "type": "",
- "gender": "Male",
- "origin": { "name": "unknown", "url": "" },
- "location": {
- "name": "Interdimensional Cable",
- "url": "https://rickandmortyapi.com/api/location/6"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/34.jpeg",
- "episode": [
- "https://rickandmortyapi.com/api/episode/8",
- "https://rickandmortyapi.com/api/episode/13",
- "https://rickandmortyapi.com/api/episode/17"
- ],
- "url": "https://rickandmortyapi.com/api/character/34",
- "created": "2017-11-05T09:24:04.748Z"
- },
- {
- "id": 35,
- "name": "Bepisian",
- "status": "Alive",
- "species": "Alien",
- "type": "Bepisian",
- "gender": "unknown",
- "origin": {
- "name": "Bepis 9",
- "url": "https://rickandmortyapi.com/api/location/11"
- },
- "location": {
- "name": "Bepis 9",
- "url": "https://rickandmortyapi.com/api/location/11"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/35.jpeg",
- "episode": [
- "https://rickandmortyapi.com/api/episode/1",
- "https://rickandmortyapi.com/api/episode/11",
- "https://rickandmortyapi.com/api/episode/19",
- "https://rickandmortyapi.com/api/episode/25"
- ],
- "url": "https://rickandmortyapi.com/api/character/35",
- "created": "2017-11-05T09:27:38.491Z"
- },
- {
- "id": 36,
- "name": "Beta-Seven",
- "status": "Alive",
- "species": "Alien",
- "type": "Hivemind",
- "gender": "unknown",
- "origin": { "name": "unknown", "url": "" },
- "location": { "name": "unknown", "url": "" },
- "image": "https://rickandmortyapi.com/api/character/avatar/36.jpeg",
- "episode": ["https://rickandmortyapi.com/api/episode/14"],
- "url": "https://rickandmortyapi.com/api/character/36",
- "created": "2017-11-05T09:31:08.952Z"
- },
- {
- "id": 37,
- "name": "Beth Sanchez",
- "status": "Alive",
- "species": "Human",
- "type": "",
- "gender": "Female",
- "origin": {
- "name": "Earth (C-500A)",
- "url": "https://rickandmortyapi.com/api/location/23"
- },
- "location": {
- "name": "Earth (C-500A)",
- "url": "https://rickandmortyapi.com/api/location/23"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/37.jpeg",
- "episode": ["https://rickandmortyapi.com/api/episode/8"],
- "url": "https://rickandmortyapi.com/api/character/37",
- "created": "2017-11-05T09:38:22.960Z"
- },
- {
- "id": 38,
- "name": "Beth Smith",
- "status": "Alive",
- "species": "Human",
- "type": "",
- "gender": "Female",
- "origin": {
- "name": "Earth (C-137)",
- "url": "https://rickandmortyapi.com/api/location/1"
- },
- "location": {
- "name": "Earth (C-137)",
- "url": "https://rickandmortyapi.com/api/location/1"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/38.jpeg",
- "episode": [
- "https://rickandmortyapi.com/api/episode/1",
- "https://rickandmortyapi.com/api/episode/2",
- "https://rickandmortyapi.com/api/episode/3",
- "https://rickandmortyapi.com/api/episode/4",
- "https://rickandmortyapi.com/api/episode/5",
- "https://rickandmortyapi.com/api/episode/6",
- "https://rickandmortyapi.com/api/episode/22",
- "https://rickandmortyapi.com/api/episode/51"
- ],
- "url": "https://rickandmortyapi.com/api/character/38",
- "created": "2017-11-05T09:48:44.230Z"
- },
- {
- "id": 39,
- "name": "Beth Smith",
- "status": "Alive",
- "species": "Human",
- "type": "",
- "gender": "Female",
- "origin": {
- "name": "Earth (Evil Rick's Target Dimension)",
- "url": "https://rickandmortyapi.com/api/location/34"
- },
- "location": {
- "name": "Earth (Evil Rick's Target Dimension)",
- "url": "https://rickandmortyapi.com/api/location/34"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/39.jpeg",
- "episode": ["https://rickandmortyapi.com/api/episode/10"],
- "url": "https://rickandmortyapi.com/api/character/39",
- "created": "2017-11-05T09:52:31.777Z"
- },
- {
- "id": 40,
- "name": "Beth's Mytholog",
- "status": "Dead",
- "species": "Mythological Creature",
- "type": "Mytholog",
- "gender": "Female",
- "origin": {
- "name": "Nuptia 4",
- "url": "https://rickandmortyapi.com/api/location/13"
- },
- "location": {
- "name": "Nuptia 4",
- "url": "https://rickandmortyapi.com/api/location/13"
- },
- "image": "https://rickandmortyapi.com/api/character/avatar/40.jpeg",
- "episode": ["https://rickandmortyapi.com/api/episode/18"],
- "url": "https://rickandmortyapi.com/api/character/40",
- "created": "2017-11-05T10:02:26.701Z"
- }
- ]
+ "results": []
}
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
index 4dade0f..023e999 100644
--- a/src/lib/utils.ts
+++ b/src/lib/utils.ts
@@ -33,6 +33,21 @@ export function formatNumber(num: number, decimals: number = 1): string {
: num.toFixed(decimals);
}
+/**
+ * Returns the CSS filter string for a card based on its types.
+ */
+export function getCardImageFilter(types: string[]): string {
+ const isRevert = types.includes("REVERT");
+ const isGold = types.includes("GOLD");
+ const isSilver = types.includes("SILVER");
+
+ if (isRevert) return "invert(1) hue-rotate(180deg)";
+ if (isGold) return "sepia(1) saturate(5) brightness(0.8) hue-rotate(-15deg)";
+ if (isSilver) return "grayscale(1) brightness(1.2) contrast(1.1)";
+
+ return "";
+}
+
/**
* Specifically for Mega Seeds and game currencies
*/