Remove tooltip wrapped component

This commit is contained in:
Jackson Harper 2024-03-05 10:18:07 +08:00
parent 8ef19ba28c
commit 158a833d2d
3 changed files with 34 additions and 43 deletions

View file

@ -6,7 +6,6 @@ import {
} from 'phosphor-react'
import { Box, HStack } from '../elements/LayoutPrimitives'
import { StyledText, StyledAnchor } from '../elements/StyledText'
import { TooltipWrapped } from './Tooltip'
const TooltipStyle = {
backgroundColor: '#F9D354',
@ -234,51 +233,45 @@ export default function MobileInstallHelp({
}
>
{platformSizes.map((item, idx) => (
<TooltipWrapped
<Box
key={`platformSize-${idx}`}
tooltipContent={item.label}
tooltipSide={'top'}
style={TooltipStyle}
arrowStyles={{ fill: '#F9D354' }}
title={item.label}
css={{
ml: '$1',
}}
>
<Box
<StyledAnchor
onClick={() => setSelectedTooltip(item.label)}
css={{
ml: '$1',
mx: 'auto',
borderRadius: '50%',
display: 'inline-flex',
alignItems: 'center',
justifyContent: 'center',
height: 35,
width: 35,
cursor: 'pointer',
backgroundColor: '$labelButtonsBg',
...(selectedTooltip !== item.label && {
filter: 'grayscale(1)',
}),
'&:focus': {
filter: 'grayscale(0)',
},
'&:active': {
filter: 'grayscale(0)',
},
'@lg': {
transition: 'filter .3s linear',
'&:hover': {
filter: 'grayscale(0)',
},
},
}}
>
<StyledAnchor
onClick={() => setSelectedTooltip(item.label)}
css={{
mx: 'auto',
borderRadius: '50%',
display: 'inline-flex',
alignItems: 'center',
justifyContent: 'center',
height: 35,
width: 35,
cursor: 'pointer',
backgroundColor: '$labelButtonsBg',
...(selectedTooltip !== item.label && {
filter: 'grayscale(1)',
}),
'&:focus': {
filter: 'grayscale(0)',
},
'&:active': {
filter: 'grayscale(0)',
},
'@lg': {
transition: 'filter .3s linear',
'&:hover': {
filter: 'grayscale(0)',
},
},
}}
>
{item.icon}
</StyledAnchor>
</Box>
</TooltipWrapped>
{item.icon}
</StyledAnchor>
</Box>
))}
</HStack>
</HStack>

View file

@ -16,7 +16,6 @@ import { useCopyLink } from '../../../lib/hooks/useCopyLink'
import { CloseIcon } from '../../elements/images/CloseIcon'
import { OmnivoreLogoIcon } from '../../elements/images/OmnivoreNameLogo'
import { useState } from 'react'
import { TooltipWrapped } from '../../elements/Tooltip'
import { TwitterLogo, FacebookLogo } from 'phosphor-react'
type ShareType = 'link' | 'highlight'

View file

@ -20,7 +20,6 @@ import { StyledText } from '../../components/elements/StyledText'
import { ArrowClockwise, DotsThree, PencilSimple, Trash } from 'phosphor-react'
import { GenericTableCardProps } from '../../utils/settings-page/labels/types'
import { labelColorObjects } from '../../utils/settings-page/labels/labelColorObjects'
import { TooltipWrapped } from '../../components/elements/Tooltip'
import { LabelColorDropdown } from '../../components/elements/LabelColorDropdown'
import {
Dropdown,