Как я могу эффективно настроить / стиль Ext.form.Slider?

Question

Я пытаюсь настроить Ext.form.Slider в Sencha Touch 1.1. Это мой код:

de.letsdev.mySlider = new Ext.form.Slider({
    flex : 1,
    value : 0,
    centered : true,
    height : 10,
    maxHeight : 10,
    minValue : 0,
    maxValue : 20,
    disabled : true,
    disabledCls : '',
    componentCls : 'myClass'
});

Контейнер поддерживает заданную высоту, но я ожидаю, что ползунок масштабируется в соответствии с тем размером, который он не делает. Это просто обрезается в 10px: /

Спасибо за любые подсказки.

Answer 1

хорошо, мое решение было добавить этот CSS:

. myClass .x-input-slider::after {
    height: 0.4em;
    top: 0.8em;
}
. myClass .x-thumb::before {
    width: 1.2em;
    height: 1.2em;
    top: 0.8em;
}

Но для этого нужно было немного поиграться и, кроме того, настроить различные конфиги для телефона / планшета. Лучшее решение будет оценено.