feat: rel=me for profile links, don't show http:// prefix

This commit is contained in:
Sam 2023-03-26 00:07:51 +01:00
parent 0c187aaf84
commit 256a14a922
No known key found for this signature in database
GPG Key ID: B4EF20DDE721CAA1
3 changed files with 25 additions and 2 deletions

View File

@ -32,6 +32,7 @@
import { goto } from "$app/navigation"; import { goto } from "$app/navigation";
import renderMarkdown from "$lib/api/markdown"; import renderMarkdown from "$lib/api/markdown";
import ReportButton from "./ReportButton.svelte"; import ReportButton from "./ReportButton.svelte";
import ProfileLink from "./ProfileLink.svelte";
export let data: PageData; export let data: PageData;
@ -114,7 +115,7 @@
<div class="col-md d-flex align-items-center"> <div class="col-md d-flex align-items-center">
<ul class="list-unstyled"> <ul class="list-unstyled">
{#each data.links as link} {#each data.links as link}
<li><Icon name="globe" /> <a href={link}>{link}</a></li> <li><ProfileLink {link} /></li>
{/each} {/each}
</ul> </ul>
</div> </div>

View File

@ -0,0 +1,21 @@
<script lang="ts">
import { Icon } from "sveltestrap";
export let link: string;
let displayLink: string;
$: displayLink = prettifyLink(link);
const prettifyLink = (raw: string) => {
let out = raw;
if (raw.startsWith("https://")) out = raw.substring("https://".length);
else if (raw.startsWith("http://")) out = raw.substring("http://".length);
if (raw.endsWith("/")) out = raw.substring(0, raw.length - 1);
return out;
};
</script>
<Icon name="globe" />
<a href={link} rel="me nofollow noreferrer" target="_blank">{displayLink}</a>

View File

@ -11,6 +11,7 @@
import { userStore } from "$lib/store"; import { userStore } from "$lib/store";
import renderMarkdown from "$lib/api/markdown"; import renderMarkdown from "$lib/api/markdown";
import ReportButton from "../ReportButton.svelte"; import ReportButton from "../ReportButton.svelte";
import ProfileLink from "../ProfileLink.svelte";
export let data: PageData; export let data: PageData;
@ -51,7 +52,7 @@
<div class="col-md d-flex align-items-center"> <div class="col-md d-flex align-items-center">
<ul class="list-unstyled"> <ul class="list-unstyled">
{#each data.links as link} {#each data.links as link}
<li><Icon name="globe" /> <a href={link}>{link}</a></li> <li><ProfileLink {link} /></li>
{/each} {/each}
</ul> </ul>
</div> </div>