mirror of
https://github.com/omnivore-app/omnivore.git
synced 2026-03-11 08:54:26 +00:00
Remove tooltip wrapped component
This commit is contained in:
parent
8ef19ba28c
commit
158a833d2d
3 changed files with 34 additions and 43 deletions
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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'
|
||||
|
|
|
|||
|
|
@ -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,
|
||||
|
|
|
|||
Loading…
Reference in a new issue