diff options
Diffstat (limited to 'frontend/src/components/GameEntry.tsx')
| -rw-r--r-- | frontend/src/components/GameEntry.tsx | 27 |
1 files changed, 14 insertions, 13 deletions
diff --git a/frontend/src/components/GameEntry.tsx b/frontend/src/components/GameEntry.tsx index 04c3483..f8fd179 100644 --- a/frontend/src/components/GameEntry.tsx +++ b/frontend/src/components/GameEntry.tsx | |||
| @@ -2,7 +2,6 @@ import React from "react"; | |||
| 2 | import { Link } from "react-router-dom"; | 2 | import { Link } from "react-router-dom"; |
| 3 | 3 | ||
| 4 | import { Game, GameCategoryPortals } from "@customTypes/Game"; | 4 | import { Game, GameCategoryPortals } from "@customTypes/Game"; |
| 5 | import "@css/Games.css"; | ||
| 6 | 5 | ||
| 7 | import GameCategory from "@components/GameCategory"; | 6 | import GameCategory from "@components/GameCategory"; |
| 8 | 7 | ||
| @@ -18,23 +17,25 @@ const GameEntry: React.FC<GameEntryProps> = ({ game }) => { | |||
| 18 | }, [game.category_portals]); | 17 | }, [game.category_portals]); |
| 19 | 18 | ||
| 20 | return ( | 19 | return ( |
| 21 | <Link to={"/games/" + game.id}> | 20 | <Link to={"/games/" + game.id} className="w-full"> |
| 22 | <div className="games-page-item"> | 21 | <div className="w-full h-64 bg-mantle rounded-3xl overflow-hidden my-6"> |
| 23 | <div className="games-page-item-header"> | 22 | <div className="w-full h-1/2 bg-cover overflow-hidden relative"> |
| 24 | <div | 23 | <div |
| 25 | style={{ backgroundImage: `url(${game.image})` }} | 24 | style={{ backgroundImage: `url(${game.image})` }} |
| 26 | className="games-page-item-header-img" | 25 | className="w-full h-full backdrop-blur-sm blur-sm bg-cover" |
| 27 | ></div> | 26 | ></div> |
| 28 | <span> | 27 | <span className="absolute inset-0 flex justify-center items-center"> |
| 29 | <b>{game.name}</b> | 28 | <b className="text-[56px] font-[--font-barlow-condensed-bold] text-white">{game.name}</b> |
| 30 | </span> | 29 | </span> |
| 31 | </div> | 30 | </div> |
| 32 | <div id={game.id as any as string} className="games-page-item-body"> | 31 | <div className="flex justify-center items-center h-1/2"> |
| 33 | {catInfo.map((cat, index) => { | 32 | <div className="flex flex-row justify-between w-full"> |
| 34 | return ( | 33 | {catInfo.map((cat, index) => { |
| 35 | <GameCategory cat={cat} game={game} key={index}></GameCategory> | 34 | return ( |
| 36 | ); | 35 | <GameCategory key={index} cat={cat} game={game} /> |
| 37 | })} | 36 | ); |
| 37 | })} | ||
| 38 | </div> | ||
| 38 | </div> | 39 | </div> |
| 39 | </div> | 40 | </div> |
| 40 | </Link> | 41 | </Link> |