34 lines
761 B
TypeScript
34 lines
761 B
TypeScript
import { graphql } from "@/gql";
|
|
import { type FactBoxBlockFragment } from "@/gql/graphql";
|
|
import styles from "./factBoxBlock.module.scss";
|
|
|
|
const FactBoxBlockFragmentDefinition = graphql(`
|
|
fragment FactBoxBlock on FactBoxBlock {
|
|
backgroundColor
|
|
factBoxBody: body
|
|
}
|
|
`);
|
|
|
|
export const FactBoxBlock = ({
|
|
block,
|
|
}: {
|
|
block: FactBoxBlockFragment;
|
|
}) => {
|
|
if (!block.factBoxBody) {
|
|
return <></>;
|
|
}
|
|
return (
|
|
<section className={styles.factBoxWrapper}>
|
|
<div
|
|
className={styles.factBox}
|
|
data-background-color={block.backgroundColor ?? ""}
|
|
>
|
|
<div
|
|
className={styles.factBoxContent}
|
|
dangerouslySetInnerHTML={{ __html: block.factBoxBody }}
|
|
/>
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|