open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added tip jar

Browse Source
This commit is contained in:
ingawei 2022-10-12 19:14:11 -07:00
parent c2d112e516
commit 4381911dbd
1 changed files with 15 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
web/components/contract/tip-button.tsx
View File

@ -5,6 +5,7 @@ import { Button } from 'web/components/button'
import { formatMoney, shortFormatNumber } from 'common/util/format' import { formatMoney, shortFormatNumber } from 'common/util/format'
import { Col } from 'web/components/layout/col' import { Col } from 'web/components/layout/col'
import { Tooltip } from '../tooltip' import { Tooltip } from '../tooltip'
import TipJar from 'web/public/custom-components/tipJar'
export function TipButton(props: { export function TipButton(props: {
tipAmount: number tipAmount: number
@ -41,26 +42,22 @@ export function TipButton(props: {
onClick={onClick} onClick={onClick}
disabled={disabled} disabled={disabled}
> >
<Col className={'relative items-center sm:flex-row'}> <Col
<HeartIcon className={
'relative items-center transition-transform hover:rotate-12 sm:flex-row'
}
>
<TipJar />
<div
className={clsx( className={clsx(
'h-5 w-5', 'bg-greyscale-5 absolute rounded-full text-white',
totalTipped > 0 ? 'mr-2' : '', tipDisplay.length > 2
userTipped ? 'fill-teal-500 text-teal-500' : '' ? 'text-[0.4rem] sm:text-[0.5rem]'
: 'text-[0.5rem]'
)} )}
/> >
{totalTipped > 0 && ( {totalTipped > 0 ? tipDisplay : ''}
<div </div>
className={clsx(
'bg-greyscale-5 absolute ml-3.5 mt-2 h-4 w-4 rounded-full align-middle text-white sm:mt-3 sm:h-5 sm:w-5 sm:px-1',
tipDisplay.length > 2
? 'text-[0.4rem] sm:text-[0.5rem]'
: 'sm:text-2xs text-[0.5rem]'
)}
>
{tipDisplay}
</div>
)}
</Col> </Col>
</Button> </Button>
</Tooltip> </Tooltip>