From 797293203f1b7721f87a551ea13556fd756ffee5 Mon Sep 17 00:00:00 2001
From: Timur Ismagilov <bouncepaw2@ya.ru>
Date: Fri, 29 Apr 2022 12:33:05 +0300
Subject: [PATCH] Editor: Fix preview

---
 static/default.css     |   5 +-
 views/mutators.qtpl    |  19 +++---
 views/mutators.qtpl.go | 131 +++++++++++++++++++++--------------------
 3 files changed, 79 insertions(+), 76 deletions(-)

diff --git a/static/default.css b/static/default.css
index 3279a83..63959c9 100644
--- a/static/default.css
+++ b/static/default.css
@@ -92,9 +92,10 @@ body { margin: 0; font-size:16px; font-family: sans-serif; color: black; }
 input, kbd { font: inherit; color: inherit; }
 textarea {font-size:16px; font-family: inherit; line-height: 150%; }
 
-.edit { height: 90vh; }
+.edit_no-preview { height: 90vh; }
+.edit_with-preview .edit-form { height: 90vh; }
 .edit__title { margin-top: 0; }
-.edit__preview { border: 2px dashed #ddd; padding: 10px; }
+.edit__preview { border: 2px dashed #ddd; padding: 10px; margin: 0 -10px; }
 .edit-form__textarea { width: 100%; height: 80vh; min-height: 4rem; }
 .edit-form p { margin: .25rem 0; }
 .edit-form__message { width: 100%; margin: 0.25em 0; }
diff --git a/views/mutators.qtpl b/views/mutators.qtpl
index 3aea794..bab477d 100644
--- a/views/mutators.qtpl
+++ b/views/mutators.qtpl
@@ -94,18 +94,19 @@
 	lc := l18n.FromRequest(rq)
 %}
 <main class="main-width edit edit_with-preview">
-	<h1 class="edit__title">{%s= fmt.Sprintf(lc.Get("edit.title"), beautifulLink(hyphaName)) %}</h1>
-	{%s= warning %}
 	<form method="post" class="edit-form"
 			action="/upload-text/{%s hyphaName %}">
+		<h1 class="edit__title">{%s= fmt.Sprintf(lc.Get("edit.title"), beautifulLink(hyphaName)) %}</h1>
+		{%s= warning %}
 		<textarea name="text" class="edit-form__textarea" autofocus>{%s textAreaFill %}</textarea>
-		<br><br>
-		<label for="text">{%s lc.Get("edit.tag") %}</label><br>
-		<input id="text" type="text" name="message" class="edit-form__message" value="{%s message %}">
-		<br><br>
-		<button type="submit" name="action" class="btn btn_accent edit-form__save" value="Save">{%s lc.Get("edit.save") %}</button>
-		<button type="submit" name="action" class="btn edit-form__preview" value="Preview">{%s lc.Get("edit.preview") %}</button>
-		<a href="/hypha/{%s hyphaName %}" class="btn btn_weak">{%s lc.Get("ui.cancel") %}</a>
+		<p class="edit-form__message-zone">
+        	<input id="text" type="text" name="message" class="edit-form__message" placeholder="{%s lc.Get("edit.tag") %}" aria-label="{%s lc.Get("edit.tag") %}">
+        </p>
+		<p class="edit-form__buttons">
+            <button type="submit" name="action" class="btn btn_accent edit-form__save" value="Save">{%s lc.Get("edit.save") %}</button>
+            <button type="submit" name="action" class="btn edit-form__preview" value="Preview">{%s lc.Get("edit.preview") %}</button>
+            <a href="/hypha/{%s hyphaName %}" class="btn btn_weak">{%s lc.Get("ui.cancel") %}</a>
+        </p>
 	</form>
 	<p class="warning">{%s lc.Get("edit.preview_tip") %}</p>
 	<article class="edit__preview">{%s= renderedPage %}</article>
diff --git a/views/mutators.qtpl.go b/views/mutators.qtpl.go
index bfe19cc..924b754 100644
--- a/views/mutators.qtpl.go
+++ b/views/mutators.qtpl.go
@@ -296,50 +296,50 @@ func StreamPreview(qw422016 *qt422016.Writer, rq *http.Request, hyphaName, textA
 //line views/mutators.qtpl:95
 	qw422016.N().S(`
 <main class="main-width edit edit_with-preview">
-	<h1 class="edit__title">`)
-//line views/mutators.qtpl:97
-	qw422016.N().S(fmt.Sprintf(lc.Get("edit.title"), beautifulLink(hyphaName)))
-//line views/mutators.qtpl:97
-	qw422016.N().S(`</h1>
-	`)
-//line views/mutators.qtpl:98
-	qw422016.N().S(warning)
-//line views/mutators.qtpl:98
-	qw422016.N().S(`
 	<form method="post" class="edit-form"
 			action="/upload-text/`)
-//line views/mutators.qtpl:100
+//line views/mutators.qtpl:98
 	qw422016.E().S(hyphaName)
-//line views/mutators.qtpl:100
+//line views/mutators.qtpl:98
 	qw422016.N().S(`">
+		<h1 class="edit__title">`)
+//line views/mutators.qtpl:99
+	qw422016.N().S(fmt.Sprintf(lc.Get("edit.title"), beautifulLink(hyphaName)))
+//line views/mutators.qtpl:99
+	qw422016.N().S(`</h1>
+		`)
+//line views/mutators.qtpl:100
+	qw422016.N().S(warning)
+//line views/mutators.qtpl:100
+	qw422016.N().S(`
 		<textarea name="text" class="edit-form__textarea" autofocus>`)
 //line views/mutators.qtpl:101
 	qw422016.E().S(textAreaFill)
 //line views/mutators.qtpl:101
 	qw422016.N().S(`</textarea>
-		<br><br>
-		<label for="text">`)
+		<p class="edit-form__message-zone">
+        	<input id="text" type="text" name="message" class="edit-form__message" placeholder="`)
+//line views/mutators.qtpl:103
+	qw422016.E().S(lc.Get("edit.tag"))
+//line views/mutators.qtpl:103
+	qw422016.N().S(`" aria-label="`)
 //line views/mutators.qtpl:103
 	qw422016.E().S(lc.Get("edit.tag"))
 //line views/mutators.qtpl:103
-	qw422016.N().S(`</label><br>
-		<input id="text" type="text" name="message" class="edit-form__message" value="`)
-//line views/mutators.qtpl:104
-	qw422016.E().S(message)
-//line views/mutators.qtpl:104
 	qw422016.N().S(`">
-		<br><br>
-		<button type="submit" name="action" class="btn btn_accent edit-form__save" value="Save">`)
+        </p>
+		<p class="edit-form__buttons">
+            <button type="submit" name="action" class="btn btn_accent edit-form__save" value="Save">`)
 //line views/mutators.qtpl:106
 	qw422016.E().S(lc.Get("edit.save"))
 //line views/mutators.qtpl:106
 	qw422016.N().S(`</button>
-		<button type="submit" name="action" class="btn edit-form__preview" value="Preview">`)
+            <button type="submit" name="action" class="btn edit-form__preview" value="Preview">`)
 //line views/mutators.qtpl:107
 	qw422016.E().S(lc.Get("edit.preview"))
 //line views/mutators.qtpl:107
 	qw422016.N().S(`</button>
-		<a href="/hypha/`)
+            <a href="/hypha/`)
 //line views/mutators.qtpl:108
 	qw422016.E().S(hyphaName)
 //line views/mutators.qtpl:108
@@ -348,104 +348,105 @@ func StreamPreview(qw422016 *qt422016.Writer, rq *http.Request, hyphaName, textA
 	qw422016.E().S(lc.Get("ui.cancel"))
 //line views/mutators.qtpl:108
 	qw422016.N().S(`</a>
+        </p>
 	</form>
 	<p class="warning">`)
-//line views/mutators.qtpl:110
+//line views/mutators.qtpl:111
 	qw422016.E().S(lc.Get("edit.preview_tip"))
-//line views/mutators.qtpl:110
+//line views/mutators.qtpl:111
 	qw422016.N().S(`</p>
 	<article class="edit__preview">`)
-//line views/mutators.qtpl:111
+//line views/mutators.qtpl:112
 	qw422016.N().S(renderedPage)
-//line views/mutators.qtpl:111
+//line views/mutators.qtpl:112
 	qw422016.N().S(`</article>
 </main>
 `)
-//line views/mutators.qtpl:113
+//line views/mutators.qtpl:114
 	qw422016.N().S(Toolbar(user.FromRequest(rq), lc))
-//line views/mutators.qtpl:113
+//line views/mutators.qtpl:114
 	qw422016.N().S(`
 `)
-//line views/mutators.qtpl:114
+//line views/mutators.qtpl:115
 	streameditScripts(qw422016)
-//line views/mutators.qtpl:114
+//line views/mutators.qtpl:115
 	qw422016.N().S(`
 `)
-//line views/mutators.qtpl:115
+//line views/mutators.qtpl:116
 }
 
-//line views/mutators.qtpl:115
+//line views/mutators.qtpl:116
 func WritePreview(qq422016 qtio422016.Writer, rq *http.Request, hyphaName, textAreaFill, message, warning string, renderedPage string) {
-//line views/mutators.qtpl:115
+//line views/mutators.qtpl:116
 	qw422016 := qt422016.AcquireWriter(qq422016)
-//line views/mutators.qtpl:115
+//line views/mutators.qtpl:116
 	StreamPreview(qw422016, rq, hyphaName, textAreaFill, message, warning, renderedPage)
-//line views/mutators.qtpl:115
+//line views/mutators.qtpl:116
 	qt422016.ReleaseWriter(qw422016)
-//line views/mutators.qtpl:115
+//line views/mutators.qtpl:116
 }
 
-//line views/mutators.qtpl:115
+//line views/mutators.qtpl:116
 func Preview(rq *http.Request, hyphaName, textAreaFill, message, warning string, renderedPage string) string {
-//line views/mutators.qtpl:115
+//line views/mutators.qtpl:116
 	qb422016 := qt422016.AcquireByteBuffer()
-//line views/mutators.qtpl:115
+//line views/mutators.qtpl:116
 	WritePreview(qb422016, rq, hyphaName, textAreaFill, message, warning, renderedPage)
-//line views/mutators.qtpl:115
+//line views/mutators.qtpl:116
 	qs422016 := string(qb422016.B)
-//line views/mutators.qtpl:115
+//line views/mutators.qtpl:116
 	qt422016.ReleaseByteBuffer(qb422016)
-//line views/mutators.qtpl:115
+//line views/mutators.qtpl:116
 	return qs422016
-//line views/mutators.qtpl:115
+//line views/mutators.qtpl:116
 }
 
-//line views/mutators.qtpl:117
+//line views/mutators.qtpl:118
 func streameditScripts(qw422016 *qt422016.Writer) {
-//line views/mutators.qtpl:117
+//line views/mutators.qtpl:118
 	qw422016.N().S(`
 <script src="/static/editor.js"></script>
 `)
-//line views/mutators.qtpl:119
+//line views/mutators.qtpl:120
 	for _, scriptPath := range cfg.EditScripts {
-//line views/mutators.qtpl:119
+//line views/mutators.qtpl:120
 		qw422016.N().S(`
 <script src="`)
-//line views/mutators.qtpl:120
+//line views/mutators.qtpl:121
 		qw422016.E().S(scriptPath)
-//line views/mutators.qtpl:120
+//line views/mutators.qtpl:121
 		qw422016.N().S(`"></script>
 `)
-//line views/mutators.qtpl:121
+//line views/mutators.qtpl:122
 	}
-//line views/mutators.qtpl:121
+//line views/mutators.qtpl:122
 	qw422016.N().S(`
 `)
-//line views/mutators.qtpl:122
+//line views/mutators.qtpl:123
 }
 
-//line views/mutators.qtpl:122
+//line views/mutators.qtpl:123
 func writeeditScripts(qq422016 qtio422016.Writer) {
-//line views/mutators.qtpl:122
+//line views/mutators.qtpl:123
 	qw422016 := qt422016.AcquireWriter(qq422016)
-//line views/mutators.qtpl:122
+//line views/mutators.qtpl:123
 	streameditScripts(qw422016)
-//line views/mutators.qtpl:122
+//line views/mutators.qtpl:123
 	qt422016.ReleaseWriter(qw422016)
-//line views/mutators.qtpl:122
+//line views/mutators.qtpl:123
 }
 
-//line views/mutators.qtpl:122
+//line views/mutators.qtpl:123
 func editScripts() string {
-//line views/mutators.qtpl:122
+//line views/mutators.qtpl:123
 	qb422016 := qt422016.AcquireByteBuffer()
-//line views/mutators.qtpl:122
+//line views/mutators.qtpl:123
 	writeeditScripts(qb422016)
-//line views/mutators.qtpl:122
+//line views/mutators.qtpl:123
 	qs422016 := string(qb422016.B)
-//line views/mutators.qtpl:122
+//line views/mutators.qtpl:123
 	qt422016.ReleaseByteBuffer(qb422016)
-//line views/mutators.qtpl:122
+//line views/mutators.qtpl:123
 	return qs422016
-//line views/mutators.qtpl:122
+//line views/mutators.qtpl:123
 }