Today client stable update (1/02/2023) seems break css loader, only coloured toggle works.

Theme installed:

• sd card fix
• switch like home

Language used: Italian

After an Update by decky all themes are still in the quick Access Menu but do Not work

So I've tried both installing through the plugin loader and manually copying and pasting the github files in desk mode. I've changed the permission on all the folders to view and edit on desktop mode, but nothing has changed. Is there some separate permission that I need to provide, either to the plugin or plugin loader so it can see the folders? They are structured the same way as the github is.

Story Voice Use Case:
As a theme user I want to configure complex values like Strings, colors, image URLs, etc. through the Plugin UI and have the theme uses these values.

Is it possible implement a system to pass values configured in the UI into the CSS scripts so that they can be used in a theme?

Even something as simple as replacing with the value entered in the UI would allow for some greater flexibility for the average theme user. It would also prevent developers from having to make a bunch of CSS files for colors and stuff.

very small issue, only visible on brightly coloured preview images.
it's more visible on the steam deck, these screenshots were taken from PC so there's some compression.

The gray box that appears when hovering is square instead of rounded (may be intentional?) but is also is slightly too high and doesn't cover the whole bottom of the box

basically if there's a dropdown of patches, and a component can apply to a few of them, it might be nice to throw the component in on only those rather than all the time.

I just updated Steam OS to version 3.4.6 on the stable channel and CSS Loader is now displaying a message that it failed to initialize. It says to try restarting the steam deck, which I've tried a few times. I've also tried uninstalling and reinstalling CSS Loader. I should mention that I initally had issues with one other plugin "Audio Loader", but I have sense got that one working again by restarting the deck.

Currently, themes seem to be haphazardly organized in the main plugin UI. It is annoying to try to find a certain theme because there is no easy-to-understand sorting (if there is any) for the user. It would be preferable if all themes were organized in alphabetical order so users could easily navigate to the theme they're looking for.

As the title suggests, I am unable to install any themes. Every other plug-in works perfectly but for some reason, trying to install themes from css loader doesn't work. Clicking on "install" does nothing. I don't see any error. I have re-imaged my Deck 3-4 times now and the result is the same.

Some OS update has removed Decky Loader for me, so I had to reinstall it. All of my plugins remained after previous install, but CSS Loader now thinks that all of the changes I made before the reinstall are the "default" look of the UI, making me practically stuck with all the changes. I can apply more changes on top, but flicking my current theme back and forth does nothing.

Is there any way to restore the default CSS look?

Error loading CSS Loader
ReferenceError: DFL is not defined

I tested the latest Beta of SteamOS and the 28.01. released beta breaked CSS Loader. No function at all.

Revert back to "stable" channel fixed CSS Loader.

Less of a bug, more of a question.

The Steam Deck's built-in browser (e.g. for the store, or other pages on the Steam website) and the stock deck theme are designed to match pretty-uniformly. However, for users of custom CSS themes, this browser is unpatched.

As an example, here's me using EMERALD0874's Galactic theme and browsing a store page - note that the store page is entirely unthemed.

Therefore, two questions:

• Can CSS be injected into this DOM via the same mechanism as the UI? Or are there two different mechanisms for doing so?
• Would the same CSS for the UI work for the browser? Looking at some of the CSS, it doesn't look like it'd be Deck-specific, but I'm unsure

As a theme user id like to be able to use themes with images without internet and witbout the performance penalty of encoding the image as base64.

Since the deck is used in places without internet it would be nice if the plugin could locally host a themes assets so they are available when internet is not.

Maybe each theme could have an assets folder that gets hosted and can be accessed at localhost/themename/assets.

Adding as an issue as per the conversation with @suchmememanyskill

Steam separates notification components into "notificationtoasts".
So we can't theming it until we add mapping.

In css_tab_mapping.py

def load_tab_mappings():
    global TAB_MAPPINGS_INTERNAL
    TAB_MAPPINGS_INTERNAL = {
        "QuickAccess": ["QuickAccess", "QuickAccess_.*"],
        "MainMenu": ["MainMenu", "MainMenu_.*"],
        "All": ["SP", "QuickAccess", "QuickAccess_.*", "MainMenu", "MainMenu_.*", "Steam Big Picture Mode"],
        "SP": ["SP", "Steam Big Picture Mode"],
        "Notification": [ "notificationtoasts", "notificationtoasts_.*"]
    }

In css_theme.py

            self.injects = [Inject(os.path.join(themePath, "theme.css"), ["SP", "QuickAccess", "MainMenu", "Notification"], self)]

This change makes us enable to theming notifications.

Test:

In shared.css

/* Notification */
.notificationcontent_ShortTemplate_2w-Eq, .notificationcontent_PinnedTemplate_H_NPi, .notificationcontent_StandardTemplate_1B_uv, .notificationcontent_ShortTemplate_nwer8, .notificationcontent_StandardTemplate_5HZT7, .notificationcontent_PinnedTemplateDesktop_1-8YO, .notificationcontent_PinnedTemplate_1X-O1 {
  background: #222209 !important;
}

