Beta: Interface Changes

[Foldex]

Latest Beta dropped, bringing with it a number of changes.
Unfortunately has some loss of functionality associated on our end, seems Valve likes making it hard on skin makers.
Regardless, seems like supporting this will involve some significant changes.

• VGUI is kill, along with the ability to select skins at all. Entirely Web based UI now.
• Library skinning still works, so at least directly patching steam files is still an option.
• Naturally without skin support, injecting webkit.css from one is no longer an option. This breaks anything still using that (Login, Friends, etc), and those will have to be moved into client patches.
• Unknown if there's a way to theme pages that were simply accessing steam's website (Store, Profile, etc) anymore, since we probably can't patch those and webkit.css will no longer be injected there.
• New Settings, which thankfully seems to be unified into a pagedsettings_PagedSettings dialog, so it at least inherits that existing styling.
• New Web Based In-Game Overlay.
• New Notifications.
• New Screenshot Manager.
• As per Library: Game properties dialog changes #139, Game properties has changed slightly.

[Eschguy]

Just installed v38 and yeah....it's rough. Seems deleting everything in .steam/skins doesn't revert all changes, either.

[tkashkin]

@Eschguy This skin patches a few css files outside of the skins directory since #120.
You'll have to reset these patches for now if you want to stay on the client beta branch.

Use one of the following methods:

• Rerun the installer script with --web-theme none or select Web theme: None in AdwSteamGtk and reinstall the skin.
• Remove clientui/css/friends.css, clientui/friends.custom.css, steamui/css/library.css, steamui/libraryroot.custom.css.
• Just remove the whole clientui and steamui directories and start Steam to let it extract them again.
• Do something else to force Steam to overwrite patched files, maybe switch to the stable branch and back to beta.

[Eschguy]

@Eschguy This skin patches a few css files outside of the skins directory since #120.

Ahh I missed that release note, makes sense.

[Foldex]

Opened a PR to add uninstall info to the readme.

I also have an initial beta branch here.
Login is fixed, Chat is fixed, Context Menus fixed, and the Header/Footer Bars at least aren't garish blue anymore.
But besides that, expect lots of bugs, this is basically the bare minimum of fixing up.

Unfortunately this comes at a bad time, as I'm not going to have much time to polish this further in the immediate future. So there's the heads up if anyone wants to fix this up more.

You can find information about inspecting Steam's classes here
One note is that since the update the F12 shortcut is a bit finnicky, I've had better luck right clicking a text box and using Inspect Element

If you're still interested in using the beta, you can tide yourself over via:

git clone https://github.com/Foldex/Adwaita-for-Steam.git -b beta
cd Adwaita-for-Steam
./install.py

The rest is still going to take some work, but at least this is much less in your face broken.

We still have a loss of customization since we no longer have control over the underlying layout of the headerbars like with VGUI. This means stuff like adding new buttons/links is pretty much out of the question, since to my knowledge there's no easy way to patch the underlying html. Being stuck with css, we can only style elements, not add them.

On the plus side, the elimination of VGUI does also effectively clean up some of the longer standing VGUI issues:
#37 #97 #105 #107 #108 , granted some of those will have web theme equivalents.

[Foldex]

Had time to update the beta branch a little:

Forward/Back Arrows had to be hidden since I couldn't find a good place for them.

Still needs work:

• Overlay (Skinning seems to work, but dunno how to get the inspector working here)
• Notifications
• Settings / Game Properties
• Add Non-Steam Game
• Product Activation
• Recent Players
• Game Servers
• Screenshots
• Update News
• About Steam
• System Info
• Probably more stuff

[IceDBorn]

@Foldex It looks perfect, good job!

[Eschguy]

Looks great! Wondering if there's a way to do some kind of auto-sizing blank space for the top bar. It gets a bit cramped at my default window size for Steam.

[Foldex]

Looks great! Wondering if there's a way to do some kind of auto-sizing blank space for the top bar. It gets a bit cramped at my default window size for Steam.

Unfortunately it's a case of having to resort to hackery to get it like this. The headerbar isn't actually a single row, it's two different rows being overlayed on top of each other. The actual layout (which we no longer control) looks something like this:

So the center and sides aren't really "aware" of each other's personal space. I could maybe do some squeezing of elements at smaller window sizes (the profile button being a good candidate), but technically there is nothing preventing overlap if it does occur.

The alternative is to keep the dual row layout which would look awful and really doesn't fit adwaita at all.

For similar lack of layout control reasons, I can't just shove the left menu into a adwaita-style hamburger menu like we used to. I could make it expand horizontally on hover though I guess.

[Caliel666]

The alternative is to keep the dual row layout which would look awful and really doesn't fit adwaita at all.

it indeed does not fit the general adwaita style, but if you have to go with that, you can probably make it look like Epiphany or Nautilus tabs, could at least be made into a option

as for the back and forwards buttons the far left would make sense if you follow Nautilus design, but i still think it would look weird

[Foldex]

screen.webm

• Now adjusts based on window size to try to prevent overlap. Certain combinations of optional Web Extras at the very smallest of window sizes will have slight overlap/look bad, but don't think it's avoidable.
• Navigation icons are back. Incidentally, this will also fix Icons not colored according to theme #149
• Window control web extras e.g. left left-all right-all should be working now.
• Added Web Extras for hiding the Bottom Bar and Big Picture Button.
• Added Web Extra for showing Back/Forward arrows, if you don't mind the extra clutter.

Just gonna put any further updates here: #150