@cenk1cenk2/md-printer 2.20.11 → 2.21.0

package/dist/commands/index.mjs

@@ -1,6 +1,8 @@
 import { DEFAULT_LANGUAGE, I18N_DIRECTORY, RequiredTemplateFiles, TEMPLATE_DIRECTORY, TemplateFiles } from "../constants/template.constants.mjs";
 import { InputFileType, OutputFileType } from "../constants/file.constants.mjs";
 import { I18nService } from "../services/i18n.service.mjs";
+import { ATrustAdapter } from "../services/signature/adapters/a-trust.adapter.mjs";
+import { SignatureService } from "../services/signature/signature.service.mjs";
 import "../services/index.mjs";
 import tailwind from "@tailwindcss/postcss";
 import { watch } from "chokidar";
@@ -70,7 +72,10 @@ var MDPrinter = class extends Command {
 			char: "d",
 			description: "Run with Chrome browser instead of publishing the file."
 		}),
-		continuous: Flags.boolean({ description: "Render PDF as a single continuous page without page breaks." })
+		continuous: Flags.boolean({ description: "Render PDF as a single continuous page without page breaks." }),
+		sign: Flags.boolean({ description: "Sign the PDF with a qualified electronic signature through ID Austria (A-Trust)." }),
+		["sign-provider"]: Flags.string({ description: "Signature provider, defaults to a-trust. Overwrites the one defined in front-matter and template settings." }),
+		["sign-certificate"]: Flags.string({ description: "Signer certificate (DER or PEM) used for the visible signature block and to verify the returned signature." })
 	};
 	static args = {
 		file: Args.string({ description: "File to be processed." }),
@@ -88,17 +93,24 @@ var MDPrinter = class extends Command {
 	cs;
 	fs;
 	i18n;
+	signature;
 	browser;
 	register(cli) {
 		return {
 			...cli,
-			providers: [...cli.providers ?? [], I18nService]
+			providers: [
+				...cli.providers ?? [],
+				I18nService,
+				ATrustAdapter,
+				SignatureService
+			]
 		};
 	}
 	async shouldRunBefore() {
 		this.cs = this.app.get(ConfigService);
 		this.fs = this.app.get(FileSystemService);
 		this.i18n = this.app.get(I18nService);
+		this.signature = this.app.get(SignatureService);
 		await this.app.get(ParserService).register(JsonParser, YamlParser);
 		this.nunjucks.addFilter("markdown_to_html", (markdown) => {
 			return new showdown.Converter().makeHtml(markdown);
@@ -147,6 +159,7 @@ var MDPrinter = class extends Command {
 			ctx.options = await this.cs.extend([paths["settings.json"], {
 				dest: this.args?.output ?? ctx.metadata?.dest ?? `${basename(this.args.file, extname(this.args.file))}.${this.flags["output-filetype"]}`,
 				...title ? { document_title: title } : {},
+				...ctx.metadata?.sign ? { sign: ctx.metadata.sign } : {},
 				launch_options: { executablePath: this.flags.browser }
 			}]);
 			ctx.renderContinuous = this.flags.continuous || ctx.metadata?.continuous === true || ctx.options.continuous === true;
@@ -176,6 +189,7 @@ var MDPrinter = class extends Command {
 				ctx.options.css = await postcss([tailwind({ base: ctx.templates })]).process(await this.fs.read(paths["tailwind.css"]), { from: paths["tailwind.css"] }).then((result) => result.css);
 			}
 			await this.applyTranslations(ctx);
+			await this.applySignature(ctx);
 			await this.applyDocumentTitle(ctx);
 		} }]);
 	}
@@ -202,7 +216,8 @@ var MDPrinter = class extends Command {
 	context(ctx) {
 		const context = {
 			...ctx.metadata ?? {},
-			content: ctx.content
+			content: ctx.content,
+			signature: ctx.signature ?? null
 		};
 		if (ctx.t) {
 			context.t = ctx.t;
@@ -216,6 +231,21 @@ var MDPrinter = class extends Command {
 		ctx.options.document_title = this.nunjucks.renderString(title, this.context(ctx));
 		this.logger.info("Document title will be: %s", ctx.options.document_title);
 	}
+	async applySignature(ctx) {
+		ctx.options.sign = {
+			...ctx.options.sign,
+			...this.flags.sign ? { enabled: true } : {},
+			...this.flags["sign-provider"] ? { provider: this.flags["sign-provider"] } : {},
+			...this.flags["sign-certificate"] ? { certificate: this.flags["sign-certificate"] } : {}
+		};
+		if (!ctx.options.sign.enabled) return;
+		if (ctx.options.as_html) throw new Error("Signing is only supported for PDF output.");
+		this.signature.adapter(ctx.options.sign.provider);
+		ctx.signingTime = /* @__PURE__ */ new Date();
+		if (ctx.options.sign.certificate) ctx.certificate = await this.signature.certificate(ctx.options.sign.certificate, ctx.signingTime);
+		ctx.signature = this.signature.describe(ctx.signingTime, ctx.certificate);
+		this.logger.info("Document will be signed: %o", ctx.signature);
+	}
 	async applyTranslations(ctx) {
 		ctx.language = this.flags.language ?? ctx.metadata?.language ?? ctx.options.i18n?.language ?? "en";
 		ctx.t = await this.i18n.load(join(ctx.templates, I18N_DIRECTORY), {
@@ -294,6 +324,17 @@ var MDPrinter = class extends Command {
 			resolve(null);
 		}));
 		if (output) {
+			if (ctx.signature) {
+				if (this.flags.watch) this.logger.warn("Skipping the signature in watch mode, run without --watch to sign the document.");
+				else {
+					output.content = await this.signature.sign(Buffer.from(output.content), {
+						...ctx.options.sign,
+						date: ctx.signingTime,
+						certificate: ctx.certificate
+					});
+					this.logger.info("Document is signed.");
+				}
+			}
 			if (this.flags.stdout) {
 				process.stdout.write(output.content);
 				return;

package/dist/interfaces/signature.interface.mjs

@@ -0,0 +1 @@
+export {  };

package/dist/services/index.mjs

@@ -1,3 +1,7 @@
 import { I18nService } from "./i18n.service.mjs";
+import { SignatureAdapter } from "./signature/signature.adapter.mjs";
+import { ATrustAdapter } from "./signature/adapters/a-trust.adapter.mjs";
+import { SignatureService } from "./signature/signature.service.mjs";
+import "./signature/index.mjs";
 
-export { I18nService };
+export { ATrustAdapter, I18nService, SignatureAdapter, SignatureService };

package/dist/services/signature/adapters/a-trust.adapter.mjs

@@ -0,0 +1,116 @@
+import __decorateMetadata from "../../../_virtual/_@oxc-project_runtime@0.153.0/helpers/esm/decorateMetadata.mjs";
+import __decorate from "../../../_virtual/_@oxc-project_runtime@0.153.0/helpers/esm/decorate.mjs";
+import { SignatureAdapter } from "../signature.adapter.mjs";
+import { LoggerService } from "@cenk1cenk2/oclif-common";
+import { Injectable } from "@nestjs/common";
+import { spawn } from "child_process";
+import { readFile } from "fs/promises";
+import { createServer } from "http";
+
+//#region src/services/signature/adapters/a-trust.adapter.ts
+var _ATrustAdapter;
+let ATrustAdapter = class ATrustAdapter extends SignatureAdapter {
+	static {
+		_ATrustAdapter = this;
+	}
+	logger;
+	static ENDPOINT = "https://service.a-trust.at/mobile/https-security-layer-request/default.aspx";
+	static NAMESPACE = "http://www.buergerkarte.at/namespaces/securitylayer/1.2#";
+	static TIMEOUT = 6e5;
+	static PAGE = "./a-trust.html";
+	name = "a-trust";
+	constructor(logger) {
+		super();
+		this.logger = logger;
+		this.logger.setup(this.constructor.name);
+	}
+	async sign(request) {
+		return this.collect(await this.session(this.request(request)));
+	}
+	request({ pdf, excluded: [from, to] }) {
+		const data = Buffer.from(pdf).fill(0, from, to + 1);
+		return [
+			"<?xml version=\"1.0\" encoding=\"UTF-8\"?>",
+			`<sl:CreateCMSSignatureRequest xmlns:sl="${_ATrustAdapter.NAMESPACE}" Structure="detached" PAdESCompatibility="true">`,
+			"<sl:KeyboxIdentifier>SecureSignatureKeypair</sl:KeyboxIdentifier>",
+			"<sl:DataObject>",
+			"<sl:MetaInfo><sl:MimeType>application/pdf</sl:MimeType></sl:MetaInfo>",
+			`<sl:Content><sl:Base64Content>${data.toString("base64")}</sl:Base64Content></sl:Content>`,
+			`<sl:ExcludedByteRange><sl:From>${from}</sl:From><sl:To>${to}</sl:To></sl:ExcludedByteRange>`,
+			"</sl:DataObject>",
+			"</sl:CreateCMSSignatureRequest>"
+		].join("");
+	}
+	async session(request) {
+		let url = _ATrustAdapter.ENDPOINT;
+		let response = await fetch(url, {
+			method: "POST",
+			body: new URLSearchParams([["XMLRequest", request]]),
+			redirect: "manual"
+		});
+		while (response.status === 301 || response.status === 302) {
+			url = new URL(response.headers.get("location"), url).href;
+			response = await fetch(url, { redirect: "manual" });
+		}
+		if (!response.ok || !url.includes("/identification.aspx")) throw new Error(`A-Trust did not start a signing session, ended at ${url} with ${response.status}: ${(await response.text()).slice(0, 500)}`);
+		this.logger.debug("A-Trust signing session started: %s", url);
+		return url;
+	}
+	async collect(login) {
+		let resolve;
+		let reject;
+		const result = new Promise((done, fail) => {
+			resolve = done;
+			reject = fail;
+		});
+		const page = await readFile(new URL(_ATrustAdapter.PAGE, import.meta.url));
+		const server = createServer(async (req, res) => {
+			if (req.method === "GET" && req.url === "/session") {
+				res.setHeader("content-type", "application/json");
+				res.writeHead(200);
+				return res.end(JSON.stringify({ login }));
+			}
+			if (req.method !== "POST" || req.url !== "/signature") {
+				res.setHeader("content-type", "text/html; charset=utf-8");
+				res.writeHead(200);
+				return res.end(page);
+			}
+			let body = "";
+			for await (const chunk of req) body += chunk;
+			const cms = (body.match(/<(?:\w+:)?CMSSignature>([^<]+)</)?.[1] ?? body).replace(/\s+/g, "");
+			if (!/^MII[A-Za-z0-9+/=]+$/.test(cms)) {
+				res.writeHead(400);
+				return res.end("This does not look like a signature, it should start with MII.");
+			}
+			res.writeHead(200);
+			res.end("Signature received, you can close this tab.");
+			resolve(Buffer.from(cms, "base64"));
+		});
+		await new Promise((done) => server.listen(0, "127.0.0.1", done));
+		const url = `http://127.0.0.1:${server.address().port}/`;
+		this.logger.info("Sign the document in the browser, then paste the signature back: %s", url);
+		this.open(url);
+		const timeout = setTimeout(() => reject(/* @__PURE__ */ new Error("Timed out waiting for the signature.")), _ATrustAdapter.TIMEOUT);
+		return result.finally(() => {
+			clearTimeout(timeout);
+			server.close();
+		});
+	}
+	open(url) {
+		const [command, ...args] = process.platform === "darwin" ? ["open", url] : process.platform === "win32" ? [
+			"cmd",
+			"/c",
+			"start",
+			"",
+			url
+		] : ["xdg-open", url];
+		spawn(command, args, {
+			stdio: "ignore",
+			detached: true
+		}).on("error", (err) => this.logger.warn("Can not open the browser, open the link manually: %s", err.message)).unref();
+	}
+};
+ATrustAdapter = _ATrustAdapter = __decorate([Injectable(), __decorateMetadata("design:paramtypes", [typeof LoggerService === "undefined" ? Object : LoggerService])], ATrustAdapter);
+
+//#endregion
+export { ATrustAdapter };

package/dist/services/signature/adapters/a-trust.html

@@ -0,0 +1,77 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <title>md-printer signature</title>
+    <style>
+      body {
+        font-family: system-ui, sans-serif;
+        margin: 0;
+        padding: 16px;
+        background: #f4f4f5;
+        color: #18181b;
+      }
+      main {
+        max-width: 560px;
+        margin: 0 auto;
+        display: grid;
+        gap: 12px;
+      }
+      iframe {
+        width: 100%;
+        height: 600px;
+        border: 0;
+        border-radius: 12px;
+        background: #fff;
+      }
+      textarea {
+        width: 100%;
+        height: 96px;
+        box-sizing: border-box;
+        border-radius: 8px;
+        padding: 8px;
+        font: 12px ui-monospace, monospace;
+      }
+      button {
+        width: 100%;
+        padding: 10px;
+        border: 0;
+        border-radius: 8px;
+        background: #18181b;
+        color: #fff;
+        font-weight: 600;
+      }
+    </style>
+  </head>
+  <body>
+    <main id="main">
+      <iframe id="login"></iframe>
+      <p>Log in and approve the signature. When the signature starting with <code>MII</code> shows up above, paste it here.</p>
+      <form id="form">
+        <textarea name="signature" placeholder="MII..." required></textarea>
+        <button>Sign PDF</button>
+      </form>
+    </main>
+    <script>
+      fetch('/session')
+        .then((response) => response.json())
+        .then(({ login }) => (document.getElementById('login').src = login))
+
+      document.getElementById('form').addEventListener('submit', async (event) => {
+        event.preventDefault()
+
+        const response = await fetch('/signature', { method: 'POST', body: new FormData(event.target).get('signature') })
+        const message = document.createElement('p')
+
+        message.textContent = await response.text()
+
+        if (response.ok) {
+          document.getElementById('main').replaceChildren(message)
+        } else {
+          event.target.append(message)
+        }
+      })
+    </script>
+  </body>
+</html>

package/dist/services/signature/index.mjs

@@ -0,0 +1,5 @@
+import { SignatureAdapter } from "./signature.adapter.mjs";
+import { ATrustAdapter } from "./adapters/a-trust.adapter.mjs";
+import { SignatureService } from "./signature.service.mjs";
+
+export { ATrustAdapter, SignatureAdapter, SignatureService };

package/dist/services/signature/signature.adapter.mjs

@@ -0,0 +1,5 @@
+//#region src/services/signature/signature.adapter.ts
+var SignatureAdapter = class {};
+
+//#endregion
+export { SignatureAdapter };

package/dist/services/signature/signature.service.mjs

@@ -0,0 +1,97 @@
+import __decorateMetadata from "../../_virtual/_@oxc-project_runtime@0.153.0/helpers/esm/decorateMetadata.mjs";
+import __decorate from "../../_virtual/_@oxc-project_runtime@0.153.0/helpers/esm/decorate.mjs";
+import { ATrustAdapter } from "./adapters/a-trust.adapter.mjs";
+import { isAbsolute, join } from "path";
+import { FileSystemService } from "@cenk1cenk2/oclif-common";
+import { Injectable } from "@nestjs/common";
+import { plainAddPlaceholder } from "@signpdf/placeholder-plain";
+import { SUBFILTER_ETSI_CADES_DETACHED, findByteRange, removeTrailingNewLine } from "@signpdf/utils";
+import { X509Certificate } from "crypto";
+import { homedir } from "os";
+
+//#region src/services/signature/signature.service.ts
+var _SignatureService;
+let SignatureService = class SignatureService {
+	static {
+		_SignatureService = this;
+	}
+	fs;
+	static LENGTH = 16384;
+	adapters;
+	constructor(fs, aTrust) {
+		this.fs = fs;
+		this.adapters = [aTrust];
+	}
+	get providers() {
+		return this.adapters.map((adapter) => adapter.name);
+	}
+	async certificate(file, date) {
+		const path = file.replace(/^~(?=\/|$)/, homedir());
+		const certificate = new X509Certificate(await this.fs.extra.readFile(isAbsolute(path) ? path : join(process.cwd(), path)));
+		if (date < certificate.validFromDate || date > certificate.validToDate) throw new Error(`Signing certificate is not valid at ${date.toISOString()}, it is valid from ${certificate.validFrom} to ${certificate.validTo}.`);
+		return certificate;
+	}
+	describe(date, certificate) {
+		return {
+			date: date.toISOString().replace("T", " ").replace(/\.\d+Z$/, " UTC"),
+			name: certificate && this.commonName(certificate.subject),
+			issuer: certificate && this.commonName(certificate.issuer),
+			serial: certificate?.serialNumber
+		};
+	}
+	async sign(pdf, options) {
+		const request = this.prepare(pdf, options);
+		const cms = await this.adapter(options.provider).sign(request);
+		if (options.certificate && !cms.includes(options.certificate.raw)) throw new Error("The returned signature was not created with the configured certificate, the signature block would show the wrong signer.");
+		return this.embed(request, cms);
+	}
+	adapter(provider) {
+		if (!provider) return this.adapters[0];
+		const adapter = this.adapters.find((adapter) => adapter.name === provider);
+		if (!adapter) throw new Error(`Unknown signature provider "${provider}", available: ${this.providers.join(", ")}`);
+		return adapter;
+	}
+	prepare(pdf, options) {
+		const prepared = removeTrailingNewLine(plainAddPlaceholder({
+			pdfBuffer: pdf,
+			reason: options.reason ?? "",
+			location: options.location ?? "",
+			contactInfo: options.contact ?? "",
+			name: "",
+			signingTime: options.date,
+			signatureLength: _SignatureService.LENGTH,
+			subFilter: SUBFILTER_ETSI_CADES_DETACHED,
+			appName: "md-printer"
+		}));
+		const { byteRangePlaceholder, byteRangePlaceholderPosition } = findByteRange(prepared);
+		if (!byteRangePlaceholder) throw new Error("Can not find the signature byte range placeholder in the PDF.");
+		const byteRangeEnd = byteRangePlaceholderPosition + byteRangePlaceholder.length;
+		const from = prepared.indexOf("<", prepared.indexOf("/Contents ", byteRangeEnd));
+		const to = prepared.indexOf(">", from);
+		return {
+			pdf: Buffer.concat([
+				prepared.subarray(0, byteRangePlaceholderPosition),
+				Buffer.from(`/ByteRange [0 ${from} ${to + 1} ${prepared.length - to - 1}]`.padEnd(byteRangePlaceholder.length, " ")),
+				prepared.subarray(byteRangeEnd)
+			]),
+			excluded: [from, to]
+		};
+	}
+	embed({ pdf, excluded: [from, to] }, cms) {
+		const signature = cms.toString("hex");
+		const length = to - from - 1;
+		if (signature.length > length) throw new Error(`Signature is ${signature.length} bytes but the placeholder only fits ${length}.`);
+		return Buffer.concat([
+			pdf.subarray(0, from + 1),
+			Buffer.from(signature.padEnd(length, "0")),
+			pdf.subarray(to)
+		]);
+	}
+	commonName(name) {
+		return name.split("\n").find((part) => part.startsWith("CN="))?.slice(3);
+	}
+};
+SignatureService = _SignatureService = __decorate([Injectable(), __decorateMetadata("design:paramtypes", [typeof FileSystemService === "undefined" ? Object : FileSystemService, typeof ATrustAdapter === "undefined" ? Object : ATrustAdapter])], SignatureService);
+
+//#endregion
+export { SignatureService };

package/oclif.manifest.json

@@ -153,6 +153,26 @@
           "name": "continuous",
           "allowNo": false,
           "type": "boolean"
+        },
+        "sign": {
+          "description": "Sign the PDF with a qualified electronic signature through ID Austria (A-Trust).",
+          "name": "sign",
+          "allowNo": false,
+          "type": "boolean"
+        },
+        "sign-provider": {
+          "description": "Signature provider, defaults to a-trust. Overwrites the one defined in front-matter and template settings.",
+          "name": "sign-provider",
+          "hasDynamicHelp": false,
+          "multiple": false,
+          "type": "option"
+        },
+        "sign-certificate": {
+          "description": "Signer certificate (DER or PEM) used for the visible signature block and to verify the returned signature.",
+          "name": "sign-certificate",
+          "hasDynamicHelp": false,
+          "multiple": false,
+          "type": "option"
         }
       },
       "hasDynamicHelp": false,
@@ -165,5 +185,5 @@
       "enableJsonFlag": false
     }
   },
-  "version": "2.20.11"
+  "version": "2.21.0"
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cenk1cenk2/md-printer",
-  "version": "2.20.11",
+  "version": "2.21.0",
   "description": "A markdown printer.",
   "module": "dist/index.mjs",
   "type": "module",
@@ -50,10 +50,12 @@
   ],
   "dependencies": {
     "@cenk1cenk2/oclif-common": "^7.1.0",
-    "@listr2/manager": "^4.2.6",
+    "@listr2/manager": "^4.3.1",
     "@nestjs/common": "^12.1.2",
     "@oclif/core": "^5.1.2",
     "@oclif/plugin-help": "^7.0.2",
+    "@signpdf/placeholder-plain": "^3.3.0",
+    "@signpdf/utils": "^3.3.0",
     "@tailwindcss/forms": "^0.5.11",
     "@tailwindcss/postcss": "^4.3.3",
     "@tailwindcss/typography": "^0.5.20",
@@ -62,10 +64,10 @@
     "get-port": "^7.2.0",
     "gray-matter": "^4.0.3",
     "i18next": "^26.4.2",
-    "listr2": "^11.1.1",
+    "listr2": "^11.2.0",
     "md-to-pdf": "^5.2.5",
     "nunjucks": "^3.2.4",
-    "postcss": "^8.5.28",
+    "postcss": "^8.5.29",
     "puppeteer": "^25.12.0",
     "rxjs": "^7.8.2",
     "showdown": "^2.1.0",
@@ -74,15 +76,15 @@
     "yaml": "^2.9.1"
   },
   "devDependencies": {
-    "@cenk1cenk2/cz-cc": "^3.0.2",
-    "@cenk1cenk2/eslint-config": "^3.3.7",
+    "@cenk1cenk2/cz-cc": "^3.0.6",
+    "@cenk1cenk2/eslint-config": "^3.3.9",
     "@tsconfig/node24": "^24.0.5",
     "@types/fs-extra": "^11.0.4",
     "@types/node": "^24.19.1",
     "@types/nunjucks": "^3.2.6",
     "@types/showdown": "^2.0.6",
     "eslint": "^10.12.0",
-    "execa": "^10.0.1",
+    "execa": "^10.1.0",
     "globby": "^16.2.4",
     "oclif": "^6.0.2",
     "prettier": "^3.9.9",

package/templates/invoice/i18n/de.yaml

@@ -8,6 +8,12 @@ sections:
   notes: NOTIZEN
 invoice: RECHNUNG
 signature: UNTERSCHRIFT
+signed:
+  title: Digital signiert
+  by: Unterzeichner
+  date: Datum
+  issuer: Zertifikat
+  verify: Dieses Dokument ist qualifiziert elektronisch signiert. Prüfung unter
 fields:
   date: Datum
   id: Rechnungsnr.

package/templates/invoice/i18n/en.yaml

@@ -8,6 +8,12 @@ sections:
   notes: NOTES
 invoice: INVOICE
 signature: SIGNATURE
+signed:
+  title: Digitally signed
+  by: Signed by
+  date: Date
+  issuer: Certificate
+  verify: This document carries a qualified electronic signature. Verify it at
 fields:
   date: Date
   id: Invoice#

package/templates/invoice/template.html.j2

@@ -178,10 +178,47 @@
         {{ content | safe }}<br />
       </div>
       <div class="col-span-1"></div>
+      {% if signature %}
+      <div class="col-span-5 flex flex-col justify-center m-8 mr-16">
+        <div class="w-full overflow-hidden rounded-xl border-y-2 shadow-md shadow-gray-300 border-gray-900! text-xs">
+          <div class="flex items-center gap-3 px-5 py-3 bg-gray-900 text-white">
+            <svg class="w-5 h-5 shrink-0" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
+              stroke-linecap="round" stroke-linejoin="round">
+              <path d="M12 3l7 3v6c0 4.5-3 7.5-7 9-4-1.5-7-4.5-7-9V6l7-3z" />
+              <path d="M9 12l2 2 4-4" />
+            </svg>
+            <span class="font-extrabold uppercase tracking-wider">{{ t('signed.title') }}</span>
+          </div>
+          <div class="flex flex-col px-5 py-2">
+            {% if signature.name %}
+            <div class="flex justify-between gap-4 py-2">
+              <span class="font-semibold text-gray-400">{{ t('signed.by') }}</span>
+              <span class="font-semibold text-right">{{ signature.name }}</span>
+            </div>
+            {% endif %}
+            <div class="flex justify-between gap-4 py-2 border-t border-t-gray-100/30">
+              <span class="font-semibold text-gray-400">{{ t('signed.date') }}</span>
+              <span class="text-right">{{ signature.date }}</span>
+            </div>
+            {% if signature.issuer %}
+            <div class="flex justify-between gap-4 py-2 border-t border-t-gray-100/30">
+              <span class="font-semibold text-gray-400">{{ t('signed.issuer') }}</span>
+              <span class="text-right text-[0.6rem]">{{ signature.issuer }} · {{ signature.serial }}</span>
+            </div>
+            {% endif %}
+          </div>
+          <p class="px-5 py-3 bg-gray-50 text-[0.6rem] text-gray-400 leading-snug">
+            {{ t('signed.verify') }}
+            <a href="https://www.signaturpruefung.gv.at" class="font-semibold text-gray-900 underline">signaturpruefung.gv.at</a>
+          </p>
+        </div>
+      </div>
+      {% else %}
       <div
         class="col-span-5 flex flex-col justify-end text-center m-8 mr-16 p-4 pb-0 border-2 border-gray-50! rounded-xl text-xs text-gray-100 h-36">
         <p>{{ t('signature') }}</p>
       </div>
+      {% endif %}
     </section>
   </div>
 </body>