Sencha - добавить нижнюю границу заголовка к панели

Question

У меня есть панель (панель extjs), и мне нужно нарисовать только нижнюю границу заголовка панели.

Я проверил с помощью поджигатель к моей веб-теме приложений, есть свойство CSS, которые позволяют сделать нижнюю границу заголовка панели:

.x-docked-top{ 
    border-bottom-width: 0 !important; // neptune-theme.css 
} 

Как я заметил, это свойство устанавливается через Neptune тематизации шаблон ... так что мне нужно, чтобы установить это свойство в «1», как это:

.x-docked-top{ 
     border-bottom-width: 1 !important; // myCustomCss.css 
} 

проблема заключается в том, что я не знаю, почему, если я пишу в моем myCustomCss.css файл приведенный выше код, он не работать и ничего не происходит. Может быть, функция !important, используемая в neptune-theme.css, имеет главный приоритет ?.

Кто-нибудь знает, как это исправить?

Answer 1

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

Решение, которое вы указали, не будет работать, поскольку вам не хватает единиц после значения.

.x-docked-top{ 
     border-bottom-width: 1px !important; // myCustomCss.css 
} 

Однако класс и процесс должны теоретически работать. Если нет, некоторые из других классов могут быть более восприимчивыми. Это класс, в результате которого я добавил свойство:

.x-panel-header-default-horizontal.x-header-noborder { 
    border-bottom: 2px solid #BFBFBF !important; 
} 

Я не хотел никакой границы, кроме нижней. Свойство затрагивает большинство компонентов, за исключением нескольких случаев, требующих дополнительных переопределений. (Использование Sencha ExtJS 6)