Custome Keycloak Theme

Hi all,

I have installed Keycloak from the univention app store and was wondering if it is possible to customise the theme.

the UCS theme is included in the docker-compose.yml as follows.

"Type": "bind",
"Source": "/var/lib/univention-appcenter/apps/keycloak/conf/UCS",
"Destination": "/opt/keycloak/themes/UCS",
"mode": "rw",
"RW": true,
"Propagation": "rprivate".

Now I built my own theme and put it next to the UCS folder and added the following line in docker-compose.yml.

"Type": "bind",
"Source": "/var/lib/univention-appcenter/apps/keycloak/conf/MyTheme",
"Destination":"/opt/keycloak/themes/MyTheme",
"mode": "rw",
"RW": true,
"Propagation": "rprivate".

If I now delete the container and rebuild docker-compose -p keycloak up -d --no-build --no-recreate, keycloak no longer works, of course.

Has anyone had any experience with this?
Is this a feature that is still to come?

Best
AlteSocke

Not 100% sure what exactly you are trying to do. But the general approach is:

Create a new theme:
cp /usr/share/univention-web/themes/dark.css /usr/share/univention-web/themes/mytheme.css

Adjust the file…

univention-app configure keycloak --set keycloak/theme=mytheme

This is documented here:
https://docs.software-univention.de/manual/5.0/en/central-management-umc/introduction.html#creating-a-custom-theme-adjusting-the-design-of-ucswebs
and here:
https://docs.software-univention.de/keycloak-app/latest/configuration.html#envvar-keycloak-theme

Note that the theme is not supposed to do all kinds of magic. The variables work, but doing anything else (i.e. arbitrary CSS code) may break at some point. At the very least, the structure of the document depends on the Keycloak project.

Mastodon