Styling Calendar and DatePicker Selected Date

[Sergey]

Hello!

I built a custom theme in ThemeBuilder for Kendo UI based on Bootstrap theme.  Now I have the colors that I want, except for a couple of places.  For example Calendar and DatePicker Selected Date has a dark gradient in the background.  How do I get rid of it?

I read a proposed solution here: http://stackoverflow.com/questions/13507971/kendo-ui-picker-css-issue, but it doesn't seem to work for me.

Please help me address this!

Thank you!

Sergey

[Iliana Dyankova]

Hi Sergey,

The following CSS rule should help to achieve the expected result: 

.k-calendar td.k-state-focused.k-state-selected {
   box-shadow: none;
}

Regards,
Iliana Nikolova
Telerik

 

 

[Sergey]

Hi, Iliana!

I pasted this at the end of the custom theme css.  It didn't work...  Added -webkit-box-shadow: none; It still didn't work.

What else can I do?

Thank you!

Sergey

[Sergey]

I think the problem is occurring when the date is selected and has focus.

[Iliana Dyankova]

Hi Sergey, 

I tested the suggested solution and it is working as expected on my side (dojo example). As a suggestion - could you please try to increase the specificity of the CSS selector (for example test it with !important):

.k-calendar td.k-state-focused.k-state-selected {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

Regards,
Iliana Nikolova
Telerik

 

 

[Sergey]

Hi, Iliana!

Again, I pasted this code at the end of the custom theme css, and it didn't work.  All I do is import that theme into the ThemeBuilder online, and test there.  Can I send the theme css, and the screen shot, showing the problem to you?

Thank you!

Sergey

[Iliana Dyankova]

Hi Sergey,

Thank you for the details. This behaviour is caused by currently Kendo UI ThemeBilder does not contain option for changing the box-shadow, however using the suggested rule in your application should help to achieve the expected result (dojo example).   

Regards,
Iliana Nikolova
Telerik

 

 

[Sergey]

Thank you for the explanation, Iliana!  It does work!  I was just thinking to iron out all the problems in the ThemeBuilder before using the theme in a project...