manifold/web/components/info-box.tsx
mantikoros 91bec9c996
Referrals page (#676)
* Referrals page added to sidebar; useSaveReferral; InfoBox

* text color

* eslint

* migrate useUsers hook to react-query (#674)

* Remove bet button from free response comments

* Make answer replies more closely spaced together

* Host Ida and Alex's MTG Guesser game (#656)

* Copy over code from Mtg Guesser

* Run Prettier

* CSS Tweaks: Hover feedback, button positioning

* Hide all but counterspell & burn, for now

* Move to /mtg directory

* Fix prettierignore

* smaller jsons (#673)

limited burn to only red cards and also added limited json files to only have fields needed to play

* Add Ida's tweak to card position

Co-authored-by: marsteralex <bob.masteralex@gmail.com>

* Adjust card positioning

* Make the select screen index.html

* Remove other guessing games

* Remove alternate versions; add Alex's email

* Remove unused jsons

* Small FR comments tweaks

* Spacing tweak

* Changing manalinks table UI (#665)

From table to card view

* Fix comment spacing on non-FR

* Move "Send M$" lower in sidebar More list.

* Move leaderboards up in mobile nav

* eslint

* prettier

Co-authored-by: Sinclair Chen <abc.sinclair@gmail.com>
Co-authored-by: James Grugett <jahooma@gmail.com>
Co-authored-by: Austin Chen <akrolsmir@gmail.com>
Co-authored-by: marsteralex <bob.masteralex@gmail.com>
Co-authored-by: ingawei <46611122+ingawei@users.noreply.github.com>
2022-07-21 14:43:10 -05:00

31 lines
794 B
TypeScript

import clsx from 'clsx'
import { InformationCircleIcon } from '@heroicons/react/solid'
import { Linkify } from './linkify'
export function InfoBox(props: {
title: string
text: string
className?: string
}) {
const { title, text, className } = props
return (
<div className={clsx('rounded-md bg-gray-50 p-4', className)}>
<div className="flex">
<div className="flex-shrink-0">
<InformationCircleIcon
className="h-5 w-5 text-gray-400"
aria-hidden="true"
/>
</div>
<div className="ml-3">
<h3 className="text-sm font-medium text-black">{title}</h3>
<div className="mt-2 text-sm text-black">
<Linkify text={text} />
</div>
</div>
</div>
</div>
)
}