style updated & build script updated

.index/static+English_1

@@ -1 +1 @@
-{"total":1,"current":1,"content":["Syntax Tutorials/","Introduction.md","Installation.md","First Blog.md"]}
+{"total":1,"current":1,"content":["Syntax Tutorials/","Introduction.md","Installation.md","First Blog.md","Identification File.md","Configuration.md"]}

build.config.js

@@ -13,6 +13,13 @@ export default {
      */
     title: "Markdown Blog Template Documentation",
 
+    /**
+     * description: String
+     * the description for the site, is necessary for RSS.
+     * 网站的描述，对于 RSS 功能是必要的。
+     */
+    description: "A markdown static blog site.",
+
     /**
      * footer: String
      * the footer for this site, can be deleted if you do not need it

builder/indexTemplate.js

@@ -10,6 +10,7 @@ const HTMLHeader = `\
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="color-scheme" content="light dark">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+${config.description ? `    <meta name="description" content="${config.description}">` : ""}
     <title>${config.title ? config.title : "MarkdownBlog"}</title>
     <link rel="shortcut icon" href="./dist/imgs/favicon.png" type="image/x-icon">
     <link rel="stylesheet" href="./dist/style.min.css">

builder/rss/rssFileGenerator.js

@@ -1,12 +1,15 @@
+import config from "../../build.config.js"
+
 // input: [RssItem]
 // output: RssXmlString
 export default function(items) {
-    const RssTemplateBefore = `<?xml version="1.0" encoding="UTF-8" ?>
+    const RssTemplateBefore = `\
+<?xml version="1.0" encoding="UTF-8" ?>
 <rss version="2.0">
 <channel>
-<title>BHznJNs' Blog</title>
-<link>https://bhznjns.github.io/markdown-blog/#static/</link>
-<description>一个 Markdown 静态博客站。</description>
+<title>${config.title ? config.title : "Markdown Blog"}</title>
+<link>${config.homepage ? config.homepage : "https://bhznjns.github.io/markdown-blog-template"}</link>
+${config.description ? `<description>${config.description}</description>` : ""}
 `
     const RssTemplateAfter = `</channel>
 </rss>`

index.html

@@ -5,6 +5,7 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="color-scheme" content="light dark">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="A markdown static blog site.">
     <title>Markdown Blog Template Documentation</title>
     <link rel="shortcut icon" href="./dist/imgs/favicon.png" type="image/x-icon">
     <link rel="stylesheet" href="./dist/style.min.css">

src/styles/article/media.css

@@ -6,7 +6,8 @@ div.media-container {
     box-shadow: var(--shadow-md-1);
     overflow-x: hidden;
     overflow-y: auto;
-    transition: box-shadow .3s;
+    transition: background .3s .15s,
+                box-shadow .3s;
 }
 @media screen and (max-width: 767px) {
     /* Mobile phone style */
@@ -72,6 +73,8 @@ div.media-container img.load-error::before {
     background-repeat: no-repeat;
     background-position: 50% calc(50% - 8px);
     background-size: 85% 85%;
+    transition: filter .3s .15s,
+                background .3s .15s;
 }
 div.media-container img.load-error::after {
     position: absolute;
@@ -89,6 +92,8 @@ div.media-container img.load-error::after {
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
+    transition: color .3s .15s,
+                background .3s .15s;
 }
 
 .dark div.media-container img.load-error::before {
@@ -129,6 +134,7 @@ div.media-container .ganttchart-container {
 .railroad-container svg {
     width: 100%;
     background-color: var(--chart-bg-color) !important;
+    transition: background .3s .15s;
 }
 body.dark .flowchart-container svg,
 body.dark .sequencechart-container svg {