temaplte fixes in app and in plugin

This commit is contained in:
IGNY8 VPS (Salman)
2026-01-10 06:17:38 +00:00
parent 975eab46cf
commit 9e785f141c
11 changed files with 311 additions and 173 deletions

View File

@@ -458,34 +458,70 @@ const ContentSectionBlock = ({
{/* Content layout with images */}
<div className="flex flex-col gap-10">
{/* Content before H3 */}
{beforeH3 && (
<div className="content-html prose prose-lg max-w-none text-gray-800 dark:prose-invert">
<div dangerouslySetInnerHTML={{ __html: beforeH3 }} />
</div>
)}
{/* Image section - layout depends on aspect ratio and alignment */}
{hasImage && (
<div className="flex justify-center">
<div className={getImageContainerClass()}>
{/* Square images (left/right aligned) - content and image in same row */}
{aspectRatio === 'square' && (imageAlign === 'left' || imageAlign === 'right') && hasImage ? (
<div className={`flex ${imageAlign === 'right' ? 'flex-row' : 'flex-row-reverse'} gap-8 items-start`}>
{/* Image side (48% width) */}
<div className="w-[48%] flex-shrink-0">
<SectionImageBlock image={image} loading={loading} heading={headingLabel} showPrompt={showDescription} />
</div>
{/* Content side (48% width with auto remaining) */}
<div className="flex-1">
{/* Content before H3 */}
{beforeH3 && (
<div className="content-html prose prose-lg max-w-none text-gray-800 dark:prose-invert">
<div dangerouslySetInnerHTML={{ __html: beforeH3 }} />
</div>
)}
{/* H3 and remaining content */}
{h3AndAfter && (
<div className="content-html prose prose-lg max-w-none text-gray-800 dark:prose-invert">
<div dangerouslySetInnerHTML={{ __html: h3AndAfter }} />
</div>
)}
{/* Fallback if no H3 structure found */}
{!beforeH3 && !h3AndAfter && (
<div className="content-html prose prose-lg max-w-none text-gray-800 dark:prose-invert">
<div dangerouslySetInnerHTML={{ __html: section.bodyHtml }} />
</div>
)}
</div>
</div>
)}
{/* H3 and remaining content */}
{h3AndAfter && (
<div className="content-html prose prose-lg max-w-none text-gray-800 dark:prose-invert">
<div dangerouslySetInnerHTML={{ __html: h3AndAfter }} />
</div>
)}
{/* Fallback if no H3 structure found */}
{!beforeH3 && !h3AndAfter && (
<div className="content-html prose prose-lg max-w-none text-gray-800 dark:prose-invert">
<div dangerouslySetInnerHTML={{ __html: section.bodyHtml }} />
</div>
) : (
<>
{/* Content before H3 */}
{beforeH3 && (
<div className="content-html prose prose-lg max-w-none text-gray-800 dark:prose-invert">
<div dangerouslySetInnerHTML={{ __html: beforeH3 }} />
</div>
)}
{/* Landscape image - full width centered */}
{hasImage && aspectRatio === 'landscape' && (
<div className="flex justify-center">
<div className={getImageContainerClass()}>
<SectionImageBlock image={image} loading={loading} heading={headingLabel} showPrompt={showDescription} />
</div>
</div>
)}
{/* H3 and remaining content */}
{h3AndAfter && (
<div className="content-html prose prose-lg max-w-none text-gray-800 dark:prose-invert">
<div dangerouslySetInnerHTML={{ __html: h3AndAfter }} />
</div>
)}
{/* Fallback if no H3 structure found */}
{!beforeH3 && !h3AndAfter && (
<div className="content-html prose prose-lg max-w-none text-gray-800 dark:prose-invert">
<div dangerouslySetInnerHTML={{ __html: section.bodyHtml }} />
</div>
)}
</>
)}
</div>
</div>