diff --git a/Makefile b/Makefile new file mode 100644 index 00000000..3fb7dadd --- /dev/null +++ b/Makefile @@ -0,0 +1,8 @@ +build: + @yarn build +dev: + @yarn dev +format: + @yarn format +lint: + @yarn lint \ No newline at end of file diff --git a/src/lib/images/pl-logo-white-svg.ts b/src/lib/images/pl-logo-white-svg.ts new file mode 100644 index 00000000..60a4bdb8 --- /dev/null +++ b/src/lib/images/pl-logo-white-svg.ts @@ -0,0 +1,3 @@ +// Exported as a string for use in the OG image edge endpoint, which can't +// use fs or standard Next.js image imports. +export const plLogoWhiteSvg = ``; diff --git a/src/pages/_document.tsx b/src/pages/_document.tsx index 4548905b..0b8294e2 100644 --- a/src/pages/_document.tsx +++ b/src/pages/_document.tsx @@ -23,6 +23,18 @@ class MyDocument extends Document { integrity="sha384-AfEj0r4/OFrOo5t7NnNe46zW/tFgW6x/bCJG8FqQCEo3+Aro6EYUG4+cU+KJWu/X" crossOrigin="anonymous" /> + + + + + +
diff --git a/src/pages/api/og.tsx b/src/pages/api/og.tsx new file mode 100644 index 00000000..0b9b4005 --- /dev/null +++ b/src/pages/api/og.tsx @@ -0,0 +1,51 @@ +import { ImageResponse } from "next/og"; +import type { NextRequest } from "next/server"; +import { plLogoWhiteSvg } from "../../lib/images/pl-logo-white-svg"; + +export const config = { + runtime: "edge", +}; + +export default function handler(req: NextRequest) { + const { searchParams } = new URL(req.url); + const title = searchParams.get("title"); + + return new ImageResponse( +
+ {/* eslint-disable-next-line @next/next/no-img-element, jsx-a11y/alt-text */} + +
+ {title || "The most comprehensive\nassessment platform"} +
+
, + { + width: 1200, + height: 630, + }, + ); +} diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 723cbc3a..f3aaa45d 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -89,6 +89,11 @@ const Home: React.FC = ({ seed }) => { PrairieLearn + +
@@ -101,7 +106,7 @@ const Home: React.FC = ({ seed }) => { styles["text-wrap-balance"], )} > - Empowering learners with equitable and authentic assessments + The most comprehensive assessment platform