feat: link

This commit is contained in:
TrèsAbhi committed 2024-05-01 17:29:40 -05:00
1 parent d56be26db2
commit aafba7b6c8
1 file changed
+53 -40
+53 -40
View File
@@ -32,6 +32,7 @@ import searchPlayersAcrossRegions, {
} from '../../../core/blitz/searchPlayersAcrossRegions'; } from '../../../core/blitz/searchPlayersAcrossRegions';
import { tankDefinitions } from '../../../core/blitzkit/tankDefinitions'; import { tankDefinitions } from '../../../core/blitzkit/tankDefinitions';
import { tankIcon } from '../../../core/blitzkit/tankIcon'; import { tankIcon } from '../../../core/blitzkit/tankIcon';
import { theme } from '../../../stitches.config';
import { useApp } from '../../../stores/app'; import { useApp } from '../../../stores/app';
import mutateSession, { import mutateSession, {
SessionTracking, SessionTracking,
@@ -270,8 +271,12 @@ export default function Page() {
{session.tracking && ( {session.tracking && (
<Flex mt="2" mb="2" direction="column" align="center" gap="2"> <Flex mt="2" mb="2" direction="column" align="center" gap="2">
<Heading size="5">Tracking {accountInfo?.nickname}</Heading>
<Text color="gray">
Since {new Date(session.player.since).toLocaleString()}
</Text>
<Flex gap="4" align="center" justify="center"> <Flex gap="4" align="center" justify="center">
<Heading size="5">Tracking {accountInfo?.nickname}</Heading>
<Button <Button
color="red" color="red"
variant="ghost" variant="ghost"
@@ -283,11 +288,16 @@ export default function Page() {
> >
Stop Stop
</Button> </Button>
<Button
color="red"
variant="ghost"
onClick={() => {
// TODO: add functionality
}}
>
Reset
</Button>
</Flex> </Flex>
<Text color="gray">
Since {new Date(session.player.since).toLocaleString()}
</Text>
</Flex> </Flex>
)} )}
@@ -322,43 +332,46 @@ export default function Page() {
overflowY: 'hidden', overflowY: 'hidden',
}} }}
> >
<img <Link href={`/tools/tankopedia/${tank.id}`}>
draggable={false} <img
src={tankIcon(tank.id)} draggable={false}
style={{ src={tankIcon(tank.id)}
position: 'absolute', style={{
width: 128 + 32, position: 'absolute',
height: '200%', width: 128 + 32,
top: '-50%', height: '200%',
left: 0, top: '-50%',
objectFit: 'contain', left: 0,
objectPosition: '50% 50%', objectFit: 'contain',
overflow: 'hidden', objectPosition: '50% 50%',
}} overflow: 'hidden',
/> }}
/>
<div <div
style={{ style={{
backgroundColor: 'red', backgroundColor: 'red',
position: 'absolute', position: 'absolute',
top: 0, top: 0,
left: 0, left: 0,
height: '100%', height: '100%',
width: 128, width: 128,
background: background:
'linear-gradient(90deg, #00000080, #00000000)', 'linear-gradient(90deg, #00000080, #00000000)',
}} }}
/> />
<Text <Text
style={{ style={{
position: 'relative', color: theme.colors.textHighContrast,
textWrap: 'nowrap', position: 'relative',
textShadow: 'black 0 0 4px', textWrap: 'nowrap',
}} textShadow: 'black 0 0 4px',
> }}
{tank.name} >
</Text> {tank.name}
</Text>
</Link>
</Table.RowHeaderCell> </Table.RowHeaderCell>
<Table.Cell align="right">{stat.all.battles}</Table.Cell> <Table.Cell align="right">{stat.all.battles}</Table.Cell>
<Table.Cell align="right"> <Table.Cell align="right">