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

qr codes!

Browse Source
This commit is contained in:
mantikoros 2022-08-04 12:25:51 -07:00
parent 8b4bd64421
commit 40b7877f1d
2 changed files with 34 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/components/challenges/create-challenge-button.tsx
View File

@ -16,6 +16,7 @@ import { SiteLink } from 'web/components/site-link'
import { formatMoney } from 'common/util/format' import { formatMoney } from 'common/util/format'
import { Spacer } from '../layout/spacer' import { Spacer } from '../layout/spacer'
import { NoLabel, YesLabel } from '../outcome-label' import { NoLabel, YesLabel } from '../outcome-label'
import { QRCode } from '../qr-code'
type challengeInfo = { type challengeInfo = {
amount: number amount: number
@ -240,6 +241,7 @@ function CreateChallengeForm(props: {
toastClassName={'-left-40 -top-20 mt-1'} toastClassName={'-left-40 -top-20 mt-1'}
icon={DuplicateIcon} icon={DuplicateIcon}
/> />
<QRCode url={highlightedSlug} className="self-center" />
<Row className={'gap-1 text-gray-500'}> <Row className={'gap-1 text-gray-500'}>
See your other See your other
<SiteLink className={'underline'} href={'/challenges'}> <SiteLink className={'underline'} href={'/challenges'}>

48
web/pages/challenges/index.tsx
View File

@ -24,9 +24,10 @@ import { Avatar } from 'web/components/avatar'
import Router from 'next/router' import Router from 'next/router'
import { contractPathWithoutContract } from 'web/lib/firebase/contracts' import { contractPathWithoutContract } from 'web/lib/firebase/contracts'
import { Button } from 'web/components/button' import { Button } from 'web/components/button'
import { ClipboardCopyIcon } from '@heroicons/react/outline' import { ClipboardCopyIcon, QrcodeIcon } from '@heroicons/react/outline'
import { copyToClipboard } from 'web/lib/util/copy' import { copyToClipboard } from 'web/lib/util/copy'
import toast from 'react-hot-toast' import toast from 'react-hot-toast'
import { contractDetailsButtonClassName } from 'web/components/contract/contract-info-dialog'
dayjs.extend(customParseFormat) dayjs.extend(customParseFormat)
const columnClass = 'sm:px-5 px-2 py-3.5 max-w-[100px] truncate' const columnClass = 'sm:px-5 px-2 py-3.5 max-w-[100px] truncate'
@ -120,21 +121,36 @@ function YourLinkSummaryRow(props: { challenge: Challenge }) {
'text-center sm:max-w-[200px] sm:text-start' 'text-center sm:max-w-[200px] sm:text-start'
)} )}
> >
<Button <Row className="items-center">
color={'gray-white'} <Button
onClick={() => { color="gray-white"
copyToClipboard(getChallengeUrl(challenge)) size="xs"
toast('Link copied to clipboard!') onClick={() => {
}} copyToClipboard(getChallengeUrl(challenge))
> toast('Link copied to clipboard!')
<ClipboardCopyIcon className={'h-5 w-5 sm:h-4 sm:w-4'} /> }}
</Button> >
<SiteLink <ClipboardCopyIcon className={'h-5 w-5 sm:h-4 sm:w-4'} />
href={getChallengeUrl(challenge)} </Button>
className={'mx-1 mb-1 hidden sm:inline-block'} <Button
> color="gray-white"
{`...${challenge.contractSlug}/${challenge.slug}`} size="xs"
</SiteLink> onClick={() => {
const qrUrl = `https://api.qrserver.com/v1/create-qr-code/?size=${200}x${200}&data=${getChallengeUrl(
challenge
)}`
window.location.href = qrUrl
}}
>
<QrcodeIcon className="h-5 w-5 sm:h-4 sm:w-4" />
</Button>
<SiteLink
href={getChallengeUrl(challenge)}
className={'mx-1 mb-1 hidden sm:inline-block'}
>
{`...${challenge.contractSlug}/${challenge.slug}`}
</SiteLink>
</Row>
</td> </td>
<td className={columnClass}> <td className={columnClass}>