Add OpenGraph tags for previews

This commit is contained in:
John Doe 2024-07-08 20:27:51 -04:00
parent 7de6dd9c7d
commit dcb612d276
10 changed files with 24 additions and 14 deletions

View file

@ -5,6 +5,12 @@
<link rel="stylesheet" href="global.css">
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta property="og:type" content="website" />
<meta property="og:image" content="https://femtostar.com/femtostar_logo.png" />
<meta property="og:description" content="Satellite communications, done differently." />
<meta name="description" content="Satellite communications, done differently.">
%sveltekit.head%
</head>
<body data-sveltekit-preload-data="hover">

View file

@ -3,7 +3,10 @@
</script>
<div class="femtoHeader">
<div class="femtoLogotypeContainer"><FemtoStarWordmark>FemtoStar</FemtoStarWordmark><!--<span class="femtoLogotype">FemtoStar<img src="../../Wordmark.svg" /></span>--></div>
<div class="femtoLogotypeContainer">
<FemtoStarWordmark>FemtoStar</FemtoStarWordmark>
<img class="hiddenLogo" src="../../femtostar_logo.png" alt="The FemtoStar Logo"/>
</div>
<h2>Satellite communications, done differently.</h2>
<div class="introText">
@ -32,6 +35,11 @@
text-align: center;
}
/* This invisible logo exists so that embedding or scraping this page without SVG support (e.g. embeds in Matrix posts) still get a logo */
.hiddenLogo{
display: none;
}
.femtoLogotypeContainer{
flex-direction: row;
align-items: center;
@ -39,17 +47,6 @@
text-align: center;
}
.femtoLogotype{
padding-left: 24px;
font-weight: 500;
font-family: Jost, sans-serif;
font-size: 3.0em;
}
svg {
padding-top: 1em;
}
h2 {
margin-top: 0.5em;
}

View file

@ -5,7 +5,7 @@
<div class="footer-container">
<FemtoStarLogo height={42} width={33} color="#FFFFFF75" />
<div class="footer-text">
Copyright 2024 - <a href="https://matrix.to/#/!COEHOXujBzfAHAVzPG:matrix.org">Matrix</a> / <a href="https://git.femtostar.com">Git</a> / <a href="https://twitter.com/FemtoStar">X</a>
Copyright 2024 - <a href="https://matrix.to/#/!COEHOXujBzfAHAVzPG:matrix.org">Matrix</a> / <a href="https://git.femtostar.com">Git</a> / <a href="https://x.com/FemtoStar">X</a>
</div>
</div>

View file

@ -11,6 +11,7 @@
<svelte:head>
<title>FemtoStar</title>
<meta property="og:title" content="FemtoStar" />
</svelte:head>
<div class="site">

View file

@ -6,6 +6,7 @@
<svelte:head>
<title>FemtoStar - About & Contact</title>
<meta property="og:title" content="FemtoStar - About & Contact" />
</svelte:head>
<div class="site">

View file

@ -6,6 +6,7 @@
<svelte:head>
<title>FemtoStar - Donate</title>
<meta property="og:title" content="FemtoStar - Donate" />
</svelte:head>
<div class="site">

View file

@ -7,6 +7,7 @@
<svelte:head>
<title>FemtoStar - FAQ</title>
<meta property="og:title" content="FemtoStar - FAQ" />
</svelte:head>
<div class="site">

View file

@ -6,6 +6,7 @@
<svelte:head>
<title>FemtoStar - Free & Open Source</title>
<meta property="og:title" content="FemtoStar - Free & Open Source" />
</svelte:head>
<div class="site">

View file

@ -6,6 +6,7 @@
<svelte:head>
<title>FemtoStar - Global Open Infrastructure</title>
<meta property="og:title" content="FemtoStar - Global Open Infrastructure" />
</svelte:head>
<div class="site">

View file

@ -5,7 +5,8 @@
</script>
<svelte:head>
<title>FemtoStar - Privacy by Design, not promise</title>
<title>FemtoStar - Privacy by Design, not just by promise</title>
<meta property="og:title" content="FemtoStar - Privacy by Design, not just by promise" />
</svelte:head>
<div class="site">