75 lines
1.5 KiB
TypeScript
75 lines
1.5 KiB
TypeScript
export const OG_SIZE = { width: 1200, height: 630 } as const;
|
|
export const OG_CONTENT_TYPE = "image/png";
|
|
|
|
export function OgCard({
|
|
eyebrow,
|
|
title,
|
|
description,
|
|
}: {
|
|
eyebrow: string;
|
|
title: string;
|
|
description: string;
|
|
}) {
|
|
return (
|
|
<div
|
|
style={{
|
|
width: "100%",
|
|
height: "100%",
|
|
display: "flex",
|
|
flexDirection: "column",
|
|
justifyContent: "space-between",
|
|
background: "#050505",
|
|
color: "#f4f1e8",
|
|
padding: 72,
|
|
fontFamily: "Arial, sans-serif",
|
|
}}
|
|
>
|
|
<div
|
|
style={{
|
|
display: "flex",
|
|
color: "#ccff00",
|
|
fontSize: 24,
|
|
letterSpacing: "0.16em",
|
|
textTransform: "uppercase",
|
|
}}
|
|
>
|
|
{eyebrow}
|
|
</div>
|
|
<div style={{ display: "flex", flexDirection: "column", gap: 28 }}>
|
|
<div
|
|
style={{
|
|
display: "flex",
|
|
fontSize: 64,
|
|
fontWeight: 700,
|
|
lineHeight: 1.08,
|
|
}}
|
|
>
|
|
{title}
|
|
</div>
|
|
<div
|
|
style={{
|
|
display: "flex",
|
|
maxWidth: 980,
|
|
color: "#c7c3ba",
|
|
fontSize: 28,
|
|
lineHeight: 1.35,
|
|
}}
|
|
>
|
|
{description}
|
|
</div>
|
|
</div>
|
|
<div
|
|
style={{
|
|
display: "flex",
|
|
borderTop: "1px solid #343434",
|
|
paddingTop: 24,
|
|
fontSize: 20,
|
|
letterSpacing: "0.12em",
|
|
}}
|
|
>
|
|
EVANDRO.DEV.BR / ENGENHARIA DE SOFTWARE
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|