add brief description to blog posts

iossefy · Sep 24, 2022 · ca333f2 · ca333f2
1 parent 9a43034
commit ca333f2
Show file tree

Hide file tree

Showing 3 changed files with 84 additions and 64 deletions.
diff --git a/README.md b/README.md
@@ -8,18 +8,19 @@ use `custom.css` to do it.
 
 ## new features
 
-* remove the bloat (utterances comments, progressivly, highlight.js)
-* scriptless by default.
-* removed bootstrap.
-* changed how the index, single pages and blog posts look.
-* blog list on the home page is limited, if the users want to see more they go to /blog/
-* listing projects on the home page.
-* brief about me on the home page.
-* support unlisted articles.
-* better favicons.
-* better tags
-* add multiple languages support
-* **HUGE** first letter paragraph (if you want)
+- remove the bloat (utterances comments, progressivly, highlight.js)
+- scriptless by default.
+- removed bootstrap.
+- changed how the index, single pages and blog posts look.
+- blog list on the home page is limited, if the users want to see more they go to /blog/
+- listing projects on the home page.
+- brief about me on the home page.
+- support unlisted articles.
+- better favicons.
+- better tags
+- add multiple languages support
+- **HUGE** first letter paragraph (if you want)
+- Brief description under blog post title
 
 ### custom.css
 
@@ -126,5 +127,15 @@ unlisted: true
 ---
 ```
 
+add a brief description to a single blog page.
+
+```markdown
+---
+
+brief: "This is my demo brief!"
+
+---
+```
+
 ### LICENSE
 GPL-3.0 [LICENSE](./LICENSE).
diff --git a/layouts/blog/single.html b/layouts/blog/single.html
@@ -2,60 +2,65 @@
 {{ partial "header" . }}
 <div class="content">
   <div class="container">
-	<div class="row justify-content-center">
-	  <div class="col-sm-12 col-lg-8">
-		<h1 class="mx-0 mx-md-4 blog-post-title">{{ .Title }}</h1>
-		<div class="meta-data meta">
-		  {{ if not .Params.noauthor }}
-		  {{ if .Params.author }}
-		  <span class="author meta-data" title="{{ .Params.Author }}">
-			{{ .Params.author }}
-		  </span>
-		  {{ end }}
-		  {{ end }}
-		  <span class="date middot meta-data" title='{{ .Date.Format "Mon Jan 2 2006 15:04:05 MST" }}'>
-			{{ .Date.Format (.Site.Params.dateform | default "2006-01-02") }}
-		  </span>
-		  <span class="reading-time middot meta-data">
-			{{ .ReadingTime }} min read
-		  </span>
-		  <a class="middot meta-data" href="{{ .Permalink | absURL }}">Permalink</a>
-		  <div class="d-none d-md-inline tags">
-			<ul class="list-unstyled d-inline">
-			  {{ range .Params.tags }}
-			  <li class="d-inline" style="margin-right: 0.5rem">
-				<a href="{{ "/tags/" | relLangURL }}{{ . | urlize }}">#{{ . }}</a>
-			  </li>
-			  {{ end }}
-			</ul>
-		  </div>
-		</div>
-		<div class="markdown blog-post-content">
-		  {{ partial "content" . }}
-		</div>
-		{{ if .Site.Params.posts_navigation }}
-		<div class="navigation">
-		  <div class="row">
-			<div class="col-12 col-lg-6">
-			  {{ if .PrevInSection }}
-			  <div class="mx-0 mx-md-4 mt-4 text-left">
-				<a href="{{ .PrevInSection.Permalink }}">« {{ .PrevInSection.Title }}</a>
-			  </div>
-			  {{ end }}
-			</div>
-			<div class="col-12 col-lg-6">
-			  {{ if .NextInSection }}
-			  <div class="mx-0 mx-md-4 mt-4 text-right">
-				<a href="{{ .NextInSection.Permalink }}">{{ .NextInSection.Title }} »</a>
-			  </div>
-			  {{ end }}
-			</div>
-		  </div>
-		</div>
-		{{ end }}
+    <div class="row justify-content-center">
+      <div class="col-sm-12 col-lg-8">
+	<h1 class="mx-0 mx-md-4 blog-post-title">{{ .Title }}</h1>
+	<div class="meta-data meta">
+	  {{ if .Params.brief }}
+	  <div class="d-none d-md-inline meta-brief">
+	    {{ .Params.brief }}
+	  </div>
+	  {{ end }}
+	  {{ if not .Params.noauthor }}
+	  {{ if .Params.author }}
+	  <span class="author meta-data" title="{{ .Params.Author }}">
+	    {{ .Params.author }}
+	  </span>
+	  {{ end }}
+	  {{ end }}
+	  <span class="date middot meta-data" title='{{ .Date.Format "Mon Jan 2 2006 15:04:05 MST" }}'>
+	    {{ .Date.Format (.Site.Params.dateform | default "2006-01-02") }}
+	  </span>
+	  <span class="reading-time middot meta-data">
+	    {{ .ReadingTime }} min read
+	  </span>
+	  <a class="middot meta-data" href="{{ .Permalink | absURL }}">Permalink</a>
+	  <div class="d-none d-md-inline tags">
+	    <ul class="list-unstyled d-inline">
+	      {{ range .Params.tags }}
+	      <li class="d-inline" style="margin-right: 0.5rem">
+		<a href="{{ "/tags/" | relLangURL }}{{ . | urlize }}">#{{ . }}</a>
+	      </li>
+	      {{ end }}
+	    </ul>
+	  </div>
+	</div>
+	<div class="markdown blog-post-content">
+	  {{ partial "content" . }}
+	</div>
+	{{ if .Site.Params.posts_navigation }}
+	<div class="navigation">
+	  <div class="row">
+	    <div class="col-12 col-lg-6">
+	      {{ if .PrevInSection }}
+	      <div class="mx-0 mx-md-4 mt-4 text-left">
+		<a href="{{ .PrevInSection.Permalink }}">« {{ .PrevInSection.Title }}</a>
+	      </div>
+	      {{ end }}
+	    </div>
+	    <div class="col-12 col-lg-6">
+	      {{ if .NextInSection }}
+	      <div class="mx-0 mx-md-4 mt-4 text-right">
+		<a href="{{ .NextInSection.Permalink }}">{{ .NextInSection.Title }} »</a>
+	      </div>
+	      {{ end }}
+	    </div>
 	  </div>
-	  {{ partial "footer" . }}
 	</div>
+	{{ end }}
+      </div>
+      {{ partial "footer" . }}
+    </div>
   </div>
 </div>
 {{ end }}
diff --git a/static/css/site.css b/static/css/site.css
@@ -102,6 +102,10 @@ hr {
 	margin-bottom: 10px;
 }
 
+.content .meta-brief {
+    color: #929AAB;
+}
+
 .content .meta a {
 	text-decoration: none;
 }