when you have a lot of styles, with a lot of options, You might find that it be tedious to navigate... I propose that style settings can be collapsed by default and then manually expanded. alternatively put the settings on a secondary page

It would be great if the theme browser/manager had an option to sort by installed, so current themes can be updated more easily and sort by not installed so new themes can be found more easily.

An update all button could also work for easier updating.

This isn't super necessary right now, but it will become increasingly important as more themes are added.

Add a patch type for a custom color. This will allow a theme creator to set a root variable as an HSL color defined by the user using a color picker. The most recent development image is shown below.

I went to grab some themes and it wasn't connecting to the database for themes and when i exited it said the plugin failed to initialize it seemed to also affect Audio Loader whatever it was

My deck has just updated to the latest preview build and I noticed any themes I had set through css loader had disabled.

Enabling any that effect the home screen aren't working at all, some that affect the colour of the QAM and so on seem to work.

I'm on the latest pre release of decky loader.

I've tried reloading css loader and restarting my deck but it's still the same.

First off, Your decky loader fork works great on Windows. But the CSS loader calls some platform-specific code for Linux in css-utils.py and css-inject.py. Such as getting the user home path and the UID. I have encountered any additional platform specific code yet that throws exceptions in your Windows Decky Loader fork.

The home directory should be retrieved using pathlib and on Windows the EUID/UID should be ignored. Changing that made the CSS loader work great. I am having no problems with themes (though for some reason the store won't work properly, it seems to download the ZIP file and then fails to unzip it to the themes directory, so manual installation of the themes is required)

Reinjecting seems to fail on the latest dev branch. No idea why yet

I just got my steam deck dock and realized that when it connects to an external display, nearly all the themes are messed up - So, I am looking for a way to temporarily disable all the 3rd party CSSs.

I wrote a python script that converts images from a "theme root/images" into css files and updates the theme.json file to allow these images to be selectable as a "dropdown" patch. It also adds the user selected images as :root variable so they can be used in theming. With it i created a wallpapers theme that lets you set your own images for any wallpaper just by dropping them into an images folder.

You guys have said that you dont want to support a image dropdown type so im looking for another way to get that functionality in the most userfriendly way possible. if not directly supported here i can implement a seperate plugin that does the local image hosting and expose an image dropdown type. If i creted a seperate pligin it would be nice to have cooperstion between the two since they are closely related.

So these are some of the possible options 1 is preferred:

1. Allow a theme to call a python script when the reload themes button is pressed. (Hook) this would require bundling that script with the theme.
2. If bundling python with a theme is not wanted then the python code i wrote could be integrated into the reload themes function directly.
3. I can create a plugin that runs this code directly (potentially even hosting the images locally) that will update a theme with the images css files. If this route is chosen an images folder and the templateTheme.json would need to be bundled with the theme in the store for it to be user friendly. With it theme creators can also bundle more than one image with a theme and user can change pictures in real time.

I have a working prototype of the functionality here:
Wallpapers Theme

Open to any and all suggestions on how we can accomplish this and will contribute where needed to make it happen.

Thanks

When I open CSSLoader from decky loader. No themes pop up, I restarted, refreshed, nothing works.

Add the ability to directly inject custom css code snippets from the plugin itself

I have just installed the plugin y select "Manage themes" but it keeps loading forever. I tried rebooting the steam deck but it doesn't work. Any ideas?

Video of the issue:
https://www.youtube.com/watch?v=lgNAGu7zkKM

Thread where plugins were identified as the cause:
https://www.reddit.com/r/DeckSupport/comments/xyg86x/comment/irh7zam/

May I know if there's a way to have the CSSLoader changes for Steam Big Picture Mode in Windows?

"Manage Themes" uses title case at the top of the plugin whereas "Reload themes" uses standard case at the bottom of the plugin.

I just downloaded the css loader from the decky loader but I can’t install any themes. I’ll click the install button but nothing happens. Anyone know how I can fix this?

Normally covers entire menu

But these only cover a small section. may be intentional, but it doesn't look great.

t

For easy editing I am loading the css file from url. It works but to see the changes the browser cache must be cleared and the Deck must be restarted.

shared.css
@import url("https://chrisandriessen.nl/steamdeck/shared.css");

I'm looking to inject HowLongToBeat data into a sub div on the game page. Is there any plans to support something like this? Inject JavaScript Support?

I'm looking for something similar in functionality to the Crankshaft loaders ProtonDB plugin but I need something that is loadable by Decky Loader.

Hello, when I was using it, I clicked install, but there was no response, and the theme could not be downloaded

Since updating to CssLoader v1.5.0 my theme (SteamDeck U) which styles the keyboard is now working in desktop mode (with no changes), but I can't navigate the keyboard with the thumbstick. This could also be a Steam bug, I'm not sure