Nova theme km-light on navbar hides title and button icons

[Kenneth]

...because the title text is white as are the button icons in the navbar.

so how do I get the nova km-light theme to apply to title test and button icons in a navbar?

The docs just show the km-light applied to the navbar and it should all just work...

<header data-role="header">

    <div data-role="navbar" class="km-light">

    </div>

</header>

also this does not work for me:

<div data-role="navbar" style="background-color: green">My View Title</div>

navbar stays km-dark (default)

[Kenneth]

I inspected the CSS using F12 and found that the km-light class does override the km-view-title color however for some reason the color: #ffffff remains.  If I uncheck the overridden white color the red nova light color then shows for the text as it should.  Very strange.

before shows the error, after shows when I uncheck the overridden white color, and viola, the text appears.

before

after

 

 

[Kenneth]

This edit in overrides.css 

/*.km-nova .km-navbar *, */
 .km-nova .k-toolbar *,
 .km-nova .km-navbar
.km-leftitem .km-back:before,
 .km-nova .km-tabstrip *,
 .km-nova .km-drawer .km-list > li,
 .km-nova .km-drawer .km-list > li > .km-listview-link,
 .km-nova .km-drawer .km-list > li .km-icon
{color: #ffffff;}

fixes it except in the case where I use one of the special (no included) icons

[Preslav]

Hello Kenneth,

From your post, I understand that the CSS code that you provided does not change the color of the Kendo UI additional hybrid fond icons. Is that correct?

Following your approach, I was able to change the color of those icons, after inspecting the CSS using the Debugger. The code that I used is:

.km-nova .km-accent.km-navbar,
.km-nova .km-accent.k-toolbar,
.km-nova .km-accent.km-tabstrip,
.km-nova .km-accent.km-navbar .km-back:before,
.km-nova .km-accent.k-toolbar .km-back:before,
.km-nova .km-accent.km-navbar .km-button {
    color: #00acc1;
}

Let me know if this helps.

Regards,
Preslav
Telerik by Progress

[Kenneth]

By commenting out the portion of the CSS as indicated in my post the km-light class works as expected, that is, displays red text on a white background.

With the portion not commented out km-light displays white text on  a white background.

Again, this is when the km-light class is applied to a NavBar.