:grin:

[quote=drakinite post_id=474849 time=1605795708 user_id=107828]
This statement does work:
[code]height: ~"calc(100% - (2 * @{innerDlgPadding}))";[/code]
[/quote]

Great! Just used it ;-)

(as I also found that my original suggestion does not work when I tried it later :-) )

height: ~"calc(100% - (2 * @{innerDlgPadding}))";

Oh nice, thanks for the note! I didn't notice that class.

However, Lesscss does its own weird stuff with the calc() function. It evaluates that function and turns it into simply "calc(80%)". See https://github.com/less/less.js/issues/974

This statement does work:
[code]height: ~"calc(100% - (2 * @{innerDlgPadding}))";[/code]

.innerDlg {
    display: block;
    padding: 10px;
}
.innerDlg .dlgArtwork {
    height: ~"calc(100% - 20px)";
}

@innerDlgPadding: 10px;
.innerDlg {
    display: block;
    padding: @innerDlgPadding;
}
.innerDlg .innerDlgHeightWithoutPadding {
    height: calc(100% - (2 * @innerDlgPadding));
}

BTW: instead of style="height: 100%" you can use already existing stretchHeight class (defined in skin_layout.less)

Also this code does not look very clean:

[code].innerDlg {
display: block;
padding: 10px;
}
.innerDlg .dlgArtwork {
height: ~"calc(100% - 20px)";
}[/code]

cleaner would be something like this:

[code]

@innerDlgPadding: 10px;
.innerDlg {
display: block;
padding: @innerDlgPadding;
}
.innerDlg .innerDlgHeightWithoutPadding {
height: calc(100% - (2 * @innerDlgPadding));
}

[/code]

Tracked as https://www.ventismedia.com/mantis/view.php?id=17110

Here's a small improvement to the track info dialog! Originally, the thumbnails for track info did not show up the right size (See the empty space below the artwork), and that's because it's given a raw pixel size that is independent of the rest of the popup.

[img]https://i.imgur.com/roacqZH.png[/img]

Giving it a CSS property of calc(100% - 20px) [because the dialog's inner padding is 10px on the top and bottom) makes it the right size every time.
I gave the artwork a class name of "dlgArtwork" and put the new attribute inside skin_layout.less, and I also had to give its parent div a hardcoded attribute height:100%.
In dlgTrackInfo.js, thumbSize had to be increased so that the resolution of the image is higher, and the code that sets its height and width had to be commented out; except for the width of unknownAA, which had to stay the same.

I think it looks quite a bit better now :slight_smile:
[img]https://i.imgur.com/rLapbN7.png[/img]
[img]https://i.imgur.com/OH9qCHL.png[/img]

dlgTrackInfo.html: https://puu.sh/GOwjF/ec65e924eb.html
dlgTrackInfo.js: https://puu.sh/GOwjT/26ac60220a.js
skin_layout.less: https://puu.sh/GOwld/ea5ba889f3.less

Oh wow, I didn't even realize Git didn't exist until 2005. I had assumed it was much older than that.
(MM was initially created in 2001, back when it was called Songs-DB)

Hi,
That is question for Jiri. I guess Git was not available at time MM started to develop and it worked since with no issues. It is easy to navigate and check changes/revisions and debug for regressions.

So you use Subversion rather than Git? Any reason?

[quote=drakinite post_id=474704 time=1605386255 user_id=107828]
Just wondering, what does SVN stand for?
[/quote] SVN = https://subversion.apache.org/ One of most recent reads https://blog.codota.com/svn-vs-git/ and https://svnvsgit.com/

You're welcome, I'm glad you like them! :grinning:

Just wondering, what does SVN stand for?

I like your changes to the sys buttons!
So I commited the changes to SVN (will be in build 2275) together with your comments.

Thanks for contributing!

Thanks for taking my suggestions; Hopefully there's something that at least works with as many scaling modes as possible. The
0.15px one is definitely ad-hoc, but that's the best I could come up with so far. Also I just saw your reply about the checkboxes - I'm glad you like it! :grinning:
I've also got a new one (I was in the middle of writing it when you replied initially)

Another improvement on skins - The top-right window buttons could only be clicked properly when you mouse over the icons themselves, instead of the entire space that they are contained by. The miniplayer switch button already had a 7px vertical padding that let it be clicked from the entire top bar, so I gave the sysbutton class the same amount of padding (and took away its margins). This makes the window buttons much more easily clickable. In addition, I gave the material design skins some Windows-like hover colors, to make it feel more native.

For some reason, the buttonsContainer class had a "right" attribute of 2px, which meant that you could not click the exit button when dragging the mouse all the way to the top-right corner of the screen (which all other apps can do). Removing that bit of margin makes it much nicer in my opinion. The Black Monkey and Monkey Groove skins could also benefit from a similar hover color, but I'm not as familiar with those designs so I don't know what would look good on those skins. But since I changed skin_mainwindow, they still have better clickability with the modification. :slight_smile:

[img]https://i.imgur.com/TvpfBqB.gif[/img]

windowtitle.html (changes are commented): https://puu.sh/GNwXZ/fe5291750b.html
skin_mainwindow.less (changes are commented): https://puu.sh/GNwQV/4c07829dd5.less
Material Design Dark skin_mainwindow_add.less: https://puu.sh/GNwSV/d277950b6d.less
Material Design skin_mainwindow_add.less: https://puu.sh/GNwQ4/1fc20a76be.less

Oh, jeez, I didn't realize it was possible to scale with values other than 100/125/150/175/200.

At that rate I suppose the best thing that can be done is whatever looks the best on as many scaling values as possible.

Hmm, setting checkBoxSize to even value does not solve anything as the value is same for all scalings (and just internally multiplied by the scaling coeficient) :-/
Your trick with top/left 0.15px seems quite add hoc and also does not work for all the scaling values either (e.g. at 109% it is still a little bit off center), but because 109% is not a common value then I guess I will use it as a temporal workaround for the issue ;-)