Hive Markdown Post Editor

Ready
Refresh
<div class="flex flex-col lg:flex-row h-[calc(100vh-73px)]">

    (html comment removed:  Preview Pane )
    <div class="lg:w-1/2 border-r border-zinc-800 bg-white text-zinc-900 flex flex-col">
        <div class="px-6 py-3 border-b bg-zinc-50 flex justify-between items-center">
            <h2 class="font-semibold text-zinc-700">Preview</h2>
            <button onclick="refreshPreview()" class="text-xs px-4 py-1 border border-zinc-300 rounded-xl hover:bg-zinc-100">↻ Refresh</button>
        </div>
        <div id="preview" class="preview p-8 overflow-auto flex-1 prose prose-zinc max-w-none"></div>
    </div>

    (html comment removed:  Editor Pane )
    <div class="lg:w-1/2 flex flex-col bg-zinc-900">
        <div class="flex border-b border-zinc-700">
            <button onclick="switchTab(0)" id="tab0" class="tab-active flex-1 py-4 font-medium">Body</button>
            <button onclick="switchTab(1)" id="tab1" class="flex-1 py-4 font-medium">Metadata</button>
        </div>

        <div id="tabContent0" class="flex-1 p-6 space-y-6 overflow-auto">
            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                <div>
                    <label class="block text-xs text-zinc-400 mb-1">Author</label>
                    <input id="author" class="w-full bg-zinc-950 border border-zinc-700 rounded-xl px-4 py-3 focus:outline-none focus:border-emerald-400">
                </div>
                <div>
                    <label class="block text-xs text-zinc-400 mb-1">Permlink</label>
                    <input id="permlink" class="w-full bg-zinc-950 border border-zinc-700 rounded-xl px-4 py-3 focus:outline-none focus:border-emerald-400">
                </div>
            </div>

            <div>
                <label class="block text-xs text-zinc-400 mb-1">Title</label>
                <input id="title" class="w-full bg-zinc-950 border border-zinc-700 rounded-xl px-4 py-3 focus:outline-none focus:border-emerald-400">
            </div>

            <div>
                <label class="block text-xs text-zinc-400 mb-1">Body (Markdown)</label>
                <textarea id="body" class="w-full bg-zinc-950 border border-zinc-700 rounded-3xl px-5 py-4 h-96 font-mono text-sm focus:outline-none focus:border-emerald-400"></textarea>
            </div>
        </div>

        <div id="tabContent1" class="flex-1 p-6 overflow-auto hidden">
            <label class="block text-xs text-zinc-400 mb-1">json_metadata</label>
            <textarea id="jsonMetadata" class="w-full bg-zinc-950 border border-zinc-700 rounded-3xl px-5 py-4 h-96 font-mono text-sm focus:outline-none focus:border-emerald-400"></textarea>
            <button onclick="validateAndFormatJson()" class="mt-4 px-5 py-2 bg-zinc-800 hover:bg-zinc-700 rounded-2xl text-sm">Format & Validate JSON</button>
        </div>

        <div class="p-6 border-t border-zinc-700 bg-zinc-950 flex flex-wrap gap-3">
            <button onclick="saveWithKeychain()" class="flex-1 bg-emerald-500 hover:bg-emerald-600 text-black py-4 rounded-3xl font-medium transition">🚀 Save to Hive (Keychain)</button>
            <button onclick="copyFullOperation()" class="px-8 bg-zinc-800 hover:bg-zinc-700 rounded-3xl text-sm font-medium">📋 Copy Operation</button>
        </div>
    </div>
</div>
hive-markdown-editor

Hive Markdown Post Editor
