Unplanned
Last Updated: 10 Nov 2020 14:21 by ADMIN
Stephane
Created on: 25 Sep 2020 11:43
Category: Grid
Type: Bug Report
2
There is unnecessary border in Grid Filter menu in Sass themes

Bug report

Reproduction of the problem

  1. Open the following Demo with one of the SASS themes.
  2. Open the filter menu for the ProductName column

Current behavior

There is an additional border around the search input. The border appears when Sass is used.

Expected/desired behavior

The additional border should be removed.

Environment

  • Kendo UI version: 2020.3.915
  • Browser: [all]
5 comments
ADMIN
Ivan Danchev
Posted on: 10 Nov 2020 14:21

Stephane,

The suggested workaround is a temporary solution, should anyone need such, until the fix is included in a subsequent official release version.

Regards,
Ivan Danchev
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Stephane
Posted on: 05 Nov 2020 09:19
Once again, it would be easier if the bug was fixed instead of applying a new workaround.
ADMIN
Ivan Danchev
Posted on: 03 Nov 2020 08:03

Hi,

Use a more specific selector, to apply the styles only to the "search" textbox:

.k-filter-menu-container input[placeholder="Search"] {        
  border: none;
}

.k-filter-menu-container input[placeholder="Search"]:focus {
  outline: none;
}

Dojo: https://dojo.telerik.com/OSoXabID/3

Regards,
Ivan Danchev
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Aleksandr
Posted on: 27 Oct 2020 07:27
the solution does not work, please see screen 
Attached Files:
ADMIN
Ivan Danchev
Posted on: 19 Oct 2020 15:48

Hi,

The following CSS can be used as a workaround, until an official fix becomes available:

.k-filter-menu-container input {        
     border: none;
}

.k-filter-menu-container input:focus {
     outline: none;
}

Regards,
Ivan Danchev
Progress Telerik

Five days of Blazor, Angular, React, and Xamarin experts live-coding on twitch.tv/CodeItLive, special prizes, and more, for FREE?! Register now for DevReach 2.0(20).