Свои чекбоксы и радиокнопки в формах

Галочки и радиокнопки в формах Тильды рисуются одним и тем же чёрным контуром, приглушённым до 60 % прозрачности, и настроек у них нет. Модификация переопределяет их вид целиком, оставаясь внутри тильдовской разметки: элементы не подменяются, меняются только стили.

Что настраивается

• Размер, толщина рамки и форма — от квадрата до круга; значения общие для галочек и радиокнопок, чтобы форма выглядела цельной.
• Насыщенность неотмеченных — по умолчанию поля больше не приглушаются, но прежние 60 % можно вернуть.
• Цвета отдельно для рамки, для рамки в отмеченном состоянии и для заливки. Заливку можно включить и для неотмеченных, если поля должны выглядеть как плашки.
• Отметка внутри — своя для каждого типа:
  • чекбокс: галочка, заливка внутри, свой символ (например ✓ или ★) или картинка;
  • радиокнопка: точка, квадрат, овал, свой символ (например, ● или ♥︎) или картинка.
• Размер и цвет отметки — общие для обоих типов.

Что учтено

• Размер, форма и толщина задаются теми же переменными, которыми пользуется сама Тильда, поэтому внутренняя геометрия пересчитывается автоматически: отметка не выезжает за рамку ни на 12 пикселях, ни на 40.
• Картинка вписывается в поле по центру и не растягивается: подойдёт SVG или PNG, загруженный в файлы Тильды.
• Появляется кольцо фокуса при переходе по клавише Tab: настоящий input в Тильде спрятан за нулевой прозрачностью, и до этого у клавиатурной навигации не было никакого видимого состояния.
• Стили действуют во всех формах: обычных блоках, корзине, попапах и квизах.

Ограничения

Модификация меняет вид полей на всём сайте — выделить отдельную форму нельзя.

Настройка размера отметки не влияет на стандартную галочку: её пропорции Тильда считает сама. На остальные виды — заливку, символ, картинку и точку — влияет.