mirror of
https://github.com/blitzkit/blitzkit.git
synced 2026-10-23 11:39:50 +02:00
feat: icons
This commit is contained in:
1 parent
bda0c4ef1b
commit
48578407db
2 files changed
+45
-22
No files matched your search
@@ -6,7 +6,12 @@ import { Card, Flex, Inset, Text, TextField } from '@radix-ui/themes';
|
||||
import { use, useRef } from 'react';
|
||||
import { Search } from 'react-fuzzysort';
|
||||
import { tankIcon } from '../../../../../core/blitzkrieg/tankIcon';
|
||||
import { tanks } from '../../../../../core/blitzkrieg/tankopedia';
|
||||
import {
|
||||
TANK_ICONS,
|
||||
TANK_ICONS_COLLECTOR,
|
||||
TANK_ICONS_PREMIUM,
|
||||
tanks,
|
||||
} from '../../../../../core/blitzkrieg/tankopedia';
|
||||
import { theme } from '../../../../../stitches.config';
|
||||
import * as styles from './index.css';
|
||||
|
||||
@@ -64,31 +69,49 @@ export function List() {
|
||||
}}
|
||||
/>
|
||||
|
||||
<Text
|
||||
<Flex
|
||||
align="center"
|
||||
justify="center"
|
||||
gap="1"
|
||||
className={styles.listingLabel}
|
||||
size="4"
|
||||
color={
|
||||
tank.tree_type === 'collector'
|
||||
? 'cyan'
|
||||
: tank.tree_type === 'premium'
|
||||
? 'amber'
|
||||
: undefined
|
||||
}
|
||||
weight="medium"
|
||||
style={{
|
||||
color:
|
||||
tank.tree_type === 'tech-tree'
|
||||
? slateDark.slate11
|
||||
: undefined,
|
||||
position: 'absolute',
|
||||
bottom: 8,
|
||||
left: 12,
|
||||
}}
|
||||
>
|
||||
{tank.name_short ??
|
||||
tank.name ??
|
||||
`Unknown tank ${tank.id}`}
|
||||
</Text>
|
||||
<img
|
||||
src={
|
||||
(tank.tree_type === 'collector'
|
||||
? TANK_ICONS_COLLECTOR
|
||||
: tank.tree_type === 'premium'
|
||||
? TANK_ICONS_PREMIUM
|
||||
: TANK_ICONS)[tank.type]
|
||||
}
|
||||
style={{ width: '1em', height: '1em' }}
|
||||
/>
|
||||
<Text
|
||||
size="4"
|
||||
color={
|
||||
tank.tree_type === 'collector'
|
||||
? 'blue'
|
||||
: tank.tree_type === 'premium'
|
||||
? 'amber'
|
||||
: undefined
|
||||
}
|
||||
weight="medium"
|
||||
style={{
|
||||
color:
|
||||
tank.tree_type === 'tech-tree'
|
||||
? slateDark.slate11
|
||||
: undefined,
|
||||
}}
|
||||
>
|
||||
{tank.name_short ??
|
||||
tank.name ??
|
||||
`Unknown tank ${tank.id}`}
|
||||
</Text>
|
||||
</Flex>
|
||||
</Inset>
|
||||
</Card>
|
||||
</a>
|
||||
|
||||
Reference in new issue
Block a user