Some findings

[ricewind012]

These are probably my fault, as I am using it on beta.

• "Compatibility" and "Developer" do not have icons in Steam settings:
• "Show on disk" button in screenshot manager has a trash can icon:
• Tabbed browser titlebar is undraggable. No video, as it won't really show anything in this case
• Probably intentional, but overlay buttons do not have text when the "Show toolbar as list view" option is enabled

[yurisuika]

I have recently been on Beta as well since they added :has support, but I have never seen that "Compatibility" section before. Everything there is being shifted one past because of that, but oddly it is not being given the "Controller" icon. What is on that page?

The screenshots button there is new (maybe only in beta right now), that will have to be adjusted. They recently reverted all of the screenshots dialog class names to what they were using before, so we may see more changes with that dialog soon.

I am aware that the browser is undraggable, but keep forgetting to resolve it. Unfortunately, the way I have chosen to design the tabs being in the titlebar means only a certain section can be given draggability, otherwise the tabs are uninteractable. Something changed somewhere along the lines either from my own development of the skin or Steam, and this allotment seems to no longer work as before. It's really an aesthetic choice over usability.

I've never tried to adjust that toolbar option, so I'll look into what is wrong there.

[yurisuika]

There is already a show on disk button on the dialog, so kind of weird they decided to add a duplicate. I might just remove that new one to reduce clutter.

[yurisuika]

So, this is how I guess I set it up to work... I made it so the tabs can extend up to this point, beyond that there are four 38px wide sections for the window controls. there will be normally one spot there where it is draggable.

If you pin the window, the opacity button fills that spot, but if you unpin it, it is no longer draggable from that spot. You can make it draggable again by minimizing the window and restoring it again. I'll see if I can find anything further to resolve that specific issue, but that is not the same as the reduced draggability on the whole. This stems from where the tabs and window controls classes are rooted. The tabs are just being shown above where they normally are, and thus the draggable section has to be reduced to accommodate their presence. Perhaps I can move some classes around with JS and resolve that, but my JS knowledge is very rudimentary. If not, at the least I can address this issue on the README.

[yurisuika]

Good news, moving classes around with JS did solve the draggability issue. There is one caveat in that when the window loads it will take a moment to be moved, but I think this is worth the functionality. I just need to figure out where the desktop popup tabbed browser was being used to ensure the changes are not all broken on there now...

[yurisuika]

I notice your text rendering is very aliased, are you perchance on Linux? That may explain the "Compatibility" tab.

[shdwmtr]

I have recently been on Beta as well since they added :has support, but I have never seen that "Compatibility" section before. Everything there is being shifted one past because of that, but oddly it is not being given the "Controller" icon. What is on that page?

The screenshots button there is new (maybe only in beta right now), that will have to be adjusted. They recently reverted all of the screenshots dialog class names to what they were using before, so we may see more changes with that dialog soon.

I am aware that the browser is undraggable, but keep forgetting to resolve it. Unfortunately, the way I have chosen to design the tabs being in the titlebar means only a certain section can be given draggability, otherwise the tabs are uninteractable. Something changed somewhere along the lines either from my own development of the skin or Steam, and this allotment seems to no longer work as before. It's really an aesthetic choice over usability.

I've never tried to adjust that toolbar option, so I'll look into what is wrong there.

You can use -webkit-app-region: drag || no-drag; to set elements to be able/unable to drag the steam window if you didn't already know.

Cheers.

[yurisuika]

The issue with that is that then the browser tabs cannot be interacted with. The way I had it set up before was that the window controls were positioned absolute with a certain width so the tabs could be interacted with, and the tabs were given a max width minus the space allotted for the controls. But now with the tabs prepended into the titlebar, it all works as intended and even better since then the empty space that was reserved for the opacity button can be used by the tabs when it is not opened.

[yurisuika]

The overlay toolbar has been fixed, and I am currently installing a VM to test if the first issue is a Linux one.

[ricewind012]

What is on that page?

linux stuff for running windows games

so we may see more changes with that dialog soon.

they definitely are not going to do shit with it, I don't think. They have not updated the library/chat since the newest UI update still

The overlay toolbar has been fixed

I think the text should go inside the button, too, but not sure if it's actually supposed to

[yurisuika]

Well after 6 hours and multiple distros later I was finally able to get Steam and SFP to run on an Elementary OS VM. Yeah, I am not wiping my system to install Linux any time soon, my ricing days are comfortably retired to Windows.

I see the aliasing is caused by the skin disabling font smoothing globally, that was from my attempt to figure out how to get webkit font rendering to be improved, but apparently that has no effect on Windows. Anyways that will be removed.

As for the pagelist, before beta :has selector support it would have been impossible to add both linux and windows support in one skin cause the items have no individual classes to go by and instead are captured by ordinal. I will have to rewrite that stuff to use the selector, but if non-beta still hasn't updated chromium then it will be broken there.

As far as the toolbar, those are called "tooltips" as they are shown when below, so I thought it was more appropriate to display them as labels instead of buttons. You can always edit that to your liking.

Anyways that will have to come another day because it is now 3 am.

[ricewind012]

I see the aliasing is caused by the skin disabling font smoothing globally

it was my doing. if it is what I think it is, IIRC you can only control that on macos

