diff --git a/packages/website/public/assets/images/national-wallpapers/china.jpg b/packages/website/public/assets/images/national-wallpapers/china.jpg new file mode 100644 index 000000000..2f7a414e9 Binary files /dev/null and b/packages/website/public/assets/images/national-wallpapers/china.jpg differ diff --git a/packages/website/public/assets/images/national-wallpapers/european.jpg b/packages/website/public/assets/images/national-wallpapers/european.jpg new file mode 100644 index 000000000..a5383d610 Binary files /dev/null and b/packages/website/public/assets/images/national-wallpapers/european.jpg differ diff --git a/packages/website/public/assets/images/national-wallpapers/france.jpg b/packages/website/public/assets/images/national-wallpapers/france.jpg new file mode 100644 index 000000000..c6a8e09d2 Binary files /dev/null and b/packages/website/public/assets/images/national-wallpapers/france.jpg differ diff --git a/packages/website/public/assets/images/national-wallpapers/germany.jpg b/packages/website/public/assets/images/national-wallpapers/germany.jpg new file mode 100644 index 000000000..5a65449fb Binary files /dev/null and b/packages/website/public/assets/images/national-wallpapers/germany.jpg differ diff --git a/packages/website/public/assets/images/national-wallpapers/japan.jpg b/packages/website/public/assets/images/national-wallpapers/japan.jpg new file mode 100644 index 000000000..0e9964e71 Binary files /dev/null and b/packages/website/public/assets/images/national-wallpapers/japan.jpg differ diff --git a/packages/website/public/assets/images/national-wallpapers/other.jpg b/packages/website/public/assets/images/national-wallpapers/other.jpg new file mode 100644 index 000000000..da74cb4fa Binary files /dev/null and b/packages/website/public/assets/images/national-wallpapers/other.jpg differ diff --git a/packages/website/public/assets/images/national-wallpapers/uk.jpg b/packages/website/public/assets/images/national-wallpapers/uk.jpg new file mode 100644 index 000000000..1edd4ed05 Binary files /dev/null and b/packages/website/public/assets/images/national-wallpapers/uk.jpg differ diff --git a/packages/website/public/assets/images/national-wallpapers/usa.jpg b/packages/website/public/assets/images/national-wallpapers/usa.jpg new file mode 100644 index 000000000..9dea35ce3 Binary files /dev/null and b/packages/website/public/assets/images/national-wallpapers/usa.jpg differ diff --git a/packages/website/public/assets/images/national-wallpapers/ussr.jpg b/packages/website/public/assets/images/national-wallpapers/ussr.jpg new file mode 100644 index 000000000..46455845f Binary files /dev/null and b/packages/website/public/assets/images/national-wallpapers/ussr.jpg differ diff --git a/packages/website/src/components/Tankopedia/MetaSection/components/Listing.tsx b/packages/website/src/components/Tankopedia/MetaSection/components/Listing.tsx index a16207b0e..369f1bdd5 100644 --- a/packages/website/src/components/Tankopedia/MetaSection/components/Listing.tsx +++ b/packages/website/src/components/Tankopedia/MetaSection/components/Listing.tsx @@ -1,4 +1,5 @@ import { Flex, Text, type TextProps } from '@radix-ui/themes'; +import { Var } from '../../../../core/radix/var'; type ListingProps = TextProps & { label: string; @@ -6,9 +7,15 @@ type ListingProps = TextProps & { export function Listing({ label, ...props }: ListingProps) { return ( - - {label} - + + {label} + ); } diff --git a/packages/website/src/components/Tankopedia/MetaSection/index.tsx b/packages/website/src/components/Tankopedia/MetaSection/index.tsx index 88f4b6b70..bdd28a31a 100644 --- a/packages/website/src/components/Tankopedia/MetaSection/index.tsx +++ b/packages/website/src/components/Tankopedia/MetaSection/index.tsx @@ -1,171 +1,178 @@ import { - assertSecret, asset, TankPriceType, TankType, TIER_ROMAN_NUMERALS, } from '@blitzkit/core'; -import { ChevronLeftIcon, MixIcon, UpdateIcon } from '@radix-ui/react-icons'; -import { Button, Code, Dialog, Flex, Link } from '@radix-ui/themes'; -import { useState } from 'react'; -import { awaitableModelDefinitions } from '../../../core/awaitables/modelDefinitions'; -import { awaitableProvisionDefinitions } from '../../../core/awaitables/provisionDefinitions'; -import { tankToDuelMember } from '../../../core/blitzkit/tankToDuelMember'; +import { Box, Code, Flex } from '@radix-ui/themes'; +import { Var } from '../../../core/radix/var'; import { useLocale } from '../../../hooks/useLocale'; import { App } from '../../../stores/app'; import { Duel } from '../../../stores/duel'; -import { TankopediaEphemeral } from '../../../stores/tankopediaEphemeral'; import { classIcons } from '../../ClassIcon'; -import { LinkI18n } from '../../LinkI18n'; -import { ScienceIcon } from '../../ScienceIcon'; -import { TankSearch } from '../../TankSearch'; import { Listing } from './components/Listing'; -const [provisionDefinitions, modelDefinitions] = await Promise.all([ - awaitableProvisionDefinitions, - awaitableModelDefinitions, -]); +const NATIONAL_BANNER_POSITION_OVERRIDES: Record = { + germany: '50% 35%', + france: '50% 35%', + other: '50% 35%', +}; export function MetaSection() { const developerMode = App.useDeferred((state) => state.developerMode, false); const protagonist = Duel.use((state) => state.protagonist.tank); - const antagonist = Duel.use((state) => state.antagonist.tank); const ClassIcon = classIcons[protagonist.class]; - const compareTanks = - protagonist.id === antagonist.id - ? [protagonist.id] - : [protagonist.id, antagonist.id]; - const mutateDuel = Duel.useMutation(); - const mutateTankopediaEphemeral = TankopediaEphemeral.useMutation(); - const [showSwapDialog, setShowSwapDialog] = useState(false); - const { locale, strings, unwrap } = useLocale(); + const { locale, strings } = useLocale(); + + console.log(protagonist.nation); return ( - - - - + + - - {protagonist.name_full && ( - - {unwrap(protagonist.name_full)} - - )} - - - {protagonist.nation} - { - strings.common.nations[ - protagonist.nation as keyof typeof strings.common.nations - ] - } - - - - - - {strings.common.tank_class_short[protagonist.class]} - - - - {TIER_ROMAN_NUMERALS[protagonist.tier]} - - + - {strings.common.tree_type[protagonist.type]} - - + + + + {protagonist.nation} + { + strings.common.nations[ + protagonist.nation as keyof typeof strings.common.nations + ] + } + + + + + + {strings.common.tank_class_short[protagonist.class]} + + + + {TIER_ROMAN_NUMERALS[protagonist.tier]} + + + {strings.common.tree_type[protagonist.type]} + + - - {developerMode && ( - - {protagonist.id} - - )} - {protagonist.type === TankType.PREMIUM && ( - - - {protagonist.price.value / 400} - gold - - - )} - - - {protagonist.price.value.toLocaleString(locale)} - {TankPriceType[protagonist.price.type]} + + {developerMode && ( + + {protagonist.id} + + )} + {protagonist.type === TankType.PREMIUM && ( + + + {protagonist.price.value / 400} + gold + + + )} + + + {protagonist.price.value.toLocaleString(locale)} + {TankPriceType[protagonist.price.type]} + + + + + {(protagonist.price.value / 2).toLocaleString(locale)} + {TankPriceType[protagonist.price.type]} + + + {protagonist.research_cost && ( + + + {( + protagonist.research_cost.research_cost_type! + .value as number + ).toLocaleString(locale)} + xp + + + )} - - - - {(protagonist.price.value / 2).toLocaleString(locale)} - {TankPriceType[protagonist.price.type]} - - - {protagonist.research_cost && ( - - - {( - protagonist.research_cost.research_cost_type! - .value as number - ).toLocaleString(locale)} - xp - - - )} + - - + + ); }