mirror of
https://github.com/chaoticbackup/chaoticbackup.github.io.git
synced 2026-08-21 08:04:18 -05:00
override icon size
This commit is contained in:
@@ -9,7 +9,7 @@ import { CardBase, CardComponent, Flavor, Unique } from './CardBase';
|
||||
const AttackCard: CardBase<Attack> = (props) => {
|
||||
const { card } = props;
|
||||
|
||||
const ability = abilityText({ ability: card.gsx$ability });
|
||||
const ability = abilityText({ ability: card.gsx$ability, size: "icon16" });
|
||||
const unique = uniqueText({ data: { unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary }});
|
||||
const flavor = card.gsx$flavortext;
|
||||
|
||||
@@ -22,8 +22,8 @@ const AttackCard: CardBase<Attack> = (props) => {
|
||||
</>}
|
||||
left={<>
|
||||
<Name name={card.gsx$name} />
|
||||
<RarityIcon set={card.gsx$set} rarity={card.gsx$rarity} />
|
||||
<Typography><AttackIcon bp={card.gsx$bp} /> Attack - {card.gsx$bp}</Typography>
|
||||
<RarityIcon size="icon20" set={card.gsx$set} rarity={card.gsx$rarity} />
|
||||
<Typography><AttackIcon size="icon20" bp={card.gsx$bp} /> Attack - {card.gsx$bp}</Typography>
|
||||
<Typography>
|
||||
{`${card.gsx$base} | `}
|
||||
<ElementIcon element="fire" value={card.gsx$fire} />{`${card.gsx$fire} `}
|
||||
|
||||
@@ -8,7 +8,7 @@ import { CardBase, CardComponent, Unique, Flavor } from './CardBase';
|
||||
|
||||
const BattlegearCard: CardBase<Battlegear> = (props) => {
|
||||
const { card } = props;
|
||||
const ability = abilityText({ ability: card.gsx$ability });
|
||||
const ability = abilityText({ ability: card.gsx$ability, size: "icon16" });
|
||||
const unique = uniqueText({ data: { unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary }});
|
||||
const flavor = card.gsx$flavortext;
|
||||
|
||||
@@ -16,8 +16,8 @@ const BattlegearCard: CardBase<Battlegear> = (props) => {
|
||||
<CardComponent {...props}
|
||||
left={<>
|
||||
<Name name={card.gsx$name} />
|
||||
<RarityIcon set={card.gsx$set} rarity={card.gsx$rarity} />
|
||||
<Typography><BattlegearIcon /> Battlegear{card.gsx$types.length > 0 ? ` - ${card.gsx$types}` : null}</Typography>
|
||||
<RarityIcon size="icon20" set={card.gsx$set} rarity={card.gsx$rarity} />
|
||||
<Typography><BattlegearIcon size="icon20"/> Battlegear{card.gsx$types.length > 0 ? ` - ${card.gsx$types}` : null}</Typography>
|
||||
</>}
|
||||
right={<>
|
||||
<Typography sx={{ whiteSpace: "pre-line" }}>{ability}</Typography>
|
||||
|
||||
@@ -40,10 +40,10 @@ export const CardComponent = (
|
||||
alt={`${card.gsx$name} thumb`}
|
||||
onClick={() => extend(card.gsx$name)}
|
||||
/>
|
||||
<Box sx={{ display: 'flex', flexDirection: 'column', marginLeft: 1, width: "30%" }}>
|
||||
<Box sx={{ marginLeft: .5, marginRight: .5, minWidth: "242px" }}>
|
||||
{left}
|
||||
</Box>
|
||||
<Box sx={{ display: 'block' }}>
|
||||
<Box>
|
||||
{right}
|
||||
</Box>
|
||||
</Card>
|
||||
|
||||
@@ -8,7 +8,7 @@ import { CardBase, CardComponent, Unique, Flavor } from './CardBase';
|
||||
|
||||
const LocationCard: CardBase<Location> = (props) => {
|
||||
const { card } = props;
|
||||
const ability = abilityText({ ability: card.gsx$ability });
|
||||
const ability = abilityText({ ability: card.gsx$ability, size: "icon16" });
|
||||
const unique = uniqueText({ data: { unique: card.gsx$unique, loyal: card.gsx$loyal, legendary: card.gsx$legendary }});
|
||||
const flavor = card.gsx$flavortext;
|
||||
|
||||
@@ -16,8 +16,8 @@ const LocationCard: CardBase<Location> = (props) => {
|
||||
<CardComponent {...props}
|
||||
left={<>
|
||||
<Name name={card.gsx$name} />
|
||||
<RarityIcon set={card.gsx$set} rarity={card.gsx$rarity} />
|
||||
<Typography><LocationIcon /> Location{card.gsx$types.length > 0 ? ` - ${card.gsx$types}` : null}</Typography>
|
||||
<RarityIcon size="icon20" set={card.gsx$set} rarity={card.gsx$rarity} />
|
||||
<Typography><LocationIcon size="icon20" /> Location{card.gsx$types.length > 0 ? ` - ${card.gsx$types}` : null}</Typography>
|
||||
<Typography>{`Initiative: `}<InitiativeIcon initiative={card.gsx$initiative} />{` ${card.gsx$initiative}`}</Typography>
|
||||
</>}
|
||||
right={<>
|
||||
|
||||
@@ -1,22 +1,25 @@
|
||||
.icon14 {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.icon16 {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.icon20 {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.icon24 {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.name {
|
||||
|
||||
@@ -88,6 +88,7 @@ export default function Collection (_props) {
|
||||
|
||||
const handlePerPage = (event: SelectChangeEvent<number>) => {
|
||||
sn(event.target.value as number);
|
||||
sp(1);
|
||||
};
|
||||
|
||||
const handlePage = (event: React.ChangeEvent<unknown>, value: number) => {
|
||||
|
||||
Reference in New Issue
Block a user