<div class="transcripts-message-status status-error">
    <i class="icon fa fa-remove"></i>
    <%= gettext("Timed Transcript Conflict") %>
</div>

<p class="transcripts-message">
    <%= gettext("The timed transcript for the first video file does not appear to be the same as the timed transcript for the second video file.") %>
    <strong>
        <%= gettext("Which timed transcript would you like to use?") %>
    </strong>
</p>

<p class="transcripts-error-message is-invisible">
    <%= gettext("Error.") %>
</p>

<div class="wrapper-transcripts-buttons">
    <% _.each(html5_list, function(value, index) {
        var type = grouped_list[value][0].type,
            file_name = value + ((type) ? ('.' + type) : ''),
            message = interpolate(
                gettext("Timed Transcript from %(filename)s"),
                { filename: file_name },
                true
            );
    %>
        <button
            class="action setting-choose"
            type="button"
            name="setting-choose"
            data-video-id="<%= value %>"
            value="<%= message %>"
            data-tooltip="<%= message %>"
        >
            <span>
                <%= message %>
            </span>
        </button>
    <% }) %>
</div>
