apply new account console style

[Lebriq Zakariae]

Hi, 

I'd like to ask you if did anyone  use this new account console look https://www.keycloak.org/2020/09/new-account-console.adoc.html ? 

I'm upgrading Keycloak from its version 10.0.2 to 11.0.3, but I can't get this new style working.

Is there any additional configuration I have to make than the css change mentioned in the link above.

Thanks for your help.

Regards

[Stan Silvert]

This should help:
See https://github.com/keycloak/keycloak-quickstarts/tree/master/extend-account-console

For the css to work, you just need to reference it in theme.properties:
https://github.com/keycloak/keycloak-quickstarts/blob/master/extend-account-console/src/main/resources/keycloak-man/account/theme.properties

--
You received this message because you are subscribed to the Google Groups "Keycloak User" group.
To unsubscribe from this group and stop receiving emails from it, send an email to keycloak-use...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/keycloak-user/3bd0a6dd-5d41-4252-8de3-429779764c85n%40googlegroups.com.

[Lebriq Zakariae]

First Of all, thank you for your reply.

I'd like to ask you where did you find the parent theme keycloak.v2 ? 

Regards 

You received this message because you are subscribed to a topic in the Google Groups "Keycloak User" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/keycloak-user/AVP7Y1RNl4o/unsubscribe.
To unsubscribe from this group and all its topics, send an email to keycloak-use...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/keycloak-user/2d0dc3e4-86d4-29cf-afff-ffa14be112f8%40redhat.com.

--

Zakariae LEBRIQ

[Lebriq Zakariae]

Hi everyone,  issue solved

Given than my theme is working as expected now :), Id like to share my solution:

1. As I'm using keycloak 11.0.3, I had to choose keycloak-preview as a parent of my custom them. The keycloak.v2 didn't work for me as a parent, there is a lot of missing variables, we need to wait until the version 12.0.1 is released.
2. If you face a 403 error when accessing your personal information, you should either add roles scope to your account-console client or add the client roles mappers.

Regards

Zakariae

--

Zakariae LEBRIQ

[Stan Silvert]

On 12/3/2020 2:26 PM, Lebriq Zakariae wrote:

First Of all, thank you for your reply.

I'd like to ask you where did you find the parent theme keycloak.v2 ?

If you are running from the code in master keycloak.v2 will be the default account console theme and you should use that as the parent. 

In older code, you would use keycloak-preview as the parent.  To activate keycloak-preview, pass in this at startup:

standlone -Dkeycloak.profile.feature.account_api=enabled -Dkeycloak.profile.feature.account2=enabled

[Lebriq Zakariae]

Thanks for your help 

--

Zakariae LEBRIQ

[Garth]

Stan - Thanks for the example project for extending the new account console.

I'm able to load the theme there given your instructions. However, it does not seem to change anything if I modify files inside keycloak-man/account/src (I’ve added a bunch of them from the keycloak repo in order to override them). Do I need to rebuild something first? With npm?

Thanks again.

> > To view this discussion on the web visit https://groups.google.com/d/msgid/keycloak-user/3bd0a6dd-5d41-4252-8de3-429779764c85n%40googlegroups.com <https://groups.google.com/d/msgid/keycloak-user/3bd0a6dd-5d41-4252-8de3-429779764c85n%40googlegroups.com?utm_medium=email&utm_source=footer>.

>
>
>
> --
> You received this message because you are subscribed to the Google
> Groups "Keycloak User" group.
> To unsubscribe from this group and stop receiving emails from it, send
> an email to keycloak-use...@googlegroups.com.
> To view this discussion on the web visit

> https://groups.google.com/d/msgid/keycloak-user/2d0dc3e4-86d4-29cf-afff-ffa14be112f8%40redhat.com <https://groups.google.com/d/msgid/keycloak-user/2d0dc3e4-86d4-29cf-afff-ffa14be112f8%40redhat.com?utm_medium=email&utm_source=footer>.