Improve styling for clear image buttons in configPage.html

This commit is contained in:
CodeDevMLH
2026-03-11 01:19:43 +01:00
parent 1b65843b20
commit 81e4643652

View File

@@ -259,7 +259,7 @@
<input type="file" id="overlayImageInput" accept="image/png, image/jpeg, image/gif, image/webp" style="display: none;">
<img id="overlayImagePreview" style="display: none; max-width: 100%; max-height: 150px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 4px; z-index: 2;" />
<!-- A semi-transparent overlay to clear the image -->
<button type="button" id="clearOverlayImageBtn" is="paper-icon-button-light" style="display: none; position: absolute; top: 10px; right: 10px; z-index: 3; color: #a94442;" title="Clear Image">
<button type="button" id="clearOverlayImageBtn" class="clear-btn" is="paper-icon-button-light" style="display: none; position: absolute; top: 10px; right: 10px; z-index: 3; color: #a94442;" title="Clear Image">
<i class="material-icons">delete</i>
</button>
</div>
@@ -1026,7 +1026,7 @@
' <span style="font-size: 0.85em; color: rgba(255,255,255,0.7);">Upload seasonal image</span>' +
' <input type="file" class="seasonal-file-input" accept="image/png, image/jpeg, image/gif, image/webp" style="display: none;">' +
' <img class="seasonal-preview-img" style="display: none; max-width: 100%; max-height: 100%; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 4px; z-index: 2; object-fit: contain;" />' +
' <button type="button" is="paper-icon-button-light" class="seasonal-clear-btn remove-img" title="Clear Image" style="display: none; color: #a94442;"><i class="material-icons">delete</i></button>' +
' <button type="button" is="paper-icon-button-light" class="seasonal-clear-btn remove-img" title="Clear Image" style="display: none; position: absolute; top: 10px; right: 10px; z-index: 3; color: #a94442;"><i class="material-icons">delete</i></button>' +
' </div>' +
' </div>' +
'</div>';