There is unnecessary border in Grid Filter menu in Sass themes

Web Themes Feedback Portal

Create an account Log In

Back to Feed

Request a Feature Report a Bug

Completed

Last Updated: 29 Mar 2021 12:52 by ADMIN

Release 2021.R1.SP.next

Stephane

Created on: 25 Sep 2020 11:43

Type: Bug Report

There is unnecessary border in Grid Filter menu in Sass themes

Bug report

Reproduction of the problem

Open the following Demo with one of the SASS themes.
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

Aleksandr

Posted on: 27 Oct 2020 07:27

the solution does not work, please see screen

Attached Files:

3.JPG

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).