countdowngen/templates/countdown.html

39 lines
1.8 KiB
HTML

{% extends "base.html" %}
{% block content %}
<section class="card {{ 'shadow-' + shadow if shadow != 'none' else '' }}">
<div class="language-selector">
<a href="{{ request.query_string.decode('utf-8')|url_with_lang('en') }}" class="{{ 'active' if lang == 'en' else '' }}">EN</a>
<a href="{{ request.query_string.decode('utf-8')|url_with_lang('es') }}" class="{{ 'active' if lang == 'es' else '' }}">ES</a>
</div>
<h1 class="title">{{ title }}</h1>
<p class="subtitle">
{{ t('countdown.target_label') }} <code id="targetText"></code>
</p>
<div id="countdown"
class="countdown"
data-target="{{ target }}"
data-show-millis="{{ millis }}"
data-rounded-unit="{{ rounded_unit }}"
data-lang="{{ lang }}">
<!-- JS populates these -->
<div class="unit"><span id="d">--</span><label id="daysLabel">{{ t('countdown.days') }}</label></div>
<div class="unit"><span id="h">--</span><label id="hoursLabel">{{ t('countdown.hours') }}</label></div>
<div class="unit"><span id="m">--</span><label id="minutesLabel">{{ t('countdown.minutes') }}</label></div>
<div class="unit"><span id="s">--</span><label id="secondsLabel">{{ t('countdown.seconds') }}</label></div>
<div class="unit millis" id="millisWrap" hidden><span id="ms">---</span><label id="msLabel">{{ t('countdown.ms') }}</label></div>
</div>
<div class="share">
<button id="copyLink">{{ t('countdown.copy_link') }}</button>
<a id="editLink" href="{{ url_for('index') }}?{{ request.query_string.decode('utf-8') }}">{{ t('countdown.edit') }}</a>
</div>
<p id="status" class="muted"></p>
</section>
{% endblock %}
{% block scripts %}
<script src="{{ url_for('static', filename='js/countdown.js') }}"></script>
{% endblock %}