dwindown/WooNooW
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: refine dynamic page sections, fix renderers, improve styling controls and editor schema

Browse Source
This commit is contained in:
Dwindi Ramadhana
2026-06-11 21:24:57 +07:00
parent 54a3a15f68
commit ec2049913f
33 changed files with 1032 additions and 822 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
customer-spa/src/pages/DynamicPage/sections/ImageTextSection.tsx
View File

@@ -24,7 +24,8 @@ export function ImageTextSection({
cta_url,
elementStyles,
styles,
}: ImageTextSectionProps & { styles?: Record<string, any>, cta_text?: string, cta_url?: string }) {
isEditor,
}: ImageTextSectionProps & { styles?: Record<string, any>, cta_text?: string, cta_url?: string, isEditor?: boolean }) {
const isImageRight = layout === 'image-right' || layout === 'right';
// Helper to get text styles (including font family)
@@ -58,28 +59,14 @@ export function ImageTextSection({
const sectionBg = getSectionBackground(styles);
// Height preset support
const heightPreset = styles?.heightPreset || 'default';
const heightMap: Record<string, string> = {
'default': 'py-12 md:py-24',
'small': 'py-8 md:py-16',
'medium': 'py-16 md:py-32',
'large': 'py-24 md:py-48',
'fullscreen': 'min-h-screen py-20 flex items-center',
};
const heightClasses = heightMap[heightPreset] || 'py-12 md:py-24';
return (
<section
<div
id={id}
className={cn(
'wn-section wn-image-text relative overflow-hidden w-full',
`wn-scheme--${colorScheme}`,
!styles?.paddingTop && !styles?.paddingBottom && heightClasses
'wn-section wn-image-text relative w-full',
`wn-scheme--${colorScheme}`
)}
style={sectionBg.style}
>
<SectionBackgroundRenderer bg={sectionBg} />
<SharedContentLayout
title={title}
text={text}
@@ -90,16 +77,14 @@ export function ImageTextSection({
titleClassName={titleStyle.classNames}
textStyle={textStyle.style}
textClassName={textStyle.classNames}
imageStyle={{
backgroundColor: imageStyle.backgroundColor,
objectFit: imageStyle.objectFit,
}}
imageStyle={imageStyle}
cardStyle={{ backgroundColor: styles?.cardBackgroundColor }}
buttons={cta_text && cta_url ? [{ text: cta_text, url: cta_url }] : []}
buttonStyle={{
classNames: buttonStyle.classNames,
style: buttonStyle.style
}}
/>
</section>
</div>
);
}