Cool, I'll do some searching and see if I can find some suggestions. Thanks again for your helpful pointers!

[quote=tbm72 post_id=513556 time=1696446908 user_id=21024]
Gotcha, that makes sense (I think!) thank you :D I'll have a play around later and experiment.

Would I be wasting my time trying to write some simple code that dynamically resizes the pane height to fit the artwork plus the text for artist/album etc above it?

So for albums with longer titles/artist names etc the div height would increase. My instinct was using something like 'height:auto' or 'fit-content'. Maybe it isn't that simple though?
[/quote]
No prob!
I'm not 100% sure, but I think it would probably be non-trivial to automatically resize the panel height. Definitely possible, but not simple. You'd probably have to deal with edge cases like listening for layout change events and whatnot. I also don't think it can be achieved in CSS alone, sorry.

Gotcha, that makes sense (I think!) thank you :D I'll have a play around later and experiment.

Would I be wasting my time trying to write some simple code that dynamically resizes the pane height to fit the artwork plus the text for artist/album etc above it?

So for albums with longer titles/artist names etc the div height would increase. My instinct was using something like 'height:auto' or 'fit-content'. Maybe it isn't that simple though?

No prob. If you don't know yet how to package an addon, check the main page on https://www.mediamonkey.com/docs/apinew/ (it was copied over from the wiki but my plan is to put everything MM5 addon-related there) - and since the code snippet modifies ArtWindow, put the code in controls/artWindow_add.js.

Thank you so much! I'm an absolute beginner with JS but I'll play around and see what I can do...

// override the ArtWindow constructor
ArtWindow.prototype.override({
    // specifically override the _createlayout function
    _createlayout: function ($super, ...args) {
        // $super will call the function and run all the default code, then after that, you can modify the content of the HTML
        $super(...args);
        let UI = getAllUIElements(this.container);
        UI.artworkLayer.classList.remove('bottom');
        UI.artworkLayer.classList.add('top');
        UI.artwork.classList.remove('bottom');
        UI.artwork.classList.add('top');
        UI.propsLayer.style.top = '';
        UI.propsLayer.style.bottom = '0';
        UI.propsLayer.style.color = 'red';
    }
})

Unfortunately the text & image positioning of the artwork window are hardcoded in the HTML (see controls/artWindow.js, function _createlayout())

But you can override it in JS with an addon. Example:
[code]
// override the ArtWindow constructor
ArtWindow.prototype.override({
// specifically override the _createlayout function
_createlayout: function ($super, ...args) {
// $super will call the function and run all the default code, then after that, you can modify the content of the HTML
$super(...args);
let UI = getAllUIElements(this.container);
UI.artworkLayer.classList.remove('bottom');
UI.artworkLayer.classList.add('top');
UI.artwork.classList.remove('bottom');
UI.artwork.classList.add('top');
UI.propsLayer.style.top = '';
UI.propsLayer.style.bottom = '0';
UI.propsLayer.style.color = 'red';
}
})
[/code]

Or I don't know if it's possible but even better would be to dynamically resize the panel so the album info/text always displays above the artwork without running down onto it?

I'm not an expert with CSS so wondered if there's a simple tweak I could add to align album artwork to the top of the Preview/Playing panel with album info placed underneath it (instead of it being aligned to the bottom as it currently is):

[url=https://ibb.co/GkvXGy7][img]https://i.ibb.co/zbh1Cps/Untitled.jpg[/img][/url]

It just means that for albums with long artist/title fields the text often overruns onto the artwork. I'm sure it's probably a fairly simple edit but I can't seem to do it.