fix: add JavaScript function to force image scaling override CSS conflicts
This commit is contained in:
parent
3d1f189293
commit
9c5accc503
@ -97,26 +97,37 @@
|
||||
height: 50px !important;
|
||||
overflow: hidden;
|
||||
}
|
||||
.plyr__preview-thumb__image-container img,
|
||||
div.plyr__preview-thumb__image-container img {
|
||||
width: 89px !important;
|
||||
height: 50px !important;
|
||||
object-fit: cover !important;
|
||||
min-width: unset !important;
|
||||
min-height: unset !important;
|
||||
transform: none !important;
|
||||
left: 0 !important;
|
||||
top: 0 !important;
|
||||
.plyr__preview-thumb__image-container img {
|
||||
transform: scale(0.35) !important;
|
||||
transform-origin: top left !important;
|
||||
}
|
||||
`;
|
||||
document.head.appendChild(style);
|
||||
console.log('Custom styles added for preview thumb image container');
|
||||
}
|
||||
|
||||
// Function to continuously update image scale to ensure it takes effect
|
||||
function updateImageScale() {
|
||||
const images = document.querySelectorAll('.plyr__preview-thumb__image-container img');
|
||||
images.forEach(img => {
|
||||
if (!img.style.transform || !img.style.transform.includes('scale(0.35)')) {
|
||||
img.style.setProperty('transform', 'scale(0.35)', 'important');
|
||||
img.style.setProperty('transform-origin', 'top left', 'important');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Run the sort function after the DOM content has loaded
|
||||
window.addEventListener('load', function() {
|
||||
addCustomStyles();
|
||||
addSortButton();
|
||||
sortAllVideos();
|
||||
|
||||
// Periodically update image scale to ensure it takes effect
|
||||
setInterval(updateImageScale, 1000);
|
||||
|
||||
// Also update immediately
|
||||
setTimeout(updateImageScale, 100);
|
||||
setTimeout(updateImageScale, 500);
|
||||
})
|
||||
})();
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user