Проблема оформления флажка с деревом кендо - PullRequest
1 голос
/ 17 апреля 2019

Стилизация обычных флажков работает нормально, но когда флажок установлен в дереве, флажок группы дерева изменяется. Это дефис, и я не могу найти способ уменьшить его. Я сделал флажки меньше, и теперь дефис выглядит странно в флажке. Как мне оформить этот элемент с помощью scss?

На рисунке ниже показан текущий результат

enter image description here

Я попробовал следующий код и то: before и: after работает на значке чека и размерах чека.

.k-checkbox {
  font-size: 8px;
}
.k-checkbox-label {
  font-size: 8px;
}
.k-checkbox-label:before {
  width: 16px;
  height: 16px;
  font-size: 8px;
}
.k-checkbox-label:after {
  width: 16px;
  height: 16px;
  font-size: 8px;
}

В идеале мне бы хотелось, чтобы значок флажка группы всегда был таким же, как флажок установленного. (Это если вы нажмете сначала)

Ответы [ 2 ]

2 голосов
/ 17 апреля 2019

Попробуйте добавить это правило CSS в конце вашего styles.css:

 checkbox:indeterminate+.k-checkbox-label::after {
    width: 8px;
 }
0 голосов
/ 17 апреля 2019

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

Следующее правило CSS дало мне вид, который я искал.

    .k-checkbox:indeterminate+.k-checkbox-label::after {
        width: 8px;
        height: 1.3px;
        top: 8px;
        left: 4px;
    }

Верхняя и левая стороны центрируют его из-за ширины флажка 16 пикселей.

...