fix: space missing between footer parts

articles.example/config.json

@@ -11,5 +11,6 @@
   "published_on": "Published on",
   "updated_on": "Updated on",
   "authored": "By",
-  "copyright": "<a style=\"text-decoration:none;color:inherit;\" target=_blank href=\"https://creativecommons.org/licenses/by-nc/4.0/\">CC BY-NC</a>"
+  "copyright": "<a style=\"text-decoration:none;color:inherit;\" target=_blank href=\"https://creativecommons.org/licenses/by-nc/4.0/\">CC BY-NC</a>",
+  "footer": ""
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "md-blog",
-  "version": "1.9.3",
+  "version": "1.9.4",
   "private": true,
   "type": "module",
   "repository": "https://git.klemek.fr/klemek/md-blog",
@@ -21,34 +21,35 @@
   "dependencies": {
     "@keithclark/shaderview": "https://github.com/keithclark/shaderview/archive/refs/tags/1.2.0.tar.gz",
     "highlight.js": "^11.11.1",
-    "katex": "^0.16.45",
-    "lucide": "^1.14.0",
-    "mermaid": "^11.14.0",
-    "vue": "^3.5.33",
-    "vue-router": "^5.0.6"
+    "katex": "^0.16.47",
+    "lucide": "^1.25.0",
+    "mermaid": "^11.16.0",
+    "vue": "^3.5.40",
+    "vue-router": "^5.2.0"
   },
   "devDependencies": {
     "@tsconfig/node24": "^24.0.4",
-    "@types/node": "^24.12.2",
-    "@vitejs/plugin-vue": "^6.0.6",
+    "@types/node": "^24.13.3",
+    "@vitejs/plugin-vue": "^6.0.8",
     "@vue/eslint-config-prettier": "^10.2.0",
-    "@vue/eslint-config-typescript": "^14.7.0",
+    "@vue/eslint-config-typescript": "^14.9.0",
     "@vue/tsconfig": "^0.9.1",
-    "eslint": "^10.3.0",
+    "eslint": "^10.7.0",
     "eslint-plugin-oxlint": "~1.60.0",
     "eslint-plugin-vue": "~10.8.0",
     "feed": "^5.2.1",
-    "jiti": "^2.6.1",
+    "jiti": "^2.7.0",
     "npm-run-all2": "^8.0.4",
     "oxlint": "~1.60.0",
     "prettier": "3.8.3",
-    "sass-embedded": "^1.99.0",
-    "tsx": "^4.21.0",
+    "sass-embedded": "^1.100.0",
+    "tsx": "^4.23.1",
     "typescript": "~6.0.3",
-    "vite": "^8.0.10",
+    "vite": "^8.1.5",
+    "vite-plugin-javascript-obfuscator": "^3.1.0",
     "vite-plugin-markdown": "^2.2.0",
-    "vite-plugin-vue-devtools": "^8.1.1",
-    "vue-tsc": "^3.2.7"
+    "vite-plugin-vue-devtools": "^8.1.5",
+    "vue-tsc": "^3.3.7"
   },
   "engines": {
     "node": "^20.19.0 || >=22.12.0"

src/components/PageFooter.vue

@@ -1,12 +1,12 @@
 <script setup lang="ts">
-import { REPOSITORY, NAME, VERSION, TITLE, COPYRIGHT } from '@lib/config'
+import { REPOSITORY, NAME, VERSION, TITLE, COPYRIGHT, FOOTER } from '@lib/config'
 import { stripHTML } from '@lib/strings'
 </script>
 
 <template>
   <footer>
-    {{ stripHTML(TITLE) }} &copy; {{ new Date().getFullYear() }}, <span v-html="COPYRIGHT"></span> |
-    Made with
-    <a :href="REPOSITORY">{{ NAME }} {{ VERSION }}</a>
+    {{ stripHTML(TITLE) }} &copy; {{ new Date().getFullYear() }}, <span v-html="COPYRIGHT"></span>
+    <span v-if="FOOTER">&nbsp;| <span v-html="FOOTER"></span></span>
+    &nbsp;| Made with <a :href="REPOSITORY">{{ NAME }} {{ VERSION }}</a>
   </footer>
 </template>

src/lib/config.ts

@@ -1,18 +1,19 @@
-import packageJson from '@/../package.json'
-import articlesConfig from '@articles/config.json'
+import packageJson from "@/../package.json";
+import articlesConfig from "@articles/config.json";
 
-export const NAME: string = packageJson.name
-export const VERSION: string = packageJson.version
-export const REPOSITORY: string = packageJson.repository
-export const TITLE: string = articlesConfig.title
-export const SIGNATURE: string = articlesConfig.signature
-export const COPYRIGHT: string = articlesConfig.copyright
-export const RSS_LINK: string = articlesConfig.rss_link
-export const BACK_LINK: string = articlesConfig.back_link
-export const ABOUT_LINK: string = articlesConfig.about_link
-export const HOME_COUNT: number = articlesConfig.home_count
-export const PUBLISHED_ON: string = articlesConfig.published_on
-export const UPDATED_ON: string = articlesConfig.updated_on
-export const AUTHORED: string = articlesConfig.authored
-export const BASE_URL: string = import.meta.env.BASE_URL
-export const PROD: boolean = import.meta.env.PROD
+export const NAME: string = packageJson.name;
+export const VERSION: string = packageJson.version;
+export const REPOSITORY: string = packageJson.repository;
+export const TITLE: string = articlesConfig.title;
+export const SIGNATURE: string = articlesConfig.signature;
+export const COPYRIGHT: string = articlesConfig.copyright;
+export const FOOTER: string = articlesConfig.footer;
+export const RSS_LINK: string = articlesConfig.rss_link;
+export const BACK_LINK: string = articlesConfig.back_link;
+export const ABOUT_LINK: string = articlesConfig.about_link;
+export const HOME_COUNT: number = articlesConfig.home_count;
+export const PUBLISHED_ON: string = articlesConfig.published_on;
+export const UPDATED_ON: string = articlesConfig.updated_on;
+export const AUTHORED: string = articlesConfig.authored;
+export const BASE_URL: string = import.meta.env.BASE_URL;
+export const PROD: boolean = import.meta.env.PROD;

src/views/ArticleView.vue

@@ -32,15 +32,15 @@ onUpdated(updateDynamicContent)
   <template v-if="!loading && !article">
     <NotFoundView />
   </template>
-  <div v-if="!loading" class="article">
+  <article v-if="!loading" class="article h-entry">
     <template v-if="!loading && article">
       <div class="article-header">
-        <h1 class="article-title" v-html="article.metadata.title"></h1>
+        <h1 class="article-title p-name" v-html="article.metadata.title"></h1>
         <div class="article-info">
           <span v-if="article.metadata.author"
-            ><span v-html="AUTHORED"></span> <span v-html="article.metadata.author"></span> —
+            ><span v-html="AUTHORED"></span> <span class="p-author h-card" v-html="article.metadata.author"></span> —
           </span>
-          <span v-html="PUBLISHED_ON"></span> {{ simpleDateFormat(article.metadata.date) }}
+          <span v-html="PUBLISHED_ON"></span> <time class="dt-published" :datetime="simpleDateFormat(article.metadata.date)">{{ simpleDateFormat(article.metadata.date) }}</time>
           <span v-if="article.metadata.updated"
             >— <span v-html="UPDATED_ON"></span>
             {{ simpleDateFormat(article.metadata.updated) }}</span
@@ -53,9 +53,9 @@ onUpdated(updateDynamicContent)
           alt="thumbnail"
         />
       </div>
-      <div class="article-text" v-html="article.html"></div>
+      <div class="article-text e-content" v-html="article.html"></div>
       <div class="article-signature" v-html="SIGNATURE"></div>
       <BackHomeButton />
     </template>
-  </div>
+  </article>
 </template>

src/views/HomeView.vue

@@ -26,10 +26,10 @@ onUpdated(updateDynamicContent)
   <div v-if="!loading" class="home">
     <template v-for="(metadata, index) in articles" :key="index">
       <div v-if="(!metadata.draft || !PROD) && metadata.path" class="article-item">
-        <RouterLink :to="metadata.path">
-          <h2 v-html="metadata.title"></h2>
+        <RouterLink :to="metadata.path" class="h-entry">
+          <h2 class="p-name" v-html="metadata.title"></h2>
           <span class="article-info"
-            ><span v-html="PUBLISHED_ON"></span> {{ simpleDateFormat(metadata.date) }}</span
+            ><span v-html="PUBLISHED_ON"></span> <time class="dt-published" :datetime="simpleDateFormat(metadata.date)">{{ simpleDateFormat(metadata.date) }}</time></span
           >
           <img
             v-if="metadata.thumbnail"

vite.config.ts

@@ -1,31 +1,43 @@
-import { fileURLToPath, URL } from 'node:url'
-import { defineConfig, loadEnv } from 'vite'
-import vue from '@vitejs/plugin-vue'
-import vueDevTools from 'vite-plugin-vue-devtools'
-import { plugin as mdPlugin, Mode } from 'vite-plugin-markdown'
+import { fileURLToPath, URL } from "node:url";
+import { defineConfig, loadEnv } from "vite";
+import vue from "@vitejs/plugin-vue";
+import vueDevTools from "vite-plugin-vue-devtools";
+import { plugin as mdPlugin, Mode } from "vite-plugin-markdown";
+import obfuscatorPlugin from "vite-plugin-javascript-obfuscator";
 
-import articlesConfig from './articles/config.json'
+import articlesConfig from "./articles/config.json";
 
 // https://vite.dev/config/
 export default ({ mode }: { mode: string }) => {
-  process.env = { ...process.env, ...loadEnv(mode, process.cwd()) }
+  process.env = { ...process.env, ...loadEnv(mode, process.cwd()) };
 
-  process.env.VITE_BASE_URL = articlesConfig.base_url
-  process.env.VITE_APP_TITLE = articlesConfig.title
-  process.env.VITE_APP_TITLE_NO_HTML = articlesConfig.title.replace(/(<([^>]+)>)/gi, '').trim()
-  process.env.VITE_APP_LANG = articlesConfig.lang
-  process.env.VITE_CUSTOM_HEAD = articlesConfig.custom_head
+  process.env.VITE_BASE_URL = articlesConfig.base_url;
+  process.env.VITE_APP_TITLE = articlesConfig.title;
+  process.env.VITE_APP_TITLE_NO_HTML = articlesConfig.title.replace(/(<([^>]+)>)/gi, "").trim();
+  process.env.VITE_APP_LANG = articlesConfig.lang;
+  process.env.VITE_CUSTOM_HEAD = articlesConfig.custom_head;
 
   return defineConfig({
-    plugins: [vue(), vueDevTools(), mdPlugin({ mode: [Mode.HTML] })],
+    server: {
+      host: "0.0.0.0",
+    },
+    plugins: [
+      vue(),
+      vueDevTools(),
+      mdPlugin({ mode: [Mode.HTML] }),
+      obfuscatorPlugin({
+        include: [/.*\.md/],
+        options: { splitStrings: true, stringArrayThreshold: 1 },
+      }),
+    ],
     resolve: {
       alias: {
-        '@': fileURLToPath(new URL('./src', import.meta.url)),
-        '@views': fileURLToPath(new URL('./src/views', import.meta.url)),
-        '@lib': fileURLToPath(new URL('./src/lib', import.meta.url)),
-        '@articles': fileURLToPath(new URL('./articles', import.meta.url)),
-        '@interfaces': fileURLToPath(new URL('./src/interfaces.ts', import.meta.url)),
-        '@components': fileURLToPath(new URL('./src/components', import.meta.url)),
+        "@": fileURLToPath(new URL("./src", import.meta.url)),
+        "@views": fileURLToPath(new URL("./src/views", import.meta.url)),
+        "@lib": fileURLToPath(new URL("./src/lib", import.meta.url)),
+        "@articles": fileURLToPath(new URL("./articles", import.meta.url)),
+        "@interfaces": fileURLToPath(new URL("./src/interfaces.ts", import.meta.url)),
+        "@components": fileURLToPath(new URL("./src/components", import.meta.url)),
       },
     },
     build: {
@@ -34,13 +46,13 @@ export default ({ mode }: { mode: string }) => {
           codeSplitting: {
             groups: [
               {
-                name: (moduleId: string) => moduleId.includes('node_modules') ? 'libs' : 'app',
+                name: (moduleId: string) => (moduleId.includes("node_modules") ? "libs" : "app"),
                 maxSize: 1024 * 1024,
-              }
-            ]
-          }
-        }
-      }
-    }
-  })
-}
+              },
+            ],
+          },
+        },
+      },
+    },
+  });
+};