set metadata across the site
Signed-off-by: Xe Iaso <me@xeiaso.net>
This commit is contained in:
parent
48f9009f99
commit
b3920fc967
SSH Key Fingerprint:
SHA256:7EWsWanxCI427bJ0t3CA6LyqXnkPajReCxkUhbpJULU
@ -4,6 +4,12 @@ import { Button } from "@/components/ui/Button";
|
||||
import { allAuthors } from "@/.content-collections/generated";
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { Metadata } from "next";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "About Us",
|
||||
description: "Learn more about the team behind Techaro!",
|
||||
};
|
||||
|
||||
const TeamMember = ({
|
||||
name,
|
||||
|
||||
@ -21,6 +21,7 @@ const createFeed = () => {
|
||||
language: "en",
|
||||
favicon: `${baseUrl}/favicon.ico`,
|
||||
copyright: `All rights reserved ${new Date().getFullYear()}, Techaro Computing Canada`,
|
||||
generator: "Techaro.lol www",
|
||||
author: {
|
||||
name: "Techaro Staff",
|
||||
email: "staff@techaro.lol",
|
||||
|
||||
@ -76,5 +76,14 @@ export function generateMetadata({ params }: { params: PageParams }) {
|
||||
return {
|
||||
title: page.title,
|
||||
description: page.summary,
|
||||
authors: [
|
||||
{
|
||||
name: page.author?.displayName,
|
||||
},
|
||||
],
|
||||
openGraph: {
|
||||
//@ts-ignore
|
||||
images: page.image !== null ? [page.imageURL] : [],
|
||||
},
|
||||
} satisfies Metadata;
|
||||
}
|
||||
|
||||
@ -1,5 +1,12 @@
|
||||
import { allPosts } from "content-collections";
|
||||
import Image from "next/image";
|
||||
import { IconRss } from "@tabler/icons-react";
|
||||
import { Metadata } from "next";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Techaro Blog",
|
||||
description: "What have we been up to?",
|
||||
};
|
||||
|
||||
export default function Posts() {
|
||||
return (
|
||||
@ -11,6 +18,13 @@ export default function Posts() {
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div className="max-w-7xl sm:px-6 lg:px-8 mx-auto mt-4">
|
||||
<h2 className="text-3xl font-medium">All posts</h2>
|
||||
<a href="/blog.rss">
|
||||
<IconRss size={16} className="inline-block" /> Follow on RSS!
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div className="max-w-7xl mx-auto py-6 sm:px-6 lg:px-8 grid grid-cols-1 4xl:grid-cols-3">
|
||||
{allPosts.map((post) => (
|
||||
<div key={post._meta.path}>
|
||||
|
||||
@ -1,16 +1,11 @@
|
||||
"use client";
|
||||
import ContactForm from "@/components/contact-form";
|
||||
|
||||
import React, { useState } from 'react';
|
||||
import contactForm from '@/actions/contact';
|
||||
export const metadata = {
|
||||
title: "Contact Us",
|
||||
description: "Need our help? Get in touch!",
|
||||
};
|
||||
|
||||
const ContactPage = () => {
|
||||
const [message, setMessage] = useState(null);
|
||||
|
||||
const callback = async (formData) => {
|
||||
await contactForm(formData);
|
||||
setMessage("Our intrepid team of code monkeys will be looking at this as soon as possible!");
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<header className="bg-white shadow">
|
||||
@ -30,29 +25,8 @@ const ContactPage = () => {
|
||||
|
||||
<div className="pb-4">
|
||||
<h2 className="text-xl font-semibold mb-4">Contact Form</h2>
|
||||
<form className="space-y-4" action={callback}>
|
||||
<div>
|
||||
<label htmlFor="name" className="block mb-1">Name</label>
|
||||
<input type="text" id="name" name="name" className="w-full px-3 py-2 border rounded" required />
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="email" className="block mb-1">Email</label>
|
||||
<input type="email" id="email" name="email" className="w-full px-3 py-2 border rounded" required />
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="message" className="block mb-1">Message</label>
|
||||
<textarea id="message" name="message" rows="4" className="w-full px-3 py-2 border rounded" required></textarea>
|
||||
</div>
|
||||
<button type="submit" className="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600">Send Message</button>
|
||||
{message !== null && (
|
||||
<>
|
||||
<div className="p-4 bg-gray-200">
|
||||
<p className="text-xl">Thanks!</p>
|
||||
<p className="p-4">{message}</p>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</form>
|
||||
<noscript className="my-2">Enable JavaScript to use the contact form. It's 2024. Give up.</noscript>
|
||||
<ContactForm />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -6,7 +6,12 @@ html {
|
||||
font-family: var(--font-inter);
|
||||
}
|
||||
|
||||
h1 {
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: var(--font-podkova);
|
||||
}
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@ import "./globals.css";
|
||||
import React from "react";
|
||||
import Link from "next/link";
|
||||
import { Button } from "@/components/ui/Button";
|
||||
import Head from "next/head";
|
||||
|
||||
const inter = Inter({
|
||||
subsets: ["latin"],
|
||||
@ -18,8 +19,19 @@ const podkova = Podkova({
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Techaro Computing Canada",
|
||||
title: {
|
||||
default: "Techaro Computing Canada",
|
||||
template: "%s | Techaro",
|
||||
},
|
||||
openGraph: {
|
||||
locale: "en-US",
|
||||
},
|
||||
description: "Your one-stop shop for all your computing needs.",
|
||||
alternates: {
|
||||
types: {
|
||||
"application/rss+xml": "/blog.rss",
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
@ -29,6 +41,14 @@ export default function RootLayout({
|
||||
}>) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<Head>
|
||||
<link
|
||||
rel="alternate"
|
||||
type="application/rss+xml"
|
||||
title="RSS"
|
||||
href="/blog.rss"
|
||||
/>
|
||||
</Head>
|
||||
<body
|
||||
className={`${inter.variable} ${podkova.variable} ${inter.className}`}
|
||||
>
|
||||
|
||||
@ -3,6 +3,11 @@ import Link from 'next/link';
|
||||
import { Cpu, Database, Cloud, Shield, Users, TrendingUp } from 'lucide-react';
|
||||
import { Button } from '@/components/ui/Button';
|
||||
|
||||
export const metadata = {
|
||||
title: "Services",
|
||||
description: "Sample everything that Techaro has to offer"
|
||||
};
|
||||
|
||||
const ServiceCard = ({ icon: Icon, title, description }) => (
|
||||
<div className="bg-white overflow-hidden shadow rounded-lg">
|
||||
<div className="px-4 py-5 sm:p-6">
|
||||
|
||||
72
components/contact-form.tsx
Normal file
72
components/contact-form.tsx
Normal file
@ -0,0 +1,72 @@
|
||||
"use client";
|
||||
|
||||
import React, { useState } from "react";
|
||||
import contactForm from "@/actions/contact";
|
||||
|
||||
export default function ContactForm() {
|
||||
const [message, setMessage] = useState<string | null>(null);
|
||||
|
||||
const callback = async (formData: FormData) => {
|
||||
await contactForm(formData);
|
||||
setMessage(
|
||||
"Our intrepid team of code monkeys will be looking at this as soon as possible!"
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<form className="space-y-4" action={callback}>
|
||||
<div>
|
||||
<label htmlFor="name" className="block mb-1">
|
||||
Name
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="name"
|
||||
name="name"
|
||||
className="w-full px-3 py-2 border rounded"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="email" className="block mb-1">
|
||||
Email
|
||||
</label>
|
||||
<input
|
||||
type="email"
|
||||
id="email"
|
||||
name="email"
|
||||
className="w-full px-3 py-2 border rounded"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<label htmlFor="message" className="block mb-1">
|
||||
Message
|
||||
</label>
|
||||
<textarea
|
||||
id="message"
|
||||
name="message"
|
||||
rows={4}
|
||||
className="w-full px-3 py-2 border rounded"
|
||||
required
|
||||
></textarea>
|
||||
</div>
|
||||
<button
|
||||
type="submit"
|
||||
className="bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600"
|
||||
>
|
||||
Send Message
|
||||
</button>
|
||||
{message !== null && (
|
||||
<>
|
||||
<div className="p-4 bg-gray-200">
|
||||
<p className="text-xl">Thanks!</p>
|
||||
<p className="p-4">{message}</p>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</form>
|
||||
</>
|
||||
);
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user