Dashboard - theme: chart and ui-table

[hklages]

I changed the dashboard theme from light to dark. Most of the elements follow the given color schemes.

ui-table: does keeps the original color. Is there any "trick" to move all u-tables from light to dark scheme?

chart: the plotted lines keep the selected colors. Is there any chance to have the series color (at least the first one) "follow" the theme color? Or can i modify the color in the msg?

[dceejay]

which versions of dashboard and ui-table do you have ? there was a fix a while back.

And no - the chart colours are fixed.

[hklages]

now visible with helpt ui-table -- sometimes with table header / sometimes without, sometimes dark formatted in light theme, and here light formatted in dark theme.

[Christian-Me]

Hi,
did some additional tests and did not found a problem (using my own tables and the example flow:

I noticed that you have to do a full deploy if you change the dashboard theme. Otherwise the css of tabulator will not change. As I do not change the theme every now and then I believe this is a doable workaround?

Perhaps you can describe your problem in more detail. A) changing the theme and B) using msg.ui_control.headerVisble separate.

If I make the header invisible this:

a) survives page reloads
b) is on new clients invisible too
c) changes on different clients simultaneously

[Christian-Me]

Hi,

could it be that because the luma value is only determined on createNode and so the html variable? So it will only be updated after a full deploy?

Chris

[hklages]

I did some further testing.
Starting position: Dark theme but all tables had formatting in "light mode" - shouldnt have.
Hiding header tables didn't work

Then I switched theme to light, did full deploy.
Result: all tables kept the same formatting (what was OK for light theme).
Again, hiding header did not work.

Then I switched theme to dark again, did full deploy.
Result: all tables kept the same formatting - what is not OK for dark theme.
Again, hiding header did not work

Then in dark mode I did reset the base color to that green blue color and did full deploy.
Result: all tables changed formatting according to dark mode and I am also able to hide the header for selected tables.

Do you do some "hidden" calculation using the base color and depending on that calculation you give recommendation for the color of side bar (dark or light) and also for the table formatting (dark style, light style)?

[Colin]

Are you clearing the browser cache each time? Not saying it will make a difference but best to be certain.

[Christian-Me]

A) No you do not need to clear the cache. A full deploy (perhaps browser reload) should work.
B) you need 0.3.3 of ui-table. It is updated on github but npm didn`t updated. There it is still 0.3.2.

In 0.3.2 you are not able to hide the header (see above). perhaps install from github?

When I (using the example flow) switch from light to dark with a full deploy the theme and table css changes correctly.

@dceejay Do you know why npm didn't update to 0.3.3?

[dceejay]

it was the weekend... thought I might see the family... I didn't get round to publishing it ... now done.

[hklages]

... it works with 0.3.3 and taking in account that the base color influences the style of the tables

[Christian-Me]

Hope you had a nice day with the family. No problem at all. I was afraid I messed something up.

[Christian-Me]

@hklages

taking in account that the base color influences the style of the tables

What do you mean by "base color?" Interesting - I can't see a correlation between the base settings color and the style or any ui-table element. Only the dashboard theme (light or dark) decides which tabulator css is loaded to match the overall color scheme as good as possible.

Nice to hear that your problem is now solved

[hklages]

In theme style "Dark", use the standard color. Tables are "dark"- see picture Dark.
Then change to a bright color, example 150 200 220 an do a full deploy. Result is that all tables change to a "light mode" - also the side bar. See picture bright.

[Christian-Me]

Ok, I see. Good point.

Think it would be better if ui-table looks into the background color to decide which tabulator css to choose.

Will look into that.

[hklages]

You could also have a selection field in the ui-table node with the options:
. Dark
. Light
. Follow them background or whatever

I suggest to update the help as it took me some time to figure out this dependency and others maY also run in that issue.

[dceejay]

the colour is set by the isDark function call - which for some reason is picking up from the sidebar background colour rather than the main background colour - no idea why - and I coded it So apologies - will fix and test - but will in the main dashboard next release.

[hklages]

Hi again. I now returned to a custom theme using these colors:

--nr-dashboard-pageBackgroundColor: #c8c8c8;
--nr-dashboard-pageTitlebarBackgroundColor: #6495ed;
--nr-dashboard-pageSidebarBackgroundColor: #e6e6e6;
--nr-dashboard-groupTextColor: #6495ed;
--nr-dashboard-groupBackgroundColor: #fafafa;
--nr-dashboard-groupBorderColor: #fafafa;
--nr-dashboard-widgetTextColor: #a0a0a0;
--nr-dashboard-widgetBackgroundColor: #6495ed;
--nr-dashboard-widgetBorderColor: #fafafa;
--nr-dashboard-widgetColor: #6495ed;
--nr-dashboard-widgetBgndColor: #fafafa;

Outcome is fine for me for tabs with standard widgets:

But for ui-table there is a "very dark background - see table at the bottom". That does not fit to the light style.

Questions:

1. How can I change that ui-table background color - best would be to group background color
2. There is nr-dashboard-widgetBgndColor - what is the difference to "widgetBackgroundColor" - is it the "off" color (switches)
3. Would it be possible to add some "custom" colors the the theme eg "-nr-dashboard-custom1"

[dceejay]

it seems to be set by the tabulator class background-color - I'll fix it (unset it so it shows the underlying one) in master

[hklages]

Thanks! Will wait for the new release

F A N T A S T I C. Solved with 0.3.4 of ui-table