This commit is contained in:
Tomas Dvorak
2025-05-29 10:44:51 +02:00
parent 47c995b449
commit dbff8964c4
+27 -22
View File
@@ -1900,22 +1900,6 @@ function updateBannerPreview() {
</a>`; </a>`;
} }
// Create text content with template styles
const textStyle = `
font-size: ${document.getElementById('bannerFontSize')?.value || '16'}px;
color: ${document.getElementById('bannerTextColor')?.value || '#000'};
text-align: ${document.getElementById('bannerTextAlign')?.value || 'left'};
margin: 0;
padding: 10px 0;
line-height: 1.5;
${template?.textStyle || ''}
`;
const textElement = `
<div class="banner-text" style="${textStyle}">
${bannerTextContent}
</div>`;
// Get all styles from template or use defaults // Get all styles from template or use defaults
const styles = { const styles = {
// Background styles // Background styles
@@ -1937,6 +1921,23 @@ function updateBannerPreview() {
containerStyle: template.containerStyle || '' containerStyle: template.containerStyle || ''
}; };
// Create text content with template styles
const textStyle = `
font-size: ${document.getElementById('bannerFontSize')?.value || '16'}px;
color: ${document.getElementById('bannerTextColor')?.value || '#000'};
text-align: ${document.getElementById('bannerTextAlign')?.value || 'left'};
margin: 0;
padding: 10px 0;
line-height: 1.5;
${template?.textStyle || ''}
`;
// Create a single text element
const textElement = `
<div class="banner-text" style="${textStyle}">
${bannerTextContent}
</div>`;
// Special handling for specific templates // Special handling for specific templates
if (currentTemplate === 'dark') { if (currentTemplate === 'dark') {
styles.background = '#2d3748'; styles.background = '#2d3748';
@@ -1973,18 +1974,22 @@ function updateBannerPreview() {
margin: 0 auto; margin: 0 auto;
"> ">
${imagePosition === 'left' || imagePosition === 'top' ? imgContainer : ''} ${imagePosition === 'left' || imagePosition === 'top' ? imgContainer : ''}
<div style="flex: 1;"> <div style="flex: 1; width: 100%;">
${textElement} ${textElement}
</div> </div>
${imagePosition === 'right' || imagePosition === 'bottom' ? imgContainer : ''} ${imagePosition === 'right' || imagePosition === 'bottom' ? imgContainer : ''}
</div>`; </div>`;
// Show the image preview in the container // Show the image preview in the container
if (imagePreview && imagePreviewContainer) { const bannerImagePreview = document.getElementById('bannerImagePreview');
imagePreview.src = currentImage; if (bannerImagePreview) {
imagePreview.style.width = '100%'; bannerImagePreview.src = currentImage;
imagePreview.style.height = 'auto'; bannerImagePreview.style.width = '100%';
imagePreview.style.maxHeight = '200px'; bannerImagePreview.style.height = 'auto';
bannerImagePreview.style.maxHeight = '200px';
bannerImagePreview.style.display = 'block';
}
if (imagePreviewContainer) {
imagePreviewContainer.style.display = 'block'; imagePreviewContainer.style.display = 'block';
} }