{% extends 'partials/options-row.twig' %}

{% block label %}{{ label }}<small>{{ description }}</small>{% endblock %}

{% block custom %}
    {% if not settings %}
        <label class="fontsampler-radio">
            <input type="radio" name="{{ name }}_use_default" value="0"
                {% if value is not empty and set_uses_defaults == 0 %} checked="checked" {% endif %}>
            <span class="settings-description">Use custom color</span>
        </label>
    {% endif %}
    <div class="fontsampler-options-row-values">
        <div class="fontsampler-color-picker">
            <input type="text" name="{{ name }}"
                   id="{{ name }}" class="color-picker"
                   value="{{ value }}"
                   data-default-color="{{ default }}"/>
        </div>
    </div>
{% endblock %}

{% block default %}
    {% if not settings %}
        <label class="fontsampler-radio">
            <input type="radio" name="{{ name }}_use_default" value="1"
                    {% if value is empty or set_uses_defaults == 1 %} checked="checked" {% endif %}>
            <span>Use default:
            <div class="fontsampler-css-color-block"
                 style="background-color: {{ default }};"></div>
            <code>{{ default }}</code>
            </span>
        </label>
    {% endif %}
{% endblock %}