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

Use triangles instead of planes

Browse Source
This commit is contained in:
Austin Chen 2022-05-21 14:33:10 -07:00
parent 1b17d3a102
commit fd49ccea39
3 changed files with 37 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -27,8 +27,8 @@ import {
import { getOutcomeProbability, getTopAnswer } from 'common/calculate'
import { AvatarDetails, MiscDetails } from './contract-details'
import { getExpectedValue, getValueFromBucket } from 'common/calculate-dpm'
import { PaperAirplaneIcon } from '@heroicons/react/outline'
import { PaperAirplaneIcon as SolidPlaneIcon } from '@heroicons/react/solid'
import TriangleIcon from 'web/lib/icons/triangle-icon'
import TriangleFillIcon from 'web/lib/icons/triangle-fill-icon'
// Return a number from 0 to 1 for this contract
// Resolved contracts are set to 1, for coloring purposes (even if NO)
@ -128,11 +128,11 @@ export function ContractCard(props: {
<Col className="gap-2">
{contract.createdTime % 3 == 0 ? (
<SolidPlaneIcon
className={clsx('mx-auto h-6 w-6', `text-${color}`)}
<TriangleFillIcon
className={clsx('mx-auto h-5 w-5', `text-${color}`)}
/>
) : (
<PaperAirplaneIcon className="mx-auto h-6 w-6 text-gray-400" />
<TriangleFillIcon className="mx-auto h-5 w-5 text-gray-200" />
)}
{outcomeType === 'BINARY' && (
@ -158,11 +158,11 @@ export function ContractCard(props: {
)}
{contract.createdTime % 3 == 2 ? (
<SolidPlaneIcon
className={clsx('mx-auto h-6 w-6 rotate-180', `text-${color}`)}
<TriangleFillIcon
className={clsx('mx-auto h-5 w-5 rotate-180', `text-${color}`)}
/>
) : (
<PaperAirplaneIcon className="mx-auto h-6 w-6 rotate-180 text-gray-400" />
<TriangleFillIcon className="mx-auto h-5 w-5 rotate-180 text-gray-200" />
)}
</Col>
</Row>

16
web/lib/icons/triangle-fill-icon.tsx Normal file
View File

@ -0,0 +1,16 @@
// Icon from Bootstrap: https://icons.getbootstrap.com/
export default function TriangleFillIcon(props: { className?: string }) {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
fill="currentColor"
className={props.className}
viewBox="0 0 16 16"
>
<path
fill-rule="evenodd"
d="M7.022 1.566a1.13 1.13 0 0 1 1.96 0l6.857 11.667c.457.778-.092 1.767-.98 1.767H1.144c-.889 0-1.437-.99-.98-1.767L7.022 1.566z"
/>
</svg>
)
}

13
web/lib/icons/triangle-icon.tsx Normal file
View File

@ -0,0 +1,13 @@
// Icon from Bootstrap: https://icons.getbootstrap.com/
export default function TriangleIcon(props: { className?: string }) {
return (
<svg
xmlns="http://www.w3.org/2000/svg"
fill="currentColor"
className={props.className}
viewBox="0 0 16 16"
>
<path d="M7.938 2.016A.13.13 0 0 1 8.002 2a.13.13 0 0 1 .063.016.146.146 0 0 1 .054.057l6.857 11.667c.036.06.035.124.002.183a.163.163 0 0 1-.054.06.116.116 0 0 1-.066.017H1.146a.115.115 0 0 1-.066-.017.163.163 0 0 1-.054-.06.176.176 0 0 1 .002-.183L7.884 2.073a.147.147 0 0 1 .054-.057zm1.044-.45a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566z" />
</svg>
)
}