globuzma/brawlset
1
0
Fork 0
Code Issues Pull requests Projects 2 Releases Packages 1 Wiki Activity

Fix: Last UI Fixes + better create JSON

Browse source
This commit is contained in:
zuma 2025-02-12 20:05:02 +01:00
parent 0ea1d4a3e4
commit 29411757cb
12 changed files with 54 additions and 53 deletions
Download patch file Download diff file Expand all files Collapse all files

19
app/components/ui/card-group.tsx
View file

@ -17,16 +17,17 @@ interface carte_from_stats {
}
interface CardGroupProps {
className?: string,
groupName: string,
cards: carte_from_stats[],
showPrice?: boolean,
showStats?: boolean,
id?: string,
Icon?: any
className?: string,
groupName: string,
cards: carte_from_stats[],
showPrice?: boolean,
showStats?: boolean,
showPercent?: boolean,
id?: string,
Icon?: any
}
const CardGroup = ({ className, groupName, cards, showPrice=true, showStats=true, id, Icon}: CardGroupProps) => {
const CardGroup = ({ className, groupName, cards, showPrice=true, showStats=true,showPercent=true, id, Icon}: CardGroupProps) => {
return (
<div id={id} className={cn('flex flex-col w-full items-start',className)}>
<div className="flex items-center flex-row gap-2 mb-2">
@ -40,7 +41,7 @@ const CardGroup = ({ className, groupName, cards, showPrice=true, showStats=true
>
{cards.map((card: carte_from_stats) => (
<MTGCard key={card.id} cardname={card.name} imageURI={card.normal_image} url={"/card/" + card.sanitized_name} nbrDecks={card.nbr_decks} totalDecks={card.total_decks} percentDecks={card.percent_decks} price={card.price} cardmarketURI={card.cardmarket_uri}/>
<MTGCard key={card.id} cardname={card.name} imageURI={card.normal_image} url={"/card/" + card.sanitized_name} nbrDecks={card.nbr_decks} totalDecks={card.total_decks} percentDecks={showPercent ? card.percent_decks : undefined} price={card.price} cardmarketURI={card.cardmarket_uri}/>
))}
</div>
</div>

8
app/components/ui/mtg-card.tsx
View file

@ -19,8 +19,7 @@ const MTGCard = ({ className, imageURI, cardname, url, nbrDecks, totalDecks, per
const [loaded, setLoaded] = React.useState(false)
return (
<a
href={url}
<div
className={cn(
"flex flex-col w-48",
className
@ -39,11 +38,12 @@ const MTGCard = ({ className, imageURI, cardname, url, nbrDecks, totalDecks, per
<span className="text-center text-xs">{cardname}</span>
{ nbrDecks != undefined && (
<>
<span className="text-md">{nbrDecks} Deck{nbrDecks > 1 ? "s" : ""} sur {totalDecks} ({percentDecks}%)</span>
<span className="text-md">{nbrDecks} Deck{nbrDecks > 1 ? "s" : ""}
{ percentDecks != undefined && ( <span> sur {totalDecks} ({percentDecks}%)</span>)}</span>
</>
)}
</div>
</a>
</div>
)}
MTGCard.displayName = "MTGCard"

3
app/components/ui/navigation-bar.tsx
View file

@ -435,7 +435,7 @@ export function NavigationBar ({ isLoggedIn, username}: NavigationProps) {
{ !isLoggedIn &&
<>
<a href="/account/signin" className="text-stone-500">Connexion</a>
<Button disabled={true} className="text-stone-500">Inscription</Button>
<a href="#" className="text-stone-500 cursor-not-allowed">Inscription</a>
</>
}
{
@ -443,7 +443,6 @@ export function NavigationBar ({ isLoggedIn, username}: NavigationProps) {
<>
<a href="/account/profile/decks" className="flex flex-row items-center gap-2 text-stone-500">Decks</a>
<a href="/account/profile" className="flex flex-row items-center gap-2">
<IconUserFilled color="stone-500" />
<span className="text-stone-500">{username}</span>
</a>
</>