Added support for <h1>, <h2>, and <h3> to the core post parser.

Changed a span to a div in Tempra Simple and Shadow so that nested divs will work properly.

Added four parser tests.

common/parser.go

@@ -219,6 +219,7 @@ func PreparseMessage(msg string) string {
 		'u': []string{""},
 		'b': []string{"", "lockquote"},
 		'i': []string{""},
+		'h': []string{"1", "2", "3"},
 		//'p': []string{""},
 		'g': []string{""}, // Quick and dirty fix for Grammarly
 	}
@@ -267,6 +268,11 @@ func PreparseMessage(msg string) string {
 			&TagToAction{"lockquote", buildLitMatch("blockquote"), 0, false},
 		},
 		'i': []*TagToAction{&TagToAction{"", buildLitMatch("em"), 0, false}},
+		'h': []*TagToAction{
+			&TagToAction{"1", buildLitMatch("h2"), 0, false},
+			&TagToAction{"2", buildLitMatch("h3"), 0, false},
+			&TagToAction{"3", buildLitMatch("h4"), 0, false},
+		},
 		//'p': []*TagToAction{&TagToAction{"", buildLitMatch2("\n\n", ""), 0, false}},
 		'g': []*TagToAction{
 			&TagToAction{"", func(act *TagToAction, open bool, i int, runes []rune) (int, string) {

parser_test.go

@@ -47,6 +47,7 @@ func TestPreparser(t *testing.T) {
 
 	msgList.Add("<b></b>", "<strong></strong>")
 	msgList.Add("<b>hi</b>", "<strong>hi</strong>")
+	msgList.Add("<b>h</b>", "<strong>h</strong>")
 	msgList.Add("<s>hi</s>", "<del>hi</del>")
 	msgList.Add("<del>hi</del>", "<del>hi</del>")
 	msgList.Add("<u>hi</u>", "<u>hi</u>")
@@ -75,6 +76,9 @@ func TestPreparser(t *testing.T) {
 	msgList.Add("<span   ></span>", "")
 	msgList.Add("<span><span></span></span>", "")
 	msgList.Add("<span><b></b></span>", "<strong></strong>")
+	msgList.Add("<h1>t</h1>", "<h2>t</h2>")
+	msgList.Add("<h2>t</h2>", "<h3>t</h3>")
+	msgList.Add("<h3>t</h3>", "<h4>t</h4>")
 	msgList.Add("<></>", "&lt;&gt;&lt;/&gt;")
 	msgList.Add("</><>", "&lt;/&gt;&lt;&gt;")
 	msgList.Add("<>", "&lt;&gt;")

templates/topic.html

@@ -54,7 +54,7 @@
 
 <article {{scope "opening_post"}} itemscope itemtype="http://schema.org/CreativeWork" class="rowblock post_container top_post" aria-label="{{lang "topic.opening_post_aria"}}">
 	<div class="rowitem passive editable_parent post_item {{.Topic.ClassName}}" style="background-image: url({{.Topic.Avatar}}), url(/static/{{.Header.Theme.Name}}/post-avatar-bg.jpg);background-position: 0px {{if le .Topic.ContentLines 5}}-1{{end}}0px;background-repeat:no-repeat, repeat-y;">
-		<span class="hide_on_edit topic_content user_content" itemprop="text" style="margin:0;padding:0;">{{.Topic.ContentHTML}}</span>
+		<div class="hide_on_edit topic_content user_content" itemprop="text">{{.Topic.ContentHTML}}</div>
 		{{if .CurrentUser.Loggedin}}<textarea name="topic_content" class="show_on_edit topic_content_input edit_source">{{.Topic.Content}}</textarea>{{end}}
 
 		<span class="controls{{if .Topic.LikeCount}} has_likes{{end}}" aria-label="{{lang "topic.post_controls_aria"}}">

templates/topic_posts.html

@@ -7,7 +7,7 @@
 {{else}}
 	<article {{scope "post"}} id="post-{{.ID}}" itemscope itemtype="http://schema.org/CreativeWork" class="rowitem passive deletable_block editable_parent post_item {{.ClassName}}" style="background-image: url({{.Avatar}}), url(/static/{{$.Header.Theme.Name}}/post-avatar-bg.jpg);background-position: 0px {{if le .ContentLines 5}}-1{{end}}0px;background-repeat:no-repeat, repeat-y;">
 		{{/** TODO: We might end up with <br>s in the inline editor, fix this **/}}
-		<span class="editable_block user_content" itemprop="text" style="margin:0;padding:0;">{{.ContentHtml}}</span>
+		<div class="editable_block user_content" itemprop="text">{{.ContentHtml}}</div>
 		{{if $.CurrentUser.Loggedin}}<div class="auto_hide edit_source">{{.Content}}</div>{{end}}
 
 		<span class="controls{{if .LikeCount}} has_likes{{end}}">

themes/cosora/public/main.css

@@ -255,7 +255,7 @@ ul {
 .colstack_head h1 {
 	font-size: 18px;
 }
-h1, h2, h3 {
+h1, h2, h3, h4, h5 {
 	-webkit-margin-before: 0;
 	-webkit-margin-after: 0;
 	margin-block-start: 0;
@@ -1067,6 +1067,17 @@ blockquote:first-child {
 .post_item .user_content {
 	margin-bottom: 10px;
 }
+.user_content h2, .user_content h3 {
+	margin-bottom: 12px;
+	font-weight: normal;
+}
+.user_content h4 {
+	margin-bottom: 8px;
+	font-weight: normal;
+}
+.user_content strong h2, .user_content strong h3, .user_content strong h4 {
+	font-weight: bold;
+}
 .button_container {
 	margin-top: auto;
 	display: flex;

themes/nox/public/main.css

@@ -841,6 +841,23 @@ blockquote:first-child {
 .user_content {
 	word-break: break-word;
 }
+.user_content h2 {
+	font-size: 20px;
+}
+.user_content h3 {
+	font-size: 19px;
+}
+.user_content h2, .user_content h3 {
+	margin-top: 3px;
+	margin-bottom: 12px;
+	margin-left: 0px;
+}
+.user_content h2 + br, .user_content h3 + br {
+	display: none;
+}
+.user_content strong h2, .user_content strong h3 {
+	font-weight: bold;
+}
 .user_content.in_edit {
 	padding: 0px;
 	background: none;

themes/shadow/public/main.css

@@ -183,7 +183,7 @@ a {
 	font-size: 16px;
 	display: inline;
 }
-h1, h2, h3 {
+h1, h2, h3, h4, h5 {
 	-webkit-margin-before: 0;
 	-webkit-margin-after: 0;
 	margin-block-start: 0;
@@ -266,6 +266,20 @@ h1, h2, h3 {
 .user_content {
 	word-break: break-word;
 }
+.user_content h2 {
+	font-size: 18px;
+}
+.user_content h2, .user_content h3 {
+	margin-bottom: 12px;
+	display: block;
+}
+.user_content h4 {
+	margin-bottom: 8px;
+	display: block;
+}
+.user_content strong h2, .user_content strong h3, .user_content strong h4 {
+	font-weight: bold;
+}
 
 .controls {
 	width: 100%;

themes/tempra_simple/public/main.css

@@ -152,7 +152,7 @@ li a {
 #back {
 	display: flex;
 }
-#main {
+#back, #main {
 	width: 100%;
 }
 main > *:last-child {
@@ -257,13 +257,15 @@ main > *:last-child {
 }
 .rowhead h1, .colstack_head h1,
 .rowhead h2, .colstack_head h2 {
+	font-size: 16px;
+	margin-left: 4px;
+}
+h1, h2, h3, h4, h5 {
 	-webkit-margin-before: 0;
 	-webkit-margin-after: 0;
 	margin-block-start: 0;
 	margin-block-end: 0;
 	font-weight: normal;
-	font-size: 16px;
-	margin-left: 4px;
 }
 
 .rowitem {
@@ -669,6 +671,25 @@ button.username {
 	opacity: 0.9;
 }
 
+.user_content h2 {
+	font-size: 19px;
+}
+.user_content h3 {
+	font-size: 18px;
+}
+.user_content h4 {
+	font-size: 17px;
+}
+.user_content h2, .user_content h3 {
+	margin-bottom: 12px;
+}
+.user_content h4 {
+	margin-bottom: 8px;
+}
+.user_content strong h2, .user_content strong h3, .user_content strong h4 {
+	font-weight: bold;
+}
+
 .user_tag {
 	float: right;
 	color: #505050;