TresAbhi/blitzkit
1
0 Fork 0
mirror of https://github.com/blitzkit/blitzkit.git synced 2026-10-23 11:39:50 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat: tier display

Browse Source
This commit is contained in:
TrèsAbhi committed 2023-12-04 18:40:24 -06:00
1 parent 6ed9a191b9
commit fb4e00afc4
1 file changed
+43 -33
Download Patch File Download Diff File Expand all files Collapse all files
src/app/tools/tankopedia/page.tsx
+43 -33
View File
@@ -13,6 +13,7 @@ import {
TANK_ICONS, TANK_ICONS,
TANK_ICONS_COLLECTOR, TANK_ICONS_COLLECTOR,
TANK_ICONS_PREMIUM, TANK_ICONS_PREMIUM,
TIER_ROMAN_NUMERALS,
tanks, tanks,
} from '../../../core/blitzkrieg/tankopedia'; } from '../../../core/blitzkrieg/tankopedia';
import { theme } from '../../../stitches.config'; import { theme } from '../../../stitches.config';
@@ -127,6 +128,8 @@ export default function Page() {
href={`/tools/tankopedia/${tank.id}`} href={`/tools/tankopedia/${tank.id}`}
style={{ style={{
flex: 1, flex: 1,
textDecoration: 'none',
color: 'unset',
}} }}
> >
<Card className={styles.listing}> <Card className={styles.listing}>
@@ -180,45 +183,52 @@ export default function Page() {
<Flex <Flex
align="center" align="center"
justify="center" justify="between"
gap="1"
className={styles.listingLabel} className={styles.listingLabel}
style={{ style={{
position: 'absolute', position: 'absolute',
bottom: 8, bottom: 8,
left: 12, padding: '0 12px',
width: '100%',
boxSizing: 'border-box',
}} }}
> >
<img <Flex align="center" justify="center" gap="1">
src={ <img
(tank.tree_type === 'collector' src={
? TANK_ICONS_COLLECTOR (tank.tree_type === 'collector'
: tank.tree_type === 'premium' ? TANK_ICONS_COLLECTOR
? TANK_ICONS_PREMIUM : tank.tree_type === 'premium'
: TANK_ICONS)[tank.type] ? TANK_ICONS_PREMIUM
} : TANK_ICONS)[tank.type]
style={{ width: '1em', height: '1em' }} }
/> style={{ width: '1em', height: '1em' }}
<Text />
size="4" <Text
color={ size="4"
tank.tree_type === 'collector' color={
? 'blue' tank.tree_type === 'collector'
: tank.tree_type === 'premium' ? 'blue'
? 'amber' : tank.tree_type === 'premium'
: undefined ? 'amber'
} : undefined
weight="medium" }
style={{ weight="medium"
color: style={{
tank.tree_type === 'tech-tree' color:
? slateDark.slate12 tank.tree_type === 'tech-tree'
: undefined, ? slateDark.slate12
}} : undefined,
> }}
{tank.name_short ?? >
tank.name ?? {tank.name_short ??
`Unknown tank ${tank.id}`} tank.name ??
`Unknown tank ${tank.id}`}
</Text>
</Flex>
<Text size="4" color="gray" highContrast={false}>
{TIER_ROMAN_NUMERALS[tank.tier]}
</Text> </Text>
</Flex> </Flex>
</Inset> </Inset>