54 lines
1.3 KiB
JavaScript
54 lines
1.3 KiB
JavaScript
import { useBlockProps, RichText, InnerBlocks } from "@wordpress/block-editor";
|
|
export default function save({ attributes }) {
|
|
const {
|
|
disposition,
|
|
coverUrl,
|
|
coverAlt,
|
|
coverSize,
|
|
backgroundColor,
|
|
hasBackgroundColor,
|
|
backgroundOrientation,
|
|
blockWidth,
|
|
} = attributes;
|
|
return (
|
|
<section
|
|
{...useBlockProps.save({
|
|
className: `deligraph-blocks-chapter-section chapter-section chapter-section--${disposition} ${
|
|
backgroundColor ? "chapter-section--has-background" : ""
|
|
} ${
|
|
blockWidth === "full"
|
|
? "chapter-section--width-full"
|
|
: "chapter-section--width-contained"
|
|
}`,
|
|
})}
|
|
>
|
|
{hasBackgroundColor && backgroundColor && (
|
|
<svg
|
|
className={`chapter-section__background chapter-section__background--${backgroundOrientation}`}
|
|
width="1302"
|
|
height="654"
|
|
viewBox="0 0 1302 654"
|
|
preserveAspectRatio="none"
|
|
>
|
|
<path
|
|
d="M1302 0L0 15.8281V654L1302 642.633L1302 0Z"
|
|
fill={backgroundColor}
|
|
/>
|
|
</svg>
|
|
)}
|
|
<div className="chapter-section__content">
|
|
<div className="chapter-section__innerblocks">
|
|
<InnerBlocks.Content />
|
|
</div>
|
|
</div>
|
|
{coverUrl && (
|
|
<img
|
|
className={`chapter-section__cover chapter-section__cover--${coverSize}`}
|
|
src={coverUrl}
|
|
alt={coverAlt}
|
|
/>
|
|
)}
|
|
</section>
|
|
);
|
|
}
|