Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 20.05.2016, 23:06
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

Корректировка темы
Никак не пойму как внедрить это CSS-правило:

Код:
.x-grid-cell-inner-row-numberer {
	padding: 7px 10px 6px;
}
__________________
Хусамов Сухроб, Москва, khusamov@yandex.ru
Мой JS-стек: Sencha ExtJS 6, Node.js, TypeScript.
Ответить с цитированием
  #2 (permalink)  
Старый 21.05.2016, 01:57
Аватар для nohuhu
Профессор
Отправить личное сообщение для nohuhu Посмотреть профиль Найти все сообщения от nohuhu
 
Регистрация: 21.05.2015
Сообщений: 321

За эти значения отвечает переменная $grid-row-numberer-cell-padding. Не знаю, почему она не задокументирована, скорее всего просто забыли.

Правильный способ это поменять значение переменной в SASS. Совсем правильно было бы создать новую тему и задавать переменные в ней, но ради одной переменной можно и по-быстрому: создайте файл ${app.dir}/sass/var/Application.scss и добавьте в него строку:

$grid-row-numberer-cell-padding: <x>;


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

JavaScript:
new Ext.grid.Panel({
    cls: 'my-specific-grid',
    ...
});

CSS:
.my-specific-grid .x-grid-cell-inner-row-numberer {
    padding: <x>;
}
Ответить с цитированием
  #3 (permalink)  
Старый 21.05.2016, 18:25
Аватар для khusamov
Соединяю Node.js и Ext JS
Отправить личное сообщение для khusamov Посмотреть профиль Найти все сообщения от khusamov
 
Регистрация: 25.06.2009
Сообщений: 1,033

Мне и нужно глобально. А переменной этой не обнаружил.

А если я сделаю две темы, можно между ними переключаться на ходу без перезагрузки HTML-страницы с приложением?
__________________
Хусамов Сухроб, Москва, khusamov@yandex.ru
Мой JS-стек: Sencha ExtJS 6, Node.js, TypeScript.
Ответить с цитированием
  #4 (permalink)  
Старый 23.05.2016, 20:37
Аватар для nohuhu
Профессор
Отправить личное сообщение для nohuhu Посмотреть профиль Найти все сообщения от nohuhu
 
Регистрация: 21.05.2015
Сообщений: 321

Все переменные SASS можно найти, посмотрев исходники CSS правил в нужном файле .scss. Найти, в каком файле содержится правило, тоже довольно легко: в Chrome Dev tools выбираете нужный элемент, находите активное правило, которое определяет параметр под вопросом (скажем, padding), кликаете на ссылку рядом с селектором правила и Dev tools переходит к тому месту в файле CSS, где это правило содержится.

http://javascript.ru/forum/attachmen...d=146402478 7

А в комментарии над правилом указано, из какого файла SCSS оно прибыло:

http://javascript.ru/forum/attachmen...d=146402478 7

Переключение тем на лету теоретически возможно, но на практике довольно сложно сделать. Если у вас есть две темы совершенно одинаковые во всех параметрах, кроме цвета элементов и шрифтовых иконок, то можно попробовать подменять на ходу CSS файл. Если темы заметно разные, как например Classic и Neptune, то я бы не стал в такие дебри лезть.
Изображения:
Тип файла: jpg Screen Shot 2016-05-23 at 10.30.00 AM.jpg (19.5 Кб, 8 просмотров)
Тип файла: jpg Screen Shot 2016-05-23 at 10.30.13 AM.jpg (14.4 Кб, 5 просмотров)
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Темы созданные не в своих разделах nerv_ Оффтопик 35 07.09.2017 11:00
Как отменить компиляцию SCSS файлов дефолтной темы? Moloch ExtJS 3 01.04.2016 21:02
Смена темы сайта без мерцания FanAizu (X)HTML/CSS 5 18.02.2015 22:35
Темы оформления dijit MODist Dojo toolkit 1 13.10.2011 17:34
Где посмотреть мои темы? forroboform Сайт Javascript.ru 2 08.05.2011 16:48