As far as the toolbar, those are called "tooltips" as they are shown when below, so I thought it was more appropriate to display them as labels instead of buttons. You can always edit that to your liking.

in normal steam they are buttons (with a fixed width, too), since I have to take some time to guess what the icons actually mean, so tooltips appearing only without text on the buttons makes more sense to me, and so the text will look out of place if placed outside the buttons (They do not look like tooltips, anyway)

as for linux support, in js you can do something like this:

if (navigator.userAgent.includes("Linux")) {
  document.documentElement.classList.add("Linux");
}

Anyways that will have to come another day because it is now 3 am.

you have been making commits 20 minutes after this, what a lie

[yurisuika]

I'm just saying that is what Valve named their class, they are the same class that is shown below the buttons as a tooltip when the toolbar is on the bottom. When on the side, they are repurposed to be placed within the button. The way that I've been doing iconed buttons in the skin, there has been consistent padding with the text, with the icon leftmost. Or, all centered with additional padding for equiareal buttons. Since we have a nice long list of buttons here, all with different text lengths, doing so would result in buttons that were all different sized or were equiareal but had icons all in different places. I don't think either of these choices would have looked as pleasant and organized as the this present way. That or we all have left justified equiareal buttons, tis another option. I personally thought it looked cleaner, but I think as long as the buttons are equiareal that is the prime directive.

Ah well that is good to know about the UA method, this is my only experience with JS ever so I was unaware. I will see to be able to use that then.

20 minutes is a very short amount of time to finish up, but I had to take the opportunity while two friends were playing the same game to start to skin grouped friends while they were still playing, as I have had that setting disabled since time immemorial. If it werent for the linux VM resetting my friends settings, I might have never known that existed haha.

[ricewind012]

one more thing, the linux icon is not styled & recent activity button icon isn't centered (probably because of the linux button): the button itself, if important:

[yurisuika]

ah cool, well I'll be able to finish up this stuff later today... some of the other pagelist menus similar to the settings might be broken as well, like game properties

[yurisuika]

The settings pagelist is done now, that button is done... I know at least the game properties pagelist needs a fix for this as well, I'll see how many other places the OSes diverge. I have a question though, are some of your button icons broken on Linux? Ones that use font glyphs instead of base64 images. I noticed this was happening on non-beta so I assume it is the old version of Chromium, but Linux says its the same build as I have on Windows.

[yurisuika]

Well I think all of those issues are resolved, asides from those font glyphs, but one of my goals is to redo all icons as SVGs or something scalable. But if you have any more Linux or general issues just let me know.

[ricewind012]

I have a question though, are some of your button icons broken on Linux? Ones that use font glyphs instead of base64 images.

it's fine (still on beta):

But if you have any more Linux or general issues just let me know.

in friends list this has a text cursor instead of a pointer on hover: and this is misaligned, I think ? probably due to my fonts being aliased in group chat notification settings this shadow on scrolling is not used anywhere else: on smallest sidebar size, the searchbar doesn't have the right border:

I think that is all. I have probably paid more attention to this than my own skin now

[yurisuika]

For some reason on the old version, the glyph codes are shifted around and don't match up and its not even a consistent offset. I had no success in getting Steam to run on straight up Ubuntu, on Elementary OS I could with the Snap version but that one had issues of its own, now trying Pop!_OS never tried before but asides from missing 32 bit libraries when using SFP, Flatpak version runs fine there, probably my best experience yet. Still, I am getting those shifted glyphs. Maybe the beta version is not truly on the newer chromium version for some reason.

As for the friends window, those fixes are in place now.

The group chat settings stuff seems to be new, along with the friends list settings dialog, which isn't exactly the same stuff from the main settings dialog. That will take a bit more time to fix up.

I can't seem to replicate the search size issue, but I'll apply a min width to it and hopefully that will resolve it. Seems yours is still 256px at the smallest size but that is happening.

[yurisuika]

Wow man that is a pretty crazy theme, are you making like GTK themes and stuff to look like 95 as well?

[ricewind012]

The group chat settings stuff seems to be new, along with the friends list settings dialog

the opposite way, actually, it has not been updated since 2018/2019, or so, IIRC (Or rather it has not been updated for the new steam UI)

Maybe the beta version is not truly on the newer chromium version for some reason.

you can see its version by doing navigator.userAgent in the console. if it's not there, try doing it in the SharedJSContext console

I can't seem to replicate the search size issue, but I'll apply a min width to it and hopefully that will resolve it.

that did it !

Wow man that is a pretty crazy theme, are you making like GTK themes and stuff to look like 95 as well?

no, Chicago95 exists already, fortunately, fuck gtk.

I only do web stuff, at least for now. If you saw the screenshot from the repo, then it's pretty old. I abandoned these themes for a better base to work from, since I have a lot of duplicate code, etc.

Planning a discord theme and currently working on a chrome devtools one. If you go to localhost:8080, you can see the "DevTools" thing if you have one devtools window open, you can also theme that. But it requires that you inject the CSS in all shadow DOMs, because google. Currently working on that one, too, and I almost succeeded. Chrome extensions have a chrome.devtools.panels.applyStyleSheet api, but even that doesn't apply anywhere (at least for the settings checkboxes)