Skip to content

Commit 09d745a

Browse files
scottrippeyscottrippey
authored
Chore: improved metadata across docs (#389)
2 parents 1008850 + e873232 commit 09d745a

5 files changed

Lines changed: 87 additions & 71 deletions

File tree

‎website/docusaurus.config.ts‎

Lines changed: 12 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,13 @@
1-
import { themes as prismThemes } from "prism-react-renderer";
2-
import type { Config } from "@docusaurus/types";
31
import type * as Preset from "@docusaurus/preset-classic";
2+
import type { Config } from "@docusaurus/types";
43
import MonacoEditorWebpackPlugin from "monaco-editor-webpack-plugin";
5-
6-
const title = "GROQD";
7-
const tagline = "Typesafe GROQ Query Builder";
4+
import { themes as prismThemes } from "prism-react-renderer";
5+
import { metadata } from "./src/metadata";
86

97
const config: Config = {
10-
title,
11-
tagline,
12-
url: "https://commerce.nearform.com/",
8+
title: metadata.longTitle,
9+
tagline: metadata.description,
10+
url: "https://nearform.com/",
1311
favicon: "img/nearform-icon.svg",
1412
baseUrl: process.env.VERCEL_ENV === "preview" ? "/" : "/open-source/groqd",
1513
onBrokenLinks: "throw",
@@ -83,11 +81,11 @@ const config: Config = {
8381
metadata: [
8482
{
8583
name: "title",
86-
content: title,
84+
content: metadata.longTitle,
8785
},
8886
{
8987
name: "description",
90-
content: tagline,
88+
content: metadata.description,
9189
},
9290
{
9391
name: "viewport",
@@ -103,11 +101,11 @@ const config: Config = {
103101
},
104102
{
105103
property: "og:title",
106-
content: title,
104+
content: metadata.longTitle,
107105
},
108106
{
109107
property: "og:description",
110-
content: tagline,
108+
content: metadata.description,
111109
},
112110
{
113111
property: "og:image",
@@ -120,11 +118,11 @@ const config: Config = {
120118
},
121119
{
122120
property: "twitter:title",
123-
content: title,
121+
content: metadata.longTitle,
124122
},
125123
{
126124
property: "twitter:description",
127-
content: tagline,
125+
content: metadata.description,
128126
},
129127
{
130128
property: "twitter:image",

‎website/src/components/landing/landing-features.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,13 +26,13 @@ export const LandingFeatures = ({
2626
className="col-span-3 md:col-span-1 flex flex-col items-center text-center"
2727
>
2828
<img src={imgSrc} alt={alt} className="max-h-72" />
29-
<span className="mt-8 text-2xl font-semibold">{title}</span>
30-
<span
29+
<div className="mt-8 text-2xl font-semibold">{title}</div>
30+
<div
3131
dangerouslySetInnerHTML={html}
3232
className="mt-2 text-lg leading-8 mx-3"
3333
>
3434
{body}
35-
</span>
35+
</div>
3636
</li>
3737
))}
3838
</ul>

‎website/src/components/landing/landing-hero.tsx‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,11 +5,13 @@ export const LandingHero = ({
55
body,
66
copyText,
77
heading,
8+
subheading,
89
navItems,
910
}: {
1011
body: string;
1112
copyText: string;
1213
heading: string;
14+
subheading: string;
1315
navItems: { link: string; title: string }[];
1416
}) => {
1517
const [buttonText, setButtonText] = useState("Copy");
@@ -29,6 +31,9 @@ export const LandingHero = ({
2931
<h1 className="text-4xl font-bold tracking-tight sm:text-6xl">
3032
{heading}
3133
</h1>
34+
<p className="text-2xl font-bold tracking-tight sm:text-3xl">
35+
{subheading}
36+
</p>
3237
<p className="mt-6 text-lg leading-8">{body}</p>
3338
<div className="mt-10 flex flex-wrap flex-col xl:flex-row xl:items-center justify-start gap-6">
3439
<button

‎website/src/metadata.ts‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
export const metadata = {
2+
title: "GROQD",
3+
tagline: "A type-safe query builder for GROQ",
4+
longTitle: "GROQD: a type-safe query builder for GROQ",
5+
description:
6+
"Designed to give the best GROQ developer experience possible, " +
7+
"with the flexibility of GROQ, " +
8+
"schema-aware auto-completion, " +
9+
"strong type-checking, " +
10+
"and the runtime safety of Zod.",
11+
};

‎website/src/pages/index.tsx‎

Lines changed: 56 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
11
import React from "react";
2-
import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
32
import Layout from "@theme/Layout";
43

54
import { LandingHero } from "../components/landing/landing-hero";
@@ -12,67 +11,70 @@ import {
1211
feature3,
1312
} from "../components/landing/landing-images";
1413
import { Divider } from "../components/landing/divider";
14+
import { metadata } from "../metadata";
1515

1616
export default function Home(): JSX.Element {
17-
const { siteConfig } = useDocusaurusContext();
1817
return (
19-
<Layout title={siteConfig.title} description={siteConfig.tagline}>
20-
<div className="dark:bg-gray-500 bg-gray-200 dark:text-white text-theme-2">
21-
<LandingHero
22-
heading={siteConfig.title}
23-
body={siteConfig.tagline}
24-
copyText="npm install groqd"
25-
navItems={[
26-
{ link: "/open-source/groqd/docs", title: "Documentation" },
27-
{ link: "/open-source/groqd/arcade", title: "Demo" },
18+
<Layout>
19+
<main>
20+
<div className="dark:bg-gray-500 bg-gray-200 dark:text-white text-theme-2">
21+
<LandingHero
22+
heading={metadata.title}
23+
subheading={metadata.tagline}
24+
body={metadata.description}
25+
copyText="npm install groqd"
26+
navItems={[
27+
{ link: "/open-source/groqd/docs", title: "Documentation" },
28+
{ link: "/open-source/groqd/arcade", title: "Demo" },
29+
{
30+
link: "https://github.com/FormidableLabs/groqd",
31+
title: "Github",
32+
},
33+
]}
34+
></LandingHero>
35+
</div>
36+
<LandingFeatures
37+
heading="Features"
38+
list={[
2839
{
29-
link: "https://github.com/FormidableLabs/groqd",
30-
title: "Github",
40+
imgSrc: feature1,
41+
alt: "Flexible",
42+
title: "Flexible",
43+
html: {
44+
__html: "GROQD maintains the flexibility of GROQ.",
45+
},
3146
},
32-
]}
33-
></LandingHero>
34-
</div>
35-
<LandingFeatures
36-
heading="Features"
37-
list={[
38-
{
39-
imgSrc: feature1,
40-
alt: "Flexible",
41-
title: "Flexible",
42-
html: {
43-
__html: "GROQD maintains the flexibility of GROQ.",
47+
{
48+
imgSrc: feature3,
49+
alt: "Type Safe",
50+
title: "Type Safe",
51+
body: "Leverages the type safety of TypeScript.",
4452
},
45-
},
46-
{
47-
imgSrc: feature2,
48-
alt: "Runtime Safe",
49-
title: "Runtime Safe",
50-
html: {
51-
__html:
52-
"Automatically layers in the runtime safety of <a href='https://github.com/colinhacks/zod' target='_blank'>Zod</a>.",
53+
{
54+
imgSrc: feature2,
55+
alt: "Runtime Safe",
56+
title: "Runtime Safe",
57+
html: {
58+
__html:
59+
"Automatically layers in the runtime safety of <a href='https://github.com/colinhacks/zod' target='_blank'>Zod</a>.",
60+
},
5361
},
54-
},
55-
{
56-
imgSrc: feature3,
57-
alt: "Type Safe",
58-
title: "Type Safe",
59-
body: "Leverages the type safety of TypeScript.",
60-
},
61-
]}
62-
/>
63-
<Divider />
64-
<div className="flex gap-20 flex-col md:flex-row mx-16 lg:mx-32 xl:mx-64">
65-
<LandingBanner
66-
heading="Get Started"
67-
body="Get the flexibility of GROQ with the runtime/type safety of Zod and TypeScript today!"
68-
cta={{ link: "/open-source/groqd/docs", text: "Documentation" }}
69-
/>
70-
<LandingBanner
71-
heading="GROQD Arcade"
72-
body="View sample queries, and play with live examples in the GROQD Arcade."
73-
cta={{ link: "/open-source/groqd/arcade", text: "Arcade" }}
62+
]}
7463
/>
75-
</div>
64+
<Divider />
65+
<div className="flex gap-20 flex-col md:flex-row mx-16 lg:mx-32 xl:mx-64">
66+
<LandingBanner
67+
heading="Get Started"
68+
body="Get the flexibility of GROQ with the runtime/type safety of Zod and TypeScript today!"
69+
cta={{ link: "/open-source/groqd/docs", text: "Documentation" }}
70+
/>
71+
<LandingBanner
72+
heading="GROQD Arcade"
73+
body="View sample queries, and play with live examples in the GROQD Arcade."
74+
cta={{ link: "/open-source/groqd/arcade", text: "Arcade" }}
75+
/>
76+
</div>
77+
</main>
7678
<Divider />
7779
<LandingFeaturedProjects
7880
heading="Other Open Source"

0 commit comments

Comments
 (0)