Block Quote

Learn about Blockquote component and how to use it.

Blockquote component highlights the citations of other people's thoughts. Underneath the react component are HTML blockquote and figure tags. This is how the component looks like:

Words can be like X-rays, if you use them properly—they will go through anything. You read and you are pierced.

— Aldous Huxley, Brave New World

Add blockquote

Import the component from blockquote folder:

import { Blockquote } from '../components/blockquote';

Enter the quote value to the children prop, add details about the quote using caption and cite props:

<Blockquote
  caption={<> - Aldous Huxley, <cite>Brave New World</cite></>}
  cite="https://www.huxley.net/bnw/four.html"
>
  Words can be like X-rays, if you use them properly—they will go through anything.
  You read and you are pierced.
</Blockquote>

Customize blockquote style

Adjust blockquote's visual style in the Blockquote.tsx file.