{% if locked %}<div class="lat-alert">{{ shell.t("This theme is locked: its config and templates cannot change until it is unlocked.") }}</div>{% endif %}
<div class="lat-split">
{% include "_theme_nav.html" %}
<div>
<div class="lat-pane">
<div class="lat-pane__head">{{ shell.t("Theme") }}</div>
<div class="lat-pane__body">
<dl class="lat-facts">
<div><dt>{{ shell.t("Code") }}</dt><dd><code>{{ code }}</code></dd></div>
{% if !parent.is_empty() %}<div><dt>{{ shell.t("Parent") }}</dt><dd>{{ parent }}</dd></div>{% endif %}
{% if !author.is_empty() %}<div><dt>{{ shell.t("Author") }}</dt><dd>{{ author }}</dd></div>{% endif %}
{% if !homepage.is_empty() %}<div><dt>{{ shell.t("Homepage") }}</dt><dd><a href="{{ homepage }}" target="_blank" rel="noopener noreferrer">{{ homepage }}</a></dd></div>{% endif %}
<div><dt>{{ shell.t("Status") }}</dt><dd>{% if active %}<span class="lat-status lat-status--on">{{ shell.t("Active") }}</span>{% else if editing %}<span class="lat-status lat-status--on">{{ shell.t("Previewing") }}</span>{% else %}<span class="lat-status lat-status--off">{{ shell.t("Inactive") }}</span>{% endif %}</dd></div>
</dl>
{% if !description.is_empty() %}<p class="lat-note" style="margin:0">{{ description }}</p>{% endif %}
</div>
{% if !locked %}<div class="lat-pane__foot"><p class="lat-help">{{ shell.t("Name, author, homepage, description and preview.") }}</p><button class="lat-btn lat-btn--secondary lat-btn--sm" type="button" data-lat-dialog="theme-properties">{{ shell.t("Edit properties") }}</button></div>{% endif %}
</div>
{% if let Some(fields) = settings %}
<form class="lat-pane" method="post" action="{{ theme_url }}/settings" data-lat-widget="form">
<div class="lat-pane__head">{{ shell.t("Settings") }}</div>
<div class="lat-pane__body">
<input type="hidden" name="_csrf" value="{{ shell.csrf_token() }}">
{{ fields|safe }}
</div>
{% if !locked %}<div class="lat-pane__foot"><button class="lat-btn lat-btn--primary" type="submit">{{ shell.t("Save") }}</button></div>{% endif %}
</form>
{% endif %}
</div>
</div>
{% include "_theme_dialogs.html" %}
{% if !locked %}
<dialog class="lat-dialog" id="theme-properties">
<form method="post" action="{{ theme_url }}/properties">
{% let dialog_title = shell.t("Theme properties") %}{% include "_dialog_head.html" %}
<div class="lat-dialog__body">
<input type="hidden" name="_csrf" value="{{ shell.csrf_token() }}">
<div class="lat-field">
<label class="lat-field__label" for="prop-name">{{ shell.t("Name") }}<span class="lat-field__req">*</span></label>
<input class="lat-input" id="prop-name" name="name" value="{{ name }}" required autofocus>
</div>
<div class="lat-field">
<label class="lat-field__label" for="prop-description">{{ shell.t("Description") }}</label>
<textarea class="lat-input" id="prop-description" name="description" rows="3">{{ description }}</textarea>
</div>
<div class="lat-field">
<label class="lat-field__label" for="prop-author">{{ shell.t("Author") }}</label>
<input class="lat-input" id="prop-author" name="author" value="{{ author }}" placeholder='{{ shell.t("A person or a company") }}'>
</div>
<div class="lat-field">
<label class="lat-field__label" for="prop-homepage">{{ shell.t("Homepage") }}</label>
<input class="lat-input" id="prop-homepage" name="homepage" type="url" value="{{ homepage }}" placeholder="https://">
</div>
<div class="lat-field">
<label class="lat-field__label" for="prop-preview">{{ shell.t("Preview image URL") }}</label>
<input class="lat-input" id="prop-preview" name="preview" type="url" value="{{ preview }}" placeholder="https://">
<p class="lat-field__help">{{ shell.t("Shown on the theme list; the theme's initials stand in without one. A 1200 × 800 PNG or JPEG of the home page, no browser frame.") }}</p>
</div>
</div>
<div class="lat-dialog__actions"><button class="lat-btn lat-btn--ghost" type="button" data-lat-dialog-close>{{ shell.t("Cancel") }}</button><button class="lat-btn lat-btn--primary" type="submit">{{ shell.t("Save properties") }}</button></div>
</form>
</dialog>
{% endif %}