Start implementation for blog posts
This commit is contained in:
Michael Rieger
@@ -19,6 +19,9 @@ const isEnglish = Astro.currentLocale === "en";
|
||||
|
||||
<nav>
|
||||
<ul>
|
||||
<li>
|
||||
<a class="hoverable" href="/blog">Blog</a>
|
||||
</li>
|
||||
<li>
|
||||
<a class="hoverable" href="/imprint">Imprint</a>
|
||||
</li>
|
||||
|
||||
@@ -0,0 +1,13 @@
|
||||
// 1. Import utilities from `astro:content`
|
||||
import { defineCollection, z } from 'astro:content';
|
||||
|
||||
// 2. Import loader(s)
|
||||
import { glob, file } from 'astro/loaders';
|
||||
|
||||
// 3. Define your collection(s)
|
||||
const blog = defineCollection({
|
||||
loader: glob({ pattern: "**/*.md", base: "./src/data/blog" }),
|
||||
});
|
||||
|
||||
// 4. Export a single `collections` object to register your collection(s)
|
||||
export const collections = { blog };
|
||||
@@ -2,9 +2,12 @@
|
||||
import Cursor from "../components/Cursor.astro";
|
||||
import GlobalStyles from "../components/GlobalStyles.astro";
|
||||
import Header from "../components/Header.astro";
|
||||
import Logo from "../assets/ci/icon-only.svg";
|
||||
|
||||
const { title } = Astro.props;
|
||||
const { pageTitle } = Astro.props;
|
||||
const isDev = import.meta.env.DEV;
|
||||
const title = pageTitle
|
||||
? `${pageTitle} | Tideshift Digital`
|
||||
: "Tideshift Digital - Building The Web On Your Terms";
|
||||
---
|
||||
|
||||
<!doctype html>
|
||||
@@ -15,7 +18,7 @@ const { title } = Astro.props;
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>
|
||||
Tideshift Digital - {title || "Building The Web On Your Terms"}
|
||||
{title}
|
||||
</title>
|
||||
<meta
|
||||
name="description"
|
||||
@@ -28,11 +31,7 @@ const { title } = Astro.props;
|
||||
<meta name="author" content="Michael Rieger" />
|
||||
<meta name="application-name" content="Tideshift Digital" />
|
||||
<link rel="canonical" href="https://tideshiftdigital.com/" />
|
||||
<meta
|
||||
property="og:title"
|
||||
content={"Tideshift Digital - " + title ||
|
||||
"Building The Web On Your Terms"}
|
||||
/>
|
||||
<meta property="og:title" content={title} />
|
||||
<meta
|
||||
property="og:description"
|
||||
content="From concept to launch — websites, apps, and digital solutions that work hard, so you can play hard. Based in Vienna, we turn ideas into live products."
|
||||
@@ -42,22 +41,23 @@ const { title } = Astro.props;
|
||||
<meta property="og:image" content="/assets/img/og-image.jpg" />
|
||||
<meta property="og:site_name" content="Tideshift Digital" />
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta
|
||||
name="twitter:title"
|
||||
content={"Tideshift Digital - " + title ||
|
||||
"Building The Web On Your Terms"}
|
||||
/>
|
||||
<meta name="twitter:title" content={title} />
|
||||
<meta
|
||||
name="twitter:description"
|
||||
content="From concept to launch — websites, apps, and digital solutions that work hard, so you can play hard. Based in Vienna."
|
||||
/>
|
||||
<meta name="twitter:image" content="/assets/img/og-image.jpg" />
|
||||
|
||||
{
|
||||
!isDev ? (
|
||||
<script
|
||||
is:inline
|
||||
defer
|
||||
src="https://analytics.tideshiftdigital.com/script.js"
|
||||
data-website-id="00c032c0-8fd5-436c-a210-9df51c071c7b"></script>
|
||||
data-website-id="00c032c0-8fd5-436c-a210-9df51c071c7b"
|
||||
/>
|
||||
) : null
|
||||
}
|
||||
</head>
|
||||
<body>
|
||||
<GlobalStyles />
|
||||
@@ -0,0 +1,44 @@
|
||||
---
|
||||
import Cursor from "../components/Cursor.astro";
|
||||
import GlobalStyles from "../components/GlobalStyles.astro";
|
||||
|
||||
const isDev = import.meta.env.DEV;
|
||||
---
|
||||
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<title>Oops, this is weird</title>
|
||||
<meta name="author" content="Michael Rieger" />
|
||||
<meta name="application-name" content="Tideshift Digital" />
|
||||
<link rel="canonical" href="https://tideshiftdigital.com/" />
|
||||
{
|
||||
!isDev ? (
|
||||
<script
|
||||
is:inline
|
||||
defer
|
||||
src="https://analytics.tideshiftdigital.com/script.js"
|
||||
data-website-id="00c032c0-8fd5-436c-a210-9df51c071c7b"
|
||||
/>
|
||||
) : null
|
||||
}
|
||||
</head>
|
||||
<body>
|
||||
<GlobalStyles />
|
||||
|
||||
<slot />
|
||||
|
||||
<Cursor />
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<style>
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100dvh;
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,8 @@
|
||||
---
|
||||
const { frontmatter } = Astro.props;
|
||||
---
|
||||
|
||||
<meta charset="utf-8" />
|
||||
<h1>{frontmatter.title}</h1>
|
||||
<p>Written by {frontmatter.author}</p>
|
||||
<slot />
|
||||
@@ -0,0 +1,35 @@
|
||||
---
|
||||
import ErrorLayout from "../layouts/ErrorLayout.astro";
|
||||
---
|
||||
|
||||
<ErrorLayout pageTitle="Building The Web On Your Terms">
|
||||
<div class="error">
|
||||
<p class="number">404</p>
|
||||
<h1 class="title">Page not found</h1>
|
||||
<p class="description">Seems like you got lost in the waves</p>
|
||||
<a href="/">Back to home</a>
|
||||
</div>
|
||||
</ErrorLayout>
|
||||
|
||||
<style>
|
||||
.error {
|
||||
display: flex;
|
||||
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.number {
|
||||
font-size: clamp(3rem, 20vw + 2rem, 12rem);
|
||||
line-height: 1;
|
||||
font-weight: bold;
|
||||
color: var(--clr-ts-warm-red);
|
||||
}
|
||||
|
||||
.title {
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,20 @@
|
||||
---
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
const allPosts = Object.values(
|
||||
import.meta.glob("./posts/*.md", { eager: true }),
|
||||
);
|
||||
const pageTitle = "My Astro Learning Blog";
|
||||
---
|
||||
|
||||
<BaseLayout pageTitle={pageTitle}>
|
||||
<p>This is where I will post about my journey learning Astro.</p>
|
||||
<ul>
|
||||
{
|
||||
allPosts.map((post: any) => (
|
||||
<li>
|
||||
<a href={post.url}>{post.frontmatter.title}</a>
|
||||
</li>
|
||||
))
|
||||
}
|
||||
</ul>
|
||||
</BaseLayout>
|
||||
@@ -1,8 +1,8 @@
|
||||
---
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
---
|
||||
|
||||
<Layout title="Imprint">
|
||||
<BaseLayout pageTitle="Imprint">
|
||||
<main class="imprint">
|
||||
<h1>Imprint</h1>
|
||||
|
||||
@@ -28,7 +28,7 @@ import Layout from "../layouts/Layout.astro";
|
||||
<p>E-Mail: office@tideshiftdigital.com</p>
|
||||
</div>
|
||||
</main>
|
||||
</Layout>
|
||||
</BaseLayout>
|
||||
|
||||
<style scoped>
|
||||
h1 {
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
---
|
||||
import Hero from "../components/Hero.astro";
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
---
|
||||
|
||||
<Layout title="Building The Web On Your Terms">
|
||||
<BaseLayout pageTitle="Building The Web On Your Terms">
|
||||
<Hero />
|
||||
</Layout>
|
||||
</BaseLayout>
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
---
|
||||
import Layout from "../layouts/Layout.astro";
|
||||
import BaseLayout from "../layouts/BaseLayout.astro";
|
||||
---
|
||||
|
||||
<Layout title="Privacy Policy">
|
||||
<BaseLayout pageTitle="Privacy Policy">
|
||||
<main class="content">
|
||||
<h1>Privacy Policy</h1>
|
||||
|
||||
@@ -81,7 +81,7 @@ import Layout from "../layouts/Layout.astro";
|
||||
</p>
|
||||
</div>
|
||||
</main>
|
||||
</Layout>
|
||||
</BaseLayout>
|
||||
|
||||
<style>
|
||||
* + * {
|
||||
|
||||
Reference in New Issue
Block a user