{% load static %}
<div id="formulaequationinput_{{ id }}"
     class="inputtype formulaequationinput"
     {% if inline %}style="display:inline-block;vertical-align:top"{% endif %}>
    <div class="{{ status.classname }}">
        {% if response_data.label %}
            <label class="problem-group-label" for="input_{{ id }}" id="label_{{ id }}">{{ response_data.label }}</label>
        {% endif %}
        {% for description_id, description_text in response_data.descriptions.items %}
            <p class="question-description" id="{{ description_id }}">{{ description_text }}</p>
        {% endfor %}
        <input type="text"
               name="input_{{ id }}"
               id="input_{{ id }}"
               data-input-id="{{ id }}"
               value="{{ value }}"
               {{ describedby_html }}
               {% if size %}size="{{ size }}"{% endif %} />
        <span class="trailing_text" id="trailing_text_{{ id }}">{{ trailing_text }}</span>
        {% include "status_span.html" with status=status status_id=id %}
        <p id="answer_{{ id }}" class="answer"></p>
        <div id="input_{{ id }}_preview" class="equation">
            \(\)
            <img src="{% static 'images/spinner.gif' %}" class="loading" alt="Loading" />
        </div>
    </div>
    <div class="script_placeholder" data-src="{{ previewer }}" />
    {% if msg %}<span class="message" aria-describedby="label_{{ id }}" tabindex="-1">{{ msg|safe }}</span>{% endif %}
</div>
