{{define "title"}}{{if .IsNew}}New Post{{else}}Edit Post{{end}} — Admin{{end}}

{{define "content"}}
<div class="admin-wrap">
  <div class="admin-header">
    <h1>{{if .IsNew}}New Post{{else}}Edit: {{if .Post}}{{.Post.Title}}{{end}}{{end}}</h1>
    <div class="admin-actions">
      <a href="/admin" class="btn btn-outline">Back to Dashboard</a>
    </div>
  </div>

  {{if .Error}}
  <p class="form-error">{{.Error}}</p>
  {{end}}

  <form method="POST" action="{{if .IsNew}}/admin/new{{else}}/admin/edit/{{if .Post}}{{.Post.Slug}}{{end}}{{end}}" class="editor-form" id="post-form">
    {{if .IsNew}}
    <div class="form-row">
      <label for="slug">Slug (filename, no .md)</label>
      <input type="text" id="slug" name="slug" placeholder="my-post-slug" pattern="[a-z0-9\-_]+" required>
    </div>
    {{end}}

    <div class="editor-toolbar">
      <input type="file" id="img-file" accept="image/*" style="display:none">
      <button type="button" id="upload-btn" class="btn btn-sm btn-outline">Insert Image</button>
      <span id="upload-status" class="upload-status"></span>
    </div>

    <div class="editor-layout">
      <div class="editor-pane">
        <label for="content">Markdown</label>
        <textarea id="content" name="content" class="editor-textarea" spellcheck="false">{{.Raw}}</textarea>
      </div>
      <div class="preview-pane">
        <div class="preview-label">Preview <button type="button" id="preview-btn" class="btn btn-sm">Refresh</button></div>
        <div id="preview-output" class="preview-output prose"></div>
      </div>
    </div>

    <div class="editor-footer">
      <button type="submit" class="btn">Save</button>
      <a href="/admin" class="btn btn-outline">Cancel</a>
    </div>
  </form>
</div>

<script src="/static/js/editor.js"></script>
{{end}}