From f44cb836575da48df1825c495b43e0f74c4dc428 Mon Sep 17 00:00:00 2001 From: Simon Cambier Date: Sat, 25 Nov 2023 08:09:44 +0100 Subject: [PATCH] Meta tags --- src/app.html | 4 ++++ src/lib/utils.ts | 3 +++ src/routes/+page.svelte | 26 ++++++++++++++++++++------ src/routes/editor/+page.svelte | 3 ++- 4 files changed, 29 insertions(+), 7 deletions(-) diff --git a/src/app.html b/src/app.html index 68ea521..c83c4b9 100644 --- a/src/app.html +++ b/src/app.html @@ -13,6 +13,10 @@ npm/codemirror@5.65.16/lib/codemirror.min.css, npm/codemirror@5.65.16/theme/nord.min.css" /> + + + + %sveltekit.head% diff --git a/src/lib/utils.ts b/src/lib/utils.ts index ec930ae..146eb52 100644 --- a/src/lib/utils.ts +++ b/src/lib/utils.ts @@ -33,3 +33,6 @@ export function getLangFromUrl() { } export const byId = (id: string) => document.getElementById(id) + +export const staticMetaDescription = + 'Paste is a client-side paste service with no database, and no back-end code. The data is stored entirely in the shared link' diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte index 7ff54ac..e1f786e 100644 --- a/src/routes/+page.svelte +++ b/src/routes/+page.svelte @@ -10,12 +10,22 @@ import 'highlight.js/styles/nord.min.css' import TopBar from '../components/TopBar.svelte' import Icon from '@iconify/svelte' - import { getLangFromUrl } from '$lib/utils' + import { getLangFromUrl, staticMetaDescription } from '$lib/utils' let decompressed: string + let htmlContent: string let isMarkdown = false let isPlainText = false + // Meta description + $: metaDescription = (() => { + if (decompressed) { + const text = decompressed.slice(0, 100) + return text + (text.length === 100 ? '...' : '') + } + return staticMetaDescription + })() + onMount(async () => { let lang = getLangFromUrl() lang = lang === 'mrwn' || lang === 'gflm' ? 'md' : lang // back compatiblity with old links @@ -37,7 +47,7 @@ .use(rehypeStringify) .process(decompressed) isMarkdown = true - decompressed = html.toString() + htmlContent = html.toString() } // Plain text else if (lang === 'plt' || !lang) { @@ -45,7 +55,7 @@ } // Code else { - decompressed = hljs.highlight(lang, decompressed).value + htmlContent = hljs.highlight(lang, decompressed).value } } else { // Redirect to editor page @@ -59,7 +69,7 @@
- {#if decompressed} + {#if htmlContent || decompressed}
{#if isMarkdown} - {@html decompressed} + {@html htmlContent} {:else if isPlainText}
{decompressed}
{:else} - 
{@html decompressed}
+ 
{@html htmlContent}
{/if}
{/if} + + + +