mirror of
https://github.com/blitzkit/blitzkit.git
synced 2026-10-23 19:49:50 +02:00
feat: shell name tooltips
This commit is contained in:
1 parent
16e2f9ac96
commit
9c784228fb
2 files changed
+30
-27
No files matched your search
@@ -7,6 +7,7 @@ import {
|
|||||||
Slider,
|
Slider,
|
||||||
Text,
|
Text,
|
||||||
TextField,
|
TextField,
|
||||||
|
Tooltip,
|
||||||
} from '@radix-ui/themes';
|
} from '@radix-ui/themes';
|
||||||
import { debounce } from 'lodash';
|
import { debounce } from 'lodash';
|
||||||
import { Fragment, use, useEffect, useRef, useState } from 'react';
|
import { Fragment, use, useEffect, useRef, useState } from 'react';
|
||||||
@@ -144,32 +145,34 @@ export function Characteristics() {
|
|||||||
|
|
||||||
<Flex>
|
<Flex>
|
||||||
{gun.shells.map((thisShell, shellIndex) => (
|
{gun.shells.map((thisShell, shellIndex) => (
|
||||||
<IconButton
|
<Tooltip content={thisShell.name}>
|
||||||
color={thisShell.id === shell.id ? undefined : 'gray'}
|
<IconButton
|
||||||
variant="soft"
|
color={thisShell.id === shell.id ? undefined : 'gray'}
|
||||||
key={thisShell.id}
|
variant="soft"
|
||||||
style={{
|
key={thisShell.id}
|
||||||
borderTopLeftRadius: shellIndex === 0 ? undefined : 0,
|
style={{
|
||||||
borderBottomLeftRadius: shellIndex === 0 ? undefined : 0,
|
borderTopLeftRadius: shellIndex === 0 ? undefined : 0,
|
||||||
borderTopRightRadius:
|
borderBottomLeftRadius: shellIndex === 0 ? undefined : 0,
|
||||||
shellIndex === gun.shells.length - 1 ? undefined : 0,
|
borderTopRightRadius:
|
||||||
borderBottomRightRadius:
|
shellIndex === gun.shells.length - 1 ? undefined : 0,
|
||||||
shellIndex === gun.shells.length - 1 ? undefined : 0,
|
borderBottomRightRadius:
|
||||||
marginLeft: shellIndex === 0 ? 0 : -1,
|
shellIndex === gun.shells.length - 1 ? undefined : 0,
|
||||||
}}
|
marginLeft: shellIndex === 0 ? 0 : -1,
|
||||||
onClick={() => {
|
}}
|
||||||
mutateDuel((draft) => {
|
onClick={() => {
|
||||||
draft.protagonist.shell = thisShell;
|
mutateDuel((draft) => {
|
||||||
});
|
draft.protagonist.shell = thisShell;
|
||||||
}}
|
});
|
||||||
>
|
}}
|
||||||
<img
|
>
|
||||||
alt={thisShell.name}
|
<img
|
||||||
width={16}
|
alt={thisShell.name}
|
||||||
height={16}
|
width={16}
|
||||||
src={asset(`icons/shells/${thisShell.icon}.webp`)}
|
height={16}
|
||||||
/>
|
src={asset(`icons/shells/${thisShell.icon}.webp`)}
|
||||||
</IconButton>
|
/>
|
||||||
|
</IconButton>
|
||||||
|
</Tooltip>
|
||||||
))}
|
))}
|
||||||
</Flex>
|
</Flex>
|
||||||
</Flex>
|
</Flex>
|
||||||
|
|||||||
@@ -16,8 +16,8 @@ export function MetaSection() {
|
|||||||
typeof tank.price === 'number' ? 'credits' : tank.price.type;
|
typeof tank.price === 'number' ? 'credits' : tank.price.type;
|
||||||
const salePrice = 0.5 * rawPrice;
|
const salePrice = 0.5 * rawPrice;
|
||||||
const purchasePrice = rawPrice;
|
const purchasePrice = rawPrice;
|
||||||
let worthSelling: boolean;
|
|
||||||
const ClassIcon = classIcons[tank.class];
|
const ClassIcon = classIcons[tank.class];
|
||||||
|
let worthSelling: boolean;
|
||||||
|
|
||||||
if (priceType === 'gold') {
|
if (priceType === 'gold') {
|
||||||
worthSelling = tank.tier <= 6 || purchasePrice - salePrice <= 500;
|
worthSelling = tank.tier <= 6 || purchasePrice - salePrice <= 500;
|
||||||
|
|||||||
Reference in new issue
Block a user