TresAbhi/blitzkit
1
0 Fork 0
mirror of https://github.com/blitzkit/blitzkit.git synced 2026-11-13 20:56:11 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat: tracking

Browse Source
This commit is contained in:
TrèsAbhi committed 2025-10-14 21:36:37 -05:00
1 parent 263f292a59
commit ea048da7a2
11 files changed
+272 -106
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/website/src/components/PlaylistGenerator.tsx
+66 -58
View File
@@ -33,73 +33,81 @@ export function PlaylistGenerator() {
const tanksTrimmed = useMemo(() => tanks.slice(0, 65), [filters]);
return (
<Flex justify="center" width="100%" gap="9" align="center">
<Flex direction="column" gap="4" align="center">
<FilterControl />
<Button onClick={generatePlaylist} size="3">
{strings.website.tools.playlist.generate}
</Button>
{!wargaming && (
<Text color="gray">
<Flex align="center" gap="1">
<ExclamationTriangleIcon />
{strings.website.tools.playlist.no_login_warning}
</Flex>
</Text>
)}
</Flex>
<Flex justify="center" width="100%" align="center">
<Flex
direction="column"
flexGrow="1"
flexBasis="0"
gap="9"
align="center"
gap="4"
justify="center"
maxWidth="80rem"
>
<Grid
columns="repeat(auto-fill, minmax(4rem, 1fr))"
flow="dense"
overflow="hidden"
position="relative"
maxHeight={POOL_HEIGHT}
width="100%"
<Flex direction="column" gap="4" align="center">
<FilterControl />
<Button onClick={generatePlaylist} size="3">
{strings.website.tools.playlist.generate}
</Button>
{!wargaming && (
<Text color="gray">
<Flex align="center" gap="1">
<ExclamationTriangleIcon />
{strings.website.tools.playlist.no_login_warning}
</Flex>
</Text>
)}
</Flex>
<Flex
direction="column"
flexGrow="1"
flexBasis="0"
align="center"
gap="4"
>
{tanksTrimmed.map((tank) => (
<LinkI18n
target="_blank"
locale={locale}
href={`/tanks/${tank.slug}`}
key={tank.id}
<Grid
columns="repeat(auto-fill, minmax(4rem, 1fr))"
flow="dense"
overflow="hidden"
position="relative"
maxHeight={POOL_HEIGHT}
width="100%"
>
{tanksTrimmed.map((tank) => (
<LinkI18n
target="_blank"
locale={locale}
href={`/tanks/${tank.slug}`}
key={tank.id}
style={{
aspectRatio: "4 / 3",
backgroundSize: "cover",
backgroundPosition: "center",
backgroundImage: `url(${tankIcon(tank.id)})`,
backgroundRepeat: "no-repeat",
}}
/>
))}
<Box
position="absolute"
top="0"
left="0"
width="100%"
height="100%"
style={{
aspectRatio: "4 / 3",
backgroundSize: "cover",
backgroundPosition: "center",
backgroundImage: `url(${tankIcon(tank.id)})`,
backgroundRepeat: "no-repeat",
pointerEvents: "none",
background: `linear-gradient(transparent, var(--gray-1) ${POOL_HEIGHT})`,
}}
/>
))}
</Grid>
<Box
position="absolute"
top="0"
left="0"
width="100%"
height="100%"
style={{
pointerEvents: "none",
background: `linear-gradient(transparent, var(--gray-1) ${POOL_HEIGHT})`,
}}
/>
</Grid>
<Text color="gray">
{literals(strings.website.tools.playlist.pool_size, {
count: tanks.length,
})}
</Text>
<Text color="gray">
{literals(strings.website.tools.playlist.pool_size, {
count: tanks.length,
})}
</Text>
</Flex>
</Flex>
</Flex>
);