Kendo UI PanelBar - Удалить автоматический стиль на выбранной панели

Question

Я реализую панель Kendo PanelBar на своей веб-странице. Я довольно новичок в CSS/HTML, поэтому я заблудился, как удалить стиль по умолчанию на PanelBar. Когда я выбираю панель, она открывается правильно и выглядит нормально. Когда я убираю мышь от открытой панели, на открытой панели появляется оранжевая рамка. Я приложил два изображения, показывающие проблему.

Все выглядит хорошо, когда я парю над открытой панелью:

Когда я убираю мышь, появляется оранжевая рамка:

Может кто-нибудь сказать мне, как удалить эту границу?

Answer 1

Я столкнулся с той же проблемой и отправил билет в службу поддержки кендо. Илиана Николова предоставила следующее:

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

В моем решении тень boxBar по-прежнему отображалась, затем я использовал инспектор страниц (F12) и протестировал следующее правило с помощью box-shadow: нет; собственность, и это помогло мне.

.k-state-selected > .k-link, .k-panelbar > li > .k-state-selected, .k-panelbar > li.k-state-default > .k-state-selected.k-link {
            background-color: #C7D3A9;
            color:black;
            box-shadow: none;
}

Перед вашим постом я искал тонну кода и не нашел места. Я использовал рекомендацию использования компоновщика тем и снял видео (используя кодировщик Windows Media 9), я чувствую, иллюстрируя проблему, которая помогла получить лучший отклик кендо. Илиана не вернула мой код с исправлением, так что это оставило меня в покое, но он предоставил ключевой элемент.

Если вы обнаружите, что это решает проблему, пожалуйста, проголосуйте за ответ. Другие, которые также находят это полезным, также оставляют положительные отзывы.

Answer 2

Я не уверен, что это за элемент, потому что вы не дали точный код.

Но вы можете использовать простой CSS, найти элемент и применить CSS, чтобы удалить оранжевую рамку.

Answer 3

Я была такая же проблема. Используйте Kendo Theme Builder здесь по адресу http://demos.telerik.com/kendo-ui/themebuilder/ а затем загрузите тему по умолчанию. Вы должны увидеть панель построителя тем, которая появится в правом нижнем углу экрана. Ищите выпадающее меню "Состояния виджетов". Там вы увидите параметры и сможете изменить цвет оранжевой рамки.

Теперь, если вы хотите полностью удалить оранжевую рамку и активное состояние, вам нужно открыть файл kendo.default.min.css и выполнить CNTRL+F (Найти) для шестнадцатеричного цветового кода #f35800. Внимательно посмотрите на селекторы, чтобы убедиться, что вы изменяете правильный стиль (т.е. .k-state-selected)

Затем, когда вы уверены, что у вас есть правильный селектор (ы), измените цвет на "прозрачный" (т.е. border-color: прозрачный)

Это сработало для меня