<script src="_assets/{{script_js()}}" defer></script>

<div class="container {{#edit?}}edit{{/edit}}">
<div class="rendered">
{{>article_contents.html}}
</div>

<form autocomplete="off" id="article-editor" action="" method="POST">

<div class="editor">
<div class="hero">
<header>
<h1><input autocomplete=off type=text name=title value="{{title}}" placeholder="Title" required></h1>
</header>
</div>

<div class="theme-picker">
{{#themes}}
<input autocomplete="off" type="radio" name="theme" value="{{.theme}}"{{#.selected?}} checked{{/.selected}} class="theme-picker--option {{.theme.css_class()}} themed">
{{/themes}}
</div>

<article>
<p>
<input autocomplete=off type=hidden name=base_revision value="{{revision}}">
<textarea autocomplete=off name=body placeholder="Article goes here">{{raw}}</textarea>
<textarea autocomplete=off class="shadow-control"></textarea>
</p>
</article>

</div>

<div class="editor-controls">
{{#edit?}}
    <div class="cancel-interaction-group {{#cancel_url}}interaction-group--root--enabled{{/cancel_url}}{{^cancel_url}}interaction-group--root--disabled{{/cancel_url}}">
        <a class="interaction-group--enabled button button-cancel cancel" href="{{#cancel_url}}{{.}}{{/cancel_url}}">Cancel</a>
        <button class="interaction-group--disabled button button-cancel" disabled>Cancel</a>
    </div>
    <button class="button button-default" type=submit {{^edit?}}disabled{{/edit}}>Save</button>
{{/edit}}
{{^edit?}}
    <div class="cancel-interaction-group interaction-group--root--disabled">
        <a class="interaction-group--enabled button button-cancel cancel" href="{{#cancel_url}}{{.}}{{/cancel_url}}">Cancel</a>
        <button class="interaction-group--disabled button button-cancel" disabled>Cancel</a>
    </div>
    <button class="button button-default" type=submit disabled>Save</button>
{{/edit}}
</div>
</form>

</div>

<footer>
<ul class="dense"
    ><li class="last-updated {{^last_updated}}missing{{/last_updated}}">{{#last_updated}}{{{.}}}{{/last_updated}}</li
    ><li><a id="openEditor" href="?edit" rel="nofollow">Edit</a></li
></ul>
{{>footer/items.html}}
</footer>

{{>dialog_prototypes.html}}