diff --git a/src/app/tools/tankopedia/[id]/components/Characteristics/index.tsx b/src/app/tools/tankopedia/[id]/components/Characteristics/index.tsx index e47201692..e0898aefe 100644 --- a/src/app/tools/tankopedia/[id]/components/Characteristics/index.tsx +++ b/src/app/tools/tankopedia/[id]/components/Characteristics/index.tsx @@ -11,6 +11,7 @@ import { import { debounce } from 'lodash'; import { Fragment, use, useEffect, useRef, useState } from 'react'; import { lerp } from 'three/src/math/MathUtils'; +import { Ad, AdType } from '../../../../../../components/Ad'; import { Link } from '../../../../../../components/Link'; import { applyPitchYawLimits } from '../../../../../../core/blitz/applyPitchYawLimits'; import { isExplosive } from '../../../../../../core/blitz/isExplosive'; @@ -26,14 +27,12 @@ import { GUN_TYPE_NAMES, } from '../../../../../../core/blitzkit/tankDefinitions/constants'; import { useEquipment } from '../../../../../../hooks/useEquipment'; -import { useWideFormat } from '../../../../../../hooks/useWideFormat'; import { mutateDuel, useDuel } from '../../../../../../stores/duel'; import { useTankopediaTemporary } from '../../../../../../stores/tankopedia'; import { Info } from './components/Info'; import { InfoWithDelta } from './components/InfoWithDelta'; export function Characteristics() { - const wideFormat = useWideFormat(960); const awaitedEquipmentDefinitions = use(equipmentDefinitions); const awaitedModelDefinitions = use(modelDefinitions); const awaitedProvisionDefinitions = use(provisionDefinitions); @@ -128,7 +127,13 @@ export function Characteristics() { }, [hasImprovedVerticalStabilizer]); return ( - + @@ -480,6 +485,16 @@ export function Characteristics() { + + + + Maneuverability diff --git a/src/app/tools/tankopedia/[id]/components/Model/CharacteristicsSection.tsx b/src/app/tools/tankopedia/[id]/components/Model/CharacteristicsSection.tsx index 70f90c680..baa78d9bf 100644 --- a/src/app/tools/tankopedia/[id]/components/Model/CharacteristicsSection.tsx +++ b/src/app/tools/tankopedia/[id]/components/Model/CharacteristicsSection.tsx @@ -1,5 +1,5 @@ import { Flex, Heading } from '@radix-ui/themes'; -import { useWideFormat } from '../../../../../../hooks/useWideFormat'; +import { Ad, AdType } from '../../../../../../components/Ad'; import { Characteristics } from '../Characteristics'; import { Consumables } from '../Characteristics/components/Consumables'; import { Equipment } from '../Characteristics/components/Equipment'; @@ -9,22 +9,39 @@ import { Provisions } from '../Characteristics/components/Provisions'; import { Skills } from '../Characteristics/components/Skills'; export function CharacteristicsSection() { - const wideFormat = useWideFormat(880); - return ( + + + + + Configuration @@ -37,10 +54,11 @@ export function CharacteristicsSection() { + + + + + ); } diff --git a/src/app/tools/tankopedia/[id]/page.tsx b/src/app/tools/tankopedia/[id]/page.tsx index 4da1fc0e7..b2e50731e 100644 --- a/src/app/tools/tankopedia/[id]/page.tsx +++ b/src/app/tools/tankopedia/[id]/page.tsx @@ -1,7 +1,8 @@ 'use client'; import { useEffect } from 'react'; -import { MidSectionAd } from '../../../../components/MidSectionAd'; +import { AdMidSectionResponsive } from '../../../../components/AdMidSectionResponsive'; +import { AdMidSectionWideOnly } from '../../../../components/AdMidSectionWideOnly'; import PageWrapper from '../../../../components/PageWrapper'; import { assignDuelMember } from '../../../../core/blitzkit/assignDuelMember'; import { mutateDuel, useDuel } from '../../../../stores/duel'; @@ -75,12 +76,12 @@ export default function Page({ params }: { params: { id: string } }) { {assigned && ( <> - + - + - + {/* */} diff --git a/src/components/AdMidSectionNarrowOnly.tsx b/src/components/AdMidSectionNarrowOnly.tsx new file mode 100644 index 000000000..8d5361fe3 --- /dev/null +++ b/src/components/AdMidSectionNarrowOnly.tsx @@ -0,0 +1,19 @@ +import { Flex, FlexProps } from '@radix-ui/themes'; +import { Ad, AdType } from './Ad'; + +export function AdMidSectionNarrowOnly(props: FlexProps) { + return ( + + + + ); +} diff --git a/src/components/MidSectionAd.tsx b/src/components/AdMidSectionResponsive.tsx similarity index 88% rename from src/components/MidSectionAd.tsx rename to src/components/AdMidSectionResponsive.tsx index 4afccbfb6..5bd1a39b0 100644 --- a/src/components/MidSectionAd.tsx +++ b/src/components/AdMidSectionResponsive.tsx @@ -1,7 +1,7 @@ import { Flex, FlexProps } from '@radix-ui/themes'; import { Ad, AdType } from './Ad'; -export function MidSectionAd(props: FlexProps) { +export function AdMidSectionResponsive(props: FlexProps) { return ( + + + ); +}