Why do widgets require Legacy Mode to use CSS styles?

I would really appreciate some clarity on an issue that has confused and frustrated me for some time.

It seems that you can only apply CSS styles to widgets if the legacy mode is enabled, whether globally or for that particular widget. But for other types of views (a bar chart, for example), you don’t need to enable legacy mode for the CSS styles to take effect. I can see no good reason for this, and the official documentation for CSS styling does not suggest that this is what should happen.

I have seen some comments in the forum (such as this one) suggesting that this is indeed intentional, as the styling of the widgets has recently been revised and custom CSS styles only apply now to other JavaScript views. On the other hand, this comment (six months older) suggests the opposite, namely that this behaviour is a bug.

Could someone at KNIME clarify this situation around CSS styling? Even if widgets have been restyled, I see no reason why their appearance should not be customisable via CSS. Indeed, I almost always want to customise the output of the Text Output Widget, because its most common use case (for me, anyway) is to add a heading and introductory blurb to the composite view, and the default styles are not well suited for this. More generally, the web portal loses a lot of value if data apps can’t be styled to match a client environment.

Thanks in advance!

Ok so I found the following buried at the end of the WebPortal User Guide:

Styling widgets from KNIME Analytics Platform version <4.2 with the former css-classes is not supported anymore. However, the CSS styling of Widgets is still possible, but not documented. We recommend the use of theming to style your KNIME WebPortal and Widget elements. Widget styling that was created with KNIME Server version < 4.11 and KNIME Analytics Platform version <4.2 can still be used and we assure backwards compatibility with the use of legacy mode.

So my understanding is that CSS styling of widgets is indeed no longer supported, but the styling of other JavaScript views is.

I haven’t investigated the theming options yet, but am hoping they provide a comparable level of customisation to the legacy CSS styles.

Hey AngusVeitch1,

this is correct, the new widgets do not support CSS styling anymore. The replacement for this is indeed the newly introduced theming. This should make it easier to have the widgets match a client environment, as you only have to adjust the styling in one place and not for every widget.
About the Text Output Widget I agree, there it makes sense to allow different styles for it, in case you want to use it as a headline or normal text. This is currently only possible if you output HTML instead of text in the widget and style this HTML inline with CSS. This might be something that we need to improve in the future.

Hope that helps,
Daniel

2 Likes

Thanks for the clarification, @DanielBog. Perhaps this could be documented a little more clearly elsewhere, especially on this page, which does not make the situation at all clear, and I suspect is a source of considerable confusion.

1 Like

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.