rypblog/templates/editor.html

{% extends "base.html" %}

{% block title %}编辑文章 - 个人博客{% endblock %}

{% block extra_head %}
<style>
    .editor-container { max-width: 800px; margin: 0 auto; }
    .editor-title { width: 100%; padding: 0.5rem; font-size: 1.5rem; margin-bottom: 1rem; }
    .editor-toolbar { margin-bottom: 1rem; display: flex; gap: 1rem; align-items: center; }
    .editor-textarea { width: 100%; min-height: 400px; padding: 1rem; font-family: monospace; font-size: 1rem; resize: vertical; }
</style>
{% endblock %}

{% block content %}
<div class="editor-container">
    <h1>创建新文章</h1>
    <form method="POST" id="editorForm">
        <div class="form-group">
            <input type="text" name="title" class="editor-title" placeholder="文章标题" required>
        </div>
        <div class="editor-toolbar">
            <button type="button" id="uploadImageBtn" class="btn">📷 插入图片</button>
            <input type="file" id="imageFileInput" accept="image/*" style="display:none">
        </div>
        <div class="form-group">
            <textarea name="content" id="markdownContent" class="editor-textarea" placeholder="在此书写 Markdown 内容..." required></textarea>
        </div>
        <button type="submit" class="btn btn-primary">💾 发布文章</button>
    </form>
    <div id="uploadStatus" style="margin-top:0.5rem;"></div>
</div>
{% endblock %}

{% block extra_scripts %}
<script src="{{ url_for('static', filename='js/editor.js') }}"></script>
{% endblock %}