XWiki Themes don't apply for Info Boxes

Hello,

I’m facing a problem considering the Info/Warning/Success etc. boxes. The background color is not being displayed correctly. It seems like it is just overwritten by the Wiki background color. When I’m looking at the Theme Preview, everything is fine though.

I uploaded some Screenshots to show you what I mean. This is how it looks in Preview:

1

This is how it looks on the Wiki Page:

2

1 Like

Works for me (just tried it)

Note that you need to use the advanced part of the theme editor. For example:

@alert-info-bg: #ffedf7;

Then you must refresh your browser cache. IMO that’s what is missing on your side :slight_smile:

28

Thanks for your reply.

I tried refreshing browser cache and using the advanced part of the theme editor without success.
I can do changes to other parts of the theme (for example change navigation bar bg color) which are correctly applied. But once I try to change the background color of the info/warning etc. boxes it just won’t work.

I also tried using different themes and changing them. The background color is always correct in the previews but it is not changed in the Wiki after applying the theme.

I am seeing the exact same problem, this is happening on 11.8 and 11.8.1

OK, after a bit more research I found the following.

The issue seems to be coming from the ExtensionSheet as shown in the browser debugger below (the .successmessage class is not defined here which is why that still works)
image

With everything left as is the successmessage box shows OK but the other 3 do not ( I can only add one image to this post so will add them after this post).

If I remove the checkbox next to the background-color then they display as expected

I’m just not sure where on the server I need to make the edit to resolve the issue properly, any advise?

Example with the background-color enabled from ExtensionSheet
image

Example with the background-color disabled
image

Yup its the same for me. Success message is the only one which is displayed correctly.

1 Like

ok I’ve found the reason: you have the XWiki Repository Application extension installed in your wiki and this extension overwrites some CSS styles (see https://github.com/xwiki/xwiki-platform/blob/8119b9201ff00c1eb26f7f3d34f078c720c97fea/xwiki-platform-core/xwiki-platform-repository/xwiki-platform-repository-server-ui/src/main/resources/ExtensionCode/ExtensionSheet.xml#L500).

Would be great if you could report a bug at https://jira.xwiki.org/projects/XWIKI/summary

To fix this, you could either uninstall this extension if you don’t use it or try editing the ExtensionCode.ExtensionSheet page using the object editor and change the StyleSheetExtension xobject to use “on demand” instead of “always” (I’ve not tried it, it could have some side effects on the Repository app’s styling).

Thanks

Thank you @vmassol. I have removed the Extension Repository Application (was trying to mimic the Code Snippets Application from XWiki.Org) for now and it’s working as expected. I will report a bug for it and if I find the time will have a look at editing it on my dev server.

Using your fix (changing StyleSheetExtension xobject to use “on demand”) worked for me. Thanks a lot!

@kaydee64 I’m very new to xwiki, can you share the steps you took to make this change?

Use Shortkey x+x+x+h to display hidden pages.
Then search for “Extension Sheet” page and click on it.
Go to Edit -> Objects
Click on “StyleSheetExtension 0: Extension CSS”, go to “Use this Extension” and select “On demand only” then save the page.

1 Like

And x+x+x+a for advanced user mode.

Or see https://www.xwiki.org/xwiki/bin/view/Documentation/UserGuide/Features/PageEditing#HAdvancedMode

Thank you both