Blockquote
Blockquote
인용문과 선택적 인용 출처(cite)를 표시하는 컴포넌트예요. 긴 문구를 인용할 때 사용해요.
출처: 문서
본문
Usage
import { Blockquote } from '@mantine/core';
import { InfoIcon } from '@phosphor-icons/react';
function Demo() {
const icon = <InfoIcon />;
return (
<Blockquote cite="– Forrest Gump" icon={icon}>
Life is like an npm install – you never know what you are going to get.
</Blockquote>
);
}
Text wrap
textWrap prop으로 text-wrap CSS 속성을 제어할 수 있어요. (wrap, balance 값 지원)
import { Blockquote } from '@mantine/core';
import { InfoIcon } from '@phosphor-icons/react';
function Demo() {
const icon = <InfoIcon />;
return (
<Blockquote cite="– Forrest Gump" icon={icon} textWrap="balance">
Life is like a box of chocolates. You never know what you are gonna get. But whatever you
get, you should make the most of it and enjoy every moment.
</Blockquote>
);
}