sr2/link-stack
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Flatten

Browse source
This commit is contained in:
Darren Clarke 2023-08-25 07:11:33 +00:00
parent 8f165d15d2
commit c620e4bf25
264 changed files with 9983 additions and 2280 deletions
Download patch file Download diff file Expand all files Collapse all files

80
apps/leafcutter/app/_components/Question.tsx
View file

@ -1,80 +0,0 @@
"use client";
import { FC, useState } from "react";
import ReactMarkdown from "react-markdown";
import {
Grid,
Box,
Accordion,
AccordionSummary,
AccordionDetails,
} from "@mui/material";
import {
ChevronRight as ChevronRightIcon,
ExpandMore as ExpandMoreIcon,
Circle as CircleIcon,
} from "@mui/icons-material";
import { useAppContext } from "./AppProvider";
interface QuestionProps {
question: string;
answer: string;
}
export const Question: FC<QuestionProps> = ({ question, answer }) => {
const [expanded, setExpanded] = useState(false);
const {
colors: { lavender, darkLavender },
typography: { h5, p },
} = useAppContext();
return (
<Accordion
expanded={expanded}
onChange={() => setExpanded(!expanded)}
elevation={0}
sx={{ "::before": { display: "none" } }}
>
<AccordionSummary>
<Grid
container
direction="row"
justifyContent="space-between"
sx={{ maxWidth: 500 }}
>
<Box component="h5" sx={h5}>
<CircleIcon
sx={{
fontSize: 14,
color: expanded ? darkLavender : lavender,
mr: 1,
mb: "-2px",
}}
/>
{question}
</Box>
{expanded ? (
<ExpandMoreIcon
htmlColor={lavender}
fontSize="medium"
sx={{ mt: "2px" }}
/>
) : (
<ChevronRightIcon
htmlColor={lavender}
fontSize="medium"
sx={{ mt: "4px" }}
/>
)}
</Grid>
</AccordionSummary>
<AccordionDetails sx={{ border: 0 }}>
<Box
sx={{ ...p, p: 2, border: `1px solid ${lavender}`, borderRadius: 3 }}
>
<ReactMarkdown>{answer}</ReactMarkdown>
</Box>
</AccordionDetails>
</Accordion>
);
};