fixed meta tags and font styling
This commit is contained in:
parent
68f6ace293
commit
ae9f0de18e
|
|
@ -1,8 +1,5 @@
|
|||
---
|
||||
import "@srx/styles/base.css";
|
||||
import "@fontsource-variable/literata";
|
||||
import "@fontsource-variable/manrope";
|
||||
import "@fontsource-variable/martian-mono";
|
||||
import Navbar from "@srx/components/Navbar.astro";
|
||||
import Footer from "@srx/components/Footer.astro";
|
||||
|
||||
|
|
@ -11,21 +8,28 @@ interface Props {
|
|||
metaSubtitle?: string;
|
||||
metaDescription?: string;
|
||||
metaImage?: string;
|
||||
metaImageWidth?: string;
|
||||
metaImageHeight?: string;
|
||||
metaImageType?: string;
|
||||
metaAuthors?: string[];
|
||||
metaType?: string;
|
||||
metaDate?: string;
|
||||
metaSchema?: string;
|
||||
analyticsUrl?: string;
|
||||
analyticsId?: string;
|
||||
}
|
||||
|
||||
const {
|
||||
metaTitle = "srx digital",
|
||||
metaSubtitle = "Development & Operations",
|
||||
metaDescription = "",
|
||||
metaImage = "https://srx.digital/srx_digital_opengraph.jpg",
|
||||
metaDescription = "Hallo! Ich bin Sebastian aus Hamburg, spezialisiert auf Softwareentwicklung und Plattformengineering. Meine Welt sind Linux, Container, Cloud und Hardware, besonders wenn's um Open-Source geht. Ich helfe Firmen, ihre Digitalstrategien erfolgreich zu realisieren.",
|
||||
metaImage = `${Astro.url}srx_digital_opengraph.jpg`,
|
||||
metaAuthors = ["Sebastian Wendel"],
|
||||
metaType = "website",
|
||||
metaDate,
|
||||
metaSchema,
|
||||
analyticsUrl = "https://track.srx.dev/js/script.js",
|
||||
analyticsId = "srx.digital",
|
||||
} = Astro.props;
|
||||
|
||||
const isProduction = import.meta.env.MODE === "production";
|
||||
|
|
@ -33,32 +37,23 @@ const isProduction = import.meta.env.MODE === "production";
|
|||
|
||||
<html lang="de" class="overflow-x-hidden scroll-smooth">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>{`${metaTitle} - ${metaSubtitle}`}</title>
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta charset="utf-8" />
|
||||
<meta name="description" content={metaDescription} />
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<meta name="description" content={metaDescription} />
|
||||
<meta property="og:type" content={metaType} />
|
||||
<meta
|
||||
name="title"
|
||||
property="og:title"
|
||||
content={`${metaTitle} - ${metaSubtitle}`}
|
||||
/>
|
||||
<meta
|
||||
name="description"
|
||||
property="og:description"
|
||||
content={metaDescription}
|
||||
/>
|
||||
|
||||
<!-- Facebook Meta Tags -->
|
||||
<meta property="og:url" content={Astro.url} />
|
||||
<meta name="image" property="og:image" content={metaImage} />
|
||||
<meta property="og:type" content={metaType} />
|
||||
<meta property="og:title" content={`${metaTitle} - ${metaSubtitle}`} />
|
||||
<meta property="og:description" content={metaDescription} />
|
||||
<meta property="og:image" content={metaImage} />
|
||||
<meta property="og:image:alt" content={metaDescription} />
|
||||
{
|
||||
metaDate && (
|
||||
<meta
|
||||
name="date"
|
||||
property="og:article:published_time"
|
||||
content={metaDate}
|
||||
/>
|
||||
<meta property="og:article:published_time" content={metaDate} />
|
||||
)
|
||||
}
|
||||
{
|
||||
|
|
@ -70,6 +65,21 @@ const isProduction = import.meta.env.MODE === "production";
|
|||
/>
|
||||
))
|
||||
}
|
||||
|
||||
<!-- Twitter Meta Tags -->
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta name="twitter:title" content={`${metaTitle} - ${metaSubtitle}`} />
|
||||
<meta name="twitter:description" content={metaDescription} />
|
||||
{
|
||||
metaAuthors?.map((author) => (
|
||||
<meta name="twitter:creator" content={author} />
|
||||
))
|
||||
}
|
||||
<meta property="twitter:url" content={Astro.url} />
|
||||
<meta property="twitter:domain" content={Astro.url.host} />
|
||||
<meta property="twitter:image" content={metaImage} />
|
||||
|
||||
<!-- Linking Data -->
|
||||
{
|
||||
metaSchema && (
|
||||
<script
|
||||
|
|
@ -79,11 +89,13 @@ const isProduction = import.meta.env.MODE === "production";
|
|||
/>
|
||||
)
|
||||
}
|
||||
|
||||
<!-- Environment dependent Includes -->
|
||||
{
|
||||
isProduction && (
|
||||
<script
|
||||
src="https://track.srx.dev/js/script.js"
|
||||
data-domain="srx.digital"
|
||||
src={analyticsUrl}
|
||||
data-domain={analyticsId}
|
||||
is:inline
|
||||
defer
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -2,6 +2,11 @@
|
|||
@import "tailwindcss/components";
|
||||
@import "tailwindcss/utilities";
|
||||
|
||||
@import "@fontsource-variable/literata";
|
||||
@import "@fontsource-variable/manrope";
|
||||
@import "@fontsource-variable/martian-mono";
|
||||
|
||||
|
||||
:root {
|
||||
--font-sans: "Manrope";
|
||||
--font-serif: "Literata";
|
||||
|
|
|
|||
Loading…
Reference in a new issue