diff --git a/admin-dashboard.html b/admin-dashboard.html
index 21670cf..d656865 100644
--- a/admin-dashboard.html
+++ b/admin-dashboard.html
@@ -693,16 +693,20 @@
-
-
- Pro vlastní umístění klikněte a táhněte obrázek v náhledu
-
+
+
+
+
+
+
+
+
+
+
-
-
@@ -1303,6 +1307,10 @@ function updateBannerPreview() {
const imageX = currentImageX || '0';
const imageY = currentImageY || '0';
+ // Get image dimensions
+ const imageWidth = parseInt(document.getElementById('bannerImageWidth')?.value || '200');
+ const imageHeight = parseInt(document.getElementById('bannerImageHeight')?.value || '200');
+
// Update banner container styles to exactly match index.html
bannerPreview.style.display = 'block';
bannerPreview.style.width = '100%';
@@ -1345,10 +1353,6 @@ function updateBannerPreview() {
// Apply the same border radius to the image as to the container
const imageRadius = Math.max(bannerBorderRadius, 0);
- // Get image dimensions
- const imageWidth = parseInt(document.getElementById('bannerImageWidth')?.value || '100');
- const imageHeight = parseInt(document.getElementById('bannerImageHeight')?.value || '200');
-
// Determine image style based on position - exactly match index.html
let imageStyle = `max-width: ${imageWidth}px; max-height: ${imageHeight}px; border-radius: ${imageRadius}px;`;
let containerStyle = 'margin-bottom: 15px;';
@@ -1360,14 +1364,14 @@ function updateBannerPreview() {
case 'right':
containerStyle += 'text-align: right; float: right; margin-left: 15px;';
break;
+ case 'center':
+ containerStyle += 'text-align: center; display: block; margin: 0 auto;';
+ break;
case 'custom':
containerStyle += 'position: relative;';
// For custom position, use absolute positioning to ensure exact placement
imageStyle += `position: absolute; left: ${imageX}px; top: ${imageY}px;`;
break;
- default: // center
- containerStyle += 'text-align: center; display: block;';
- break;
}
// Format content with image exactly like in index.html
@@ -1406,6 +1410,20 @@ function updateBannerPreview() {
bannerPreview.classList.remove('with-image');
}
+ // Update the preview content
+ bannerPreviewContent.innerHTML = content;
+
+ // Add event listeners for width/height changes
+ const imageWidthInput = document.getElementById('bannerImageWidth');
+ const imageHeightInput = document.getElementById('bannerImageHeight');
+
+ if (imageWidthInput) {
+ imageWidthInput.addEventListener('input', updateBannerPreview);
+ }
+ if (imageHeightInput) {
+ imageHeightInput.addEventListener('input', updateBannerPreview);
+ }
+
// Wrap in link if provided - exactly match index.html but prevent clicks
if (bannerLink) {
content = `