Boostrap Theme - change blue halo

2 posts, 0 answers
  1. Joe
    Joe avatar
    220 posts
    Member since:
    May 2012

    Posted 16 Mar 2017 Link to this post

    I'm using the bootstrap theme, although I am not using Bootstrap itself.  My form fields and buttons, such as on the Kendo menu and panel bar, when selected have a blue glowing halo around it.  I was able to modify it for the inputs with 

            outline: thin dotted;
            /*outline: 5px auto -webkit-focus-ring-color;*/
            outline: 2px auto #fe9827;
            outline-offset: -2px;


    but this doesn't alter the color (which is what I really want) for the Kendo menu and panelbar.  How can I accomplish that please?

  2. Orlin
    Orlin avatar
    62 posts

    Posted 20 Mar 2017 Link to this post

    Extension settings

    Hello Joe,

    To remove the blue box shadow of the focused elements in the Bootstrap theme, customize the k-state-focused class that applies the blue shadow.

    Have a look at the following dojo for an example:

    I hope this helps.


    Telerik by Progress
    Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top