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

Replace DaisyUI buttons with TailwindUI buttons

Browse Source 
Maybe this should use the button component...? But that's styled differently, the rest of /create uses standard TailwindUI
This commit is contained in:
Austin Chen 2022-08-11 20:54:03 -07:00
parent e2eae01ad8
commit 7ad8af848a
1 changed files with 10 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
web/components/answers/multiple-choice-answers.tsx
View File

@ -3,6 +3,7 @@ import Textarea from 'react-expanding-textarea'
import { XIcon } from '@heroicons/react/solid' import { XIcon } from '@heroicons/react/solid'
import { Col } from '../layout/col' import { Col } from '../layout/col'
import { Row } from '../layout/row' import { Row } from '../layout/row'
import { Button } from '../button'
export function MultipleChoiceAnswers(props: { export function MultipleChoiceAnswers(props: {
answers: string[] answers: string[]
@ -25,7 +26,7 @@ export function MultipleChoiceAnswers(props: {
return ( return (
<Col> <Col>
{answers.map((answer, i) => ( {answers.map((answer, i) => (
<Row className="mb-2 items-center align-middle"> <Row className="mb-2 items-center gap-2 align-middle">
{i + 1}.{' '} {i + 1}.{' '}
<Textarea <Textarea
value={answer} value={answer}
@ -37,17 +38,22 @@ export function MultipleChoiceAnswers(props: {
/> />
{answers.length > 2 && ( {answers.length > 2 && (
<button <button
className="-mr-2 rounded p-2"
onClick={() => removeAnswer(i)} onClick={() => removeAnswer(i)}
type="button"
className="inline-flex items-center rounded-full border border-gray-300 bg-white p-1 text-xs font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
> >
<XIcon className="h-5 w-5 flex-shrink-0" /> <XIcon className="h-5 w-5" aria-hidden="true" />
</button> </button>
)} )}
</Row> </Row>
))} ))}
<Row className="justify-end"> <Row className="justify-end">
<button className="btn btn-outline btn-xs" onClick={addAnswer}> <button
type="button"
onClick={addAnswer}
className="inline-flex items-center rounded border border-gray-300 bg-white px-2.5 py-1.5 text-xs font-medium text-gray-700 shadow-sm hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2"
>
Add answer Add answer
</button> </button>
</Row> </Row>