diff --git a/src/components/Token/CenteredTextBlock/index.tsx b/src/components/Token/CenteredTextBlock/index.tsx new file mode 100644 index 000000000..b50edf492 --- /dev/null +++ b/src/components/Token/CenteredTextBlock/index.tsx @@ -0,0 +1,39 @@ +import { Container, Typography } from '@mui/material' +import { type BaseBlockEntry } from '@/config/types' +import RichText from '@/components/common/RichText' +import layoutCss from '@/components/common/styles.module.css' +import css from './styles.module.css' +import ButtonsWrapper from '@/components/Token/ButtonsWrapper' +import { isEntryTypeButton } from '@/lib/typeGuards' + +const CenteredTextBlock = (props: BaseBlockEntry) => { + const { caption, title, text, buttons } = props.fields + + const buttonsList = buttons?.filter(isEntryTypeButton) || [] + + return ( + + {caption} + +
+
+ +
+ + {text && ( +
+ +
+ )} +
+ + {buttonsList.length > 0 && ( +
+ +
+ )} +
+ ) +} + +export default CenteredTextBlock diff --git a/src/components/Token/CenteredTextBlock/styles.module.css b/src/components/Token/CenteredTextBlock/styles.module.css new file mode 100644 index 000000000..505441562 --- /dev/null +++ b/src/components/Token/CenteredTextBlock/styles.module.css @@ -0,0 +1,22 @@ +.title { + margin-top: 16px; +} + +.text { + margin: 24px auto 0; + max-width: 725px; +} + +.text p { + margin: 0; +} + +.buttons { + margin-top: 40px; +} + +@media (min-width: 900px) { + .title { + text-align: center; + } +}