diff --git a/components/weapon/WeaponGrid/index.scss b/components/weapon/WeaponGrid/index.scss index 8fec4f82..92324d01 100644 --- a/components/weapon/WeaponGrid/index.scss +++ b/components/weapon/WeaponGrid/index.scss @@ -13,10 +13,7 @@ gap: $unit-3x; grid-template-columns: 1.278fr 3fr; justify-items: center; - grid-template-areas: - 'mainhand grid' - 'mainhand grid' - 'mainhand grid'; + grid-template-areas: 'mainhand grid'; max-width: $grid-width; @include breakpoint(tablet) { diff --git a/components/weapon/WeaponGrid/index.tsx b/components/weapon/WeaponGrid/index.tsx index 6e1588e3..b27cb658 100644 --- a/components/weapon/WeaponGrid/index.tsx +++ b/components/weapon/WeaponGrid/index.tsx @@ -375,28 +375,32 @@ const WeaponGrid = (props: Props) => { ) }) - const extraElement = ( - - {appState.party.raid && appState.party.raid.group.extra && ( - - )} - {appState.party.raid && appState.party.raid.group.guidebooks && ( - - )} - - ) + const extraElement = () => { + if (appState.party.raid && appState.party.raid.group.extra) { + return ( + + {appState.party.raid && appState.party.raid.group.extra && ( + + )} + {appState.party.raid && appState.party.raid.group.guidebooks && ( + + )} + + ) + } + } const conflictModal = () => { return incoming && conflicts ? ( @@ -448,7 +452,7 @@ const WeaponGrid = (props: Props) => { - {displayExtraContainer ? extraElement : ''} + {displayExtraContainer ? extraElement() : ''} ) }