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

Play with using 3 icons for 1-click usage

Browse Source
This commit is contained in:
Austin Chen 2022-05-21 11:58:22 -07:00
parent c5660ab762
commit 3d368216b2
1 changed files with 28 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
web/components/contract/contract-card.tsx
View File

@ -27,6 +27,12 @@ import {
import { getOutcomeProbability, getTopAnswer } from 'common/calculate'
import { AbbrContractDetails } from './contract-details'
import { getExpectedValue, getValueFromBucket } from 'common/calculate-dpm'
import {
ArrowCircleUpIcon,
ArrowCircleDownIcon,
StarIcon,
PaperAirplaneIcon,
} from '@heroicons/react/outline'
// Return a number from 0 to 1 for this contract
// Resolved contracts are set to 1, for coloring purposes (even if NO)
@ -135,6 +141,28 @@ export function ContractCard(props: {
/>
)}
{/* Show a row with 3 clickable icons: star, upvote, downvote */}
<div className="grid grid-cols-3">
<PaperAirplaneIcon
className={clsx(
'mx-auto h-5 w-5',
contract.createdTime % 3 == 0 ? 'text-primary' : 'text-gray-400'
)}
/>
<StarIcon
className={clsx(
'mx-auto h-5 w-5',
contract.createdTime % 3 == 1 ? 'text-blue-400' : 'text-gray-400'
)}
/>
<PaperAirplaneIcon
className={clsx(
'mx-auto h-5 w-5 rotate-180',
contract.createdTime % 3 == 2 ? 'text-red-400' : 'text-gray-400'
)}
/>
</div>
<div
className={clsx(
'absolute right-0 top-0 w-2 rounded-tr-md',