const App = () => {
const fixtureData = [
{
question: 'How do I render a single paragraph?',
answer: (
<p>
Vestibulum at dolor justo.{' '}
<InlineLink
href="https://www.github.com"
target="_blank"
rel="noreferrer"
>
Curabitur
</InlineLink>{' '}
dictum feugiat elit, vitae vestibulum orci vestibulum sed. Donec
interdum ligula at nisi rhoncus malesuada et non eros.
</p>
),
},
{
question: 'What about multiple paragraphs?',
answer: (
<React.Fragment>
<p>
Vestibulum at dolor justo.{' '}
<InlineLink
href="https://www.github.com"
target="_blank"
rel="noreferrer"
>
Curabitur
</InlineLink>{' '}
dictum feugiat elit, vitae vestibulum orci vestibulum sed. Donec
interdum ligula at nisi rhoncus malesuada et non eros.
</p>
<p>
Pellentesque habitant morbi tristique senectus et netus et malesuada
fames ac turpis egestas.
</p>
</React.Fragment>
),
},
{
question: 'Can I render a React Fragment?',
answer: (
<React.Fragment>
<p>
Vestibulum at dolor justo.{' '}
<InlineLink
href="https://www.github.com"
target="_blank"
rel="noreferrer"
>
Curabitur
</InlineLink>{' '}
dictum feugiat elit, vitae vestibulum orci vestibulum sed. Donec
interdum ligula at nisi rhoncus malesuada et non eros.
</p>
<ol>
<li>
<Text size="300" variant="muted">
Must be associated with a current GitHub for Startups partner.
</Text>
</li>
<li>
<Text size="300" variant="muted">
Self-funded or funded (Seed-Series A)
</Text>
</li>
<li>
<Text size="300" variant="muted">
Not a current GitHub Enterprise customer
</Text>
</li>
<li>
<Text size="300" variant="muted">
Must not have previously received credits for GitHub Enterprise
</Text>
</li>
</ol>
</React.Fragment>
),
},
]
return (
<FAQ>
<FAQ.Heading>Frequently asked questions</FAQ.Heading>
<>
{fixtureData.map(({question, answer}) => {
return (
<FAQ.Item key={question} open={false}>
<FAQ.Question>{question}</FAQ.Question>
<FAQ.Answer>{answer}</FAQ.Answer>
</FAQ.Item>
)
})}
</>
</FAQ>
)
}
render(<App />)