chore: updated styles

This commit is contained in:
Raj 2024-03-13 10:18:21 +05:30
parent 1d991873ce
commit 0eb65c4f82
2 changed files with 45 additions and 13 deletions

View File

@ -16,7 +16,6 @@ import Link from "next/link";
import { NRenderer } from "@/components/notion/renderer";
import { Metadata, ResolvingMetadata } from "next";
import Comments, { Reactions } from "@/components/comments";
import { Stats } from "./stats";
export const revalidate = 100;
@ -26,7 +25,7 @@ type Props = {
export async function generateMetadata(
{ searchParams }: Props,
parent: ResolvingMetadata,
// parent: ResolvingMetadata,
): Promise<Metadata> {
const notion = new NotionAPI();
@ -60,10 +59,36 @@ export async function generateMetadata(
title: title,
description: description.toString() || "Written by raj",
openGraph: {
images: [og_image_url.toString()],
images: [
{
url: og_image_url.toString(),
type: "image/jpeg",
height: 630,
width: 1200,
},
],
authors: [author.toString()],
},
authors: [
{
name: author.toString(),
},
],
twitter: {
images: [og_image_url.toString()],
images: [
{
url: og_image_url.toString(),
type: "image/jpeg",
height: 630,
width: 1200,
},
],
creator: author.toString(),
card: "summary_large_image",
title: title,
description: description.toString() || "Written by raj",
site: "raj.how",
},
};
}
@ -88,8 +113,6 @@ export default async function Story({
const category = process.env.COMMENTS_CATEGORY;
const categoryId = process.env.COMMENTS_CATEGORY_ID;
console.log(repo, repoId, category, categoryId);
return (
<article suppressHydrationWarning className="relative">
<GrainProvider

View File

@ -3,6 +3,11 @@ import { NextRequest } from "next/server";
export const runtime = "edge";
export const contentType = "image/jpeg";
const width = 1200 / 2;
const height = 630 / 2;
export async function GET(props: NextRequest) {
const url = new URL(props.url);
@ -21,13 +26,13 @@ export async function GET(props: NextRequest) {
(
<div tw="flex flex-col font-sans border-red-400 m-0 w-full h-full bg-black text-white">
<img
width={1200 / 2}
height={630 / 2}
width={width}
height={height}
tw="absolute top-0 left-0"
src={`${image_origin_url}/background-gradient.png`}
alt="og"
/>
<div tw="p-3 px-4 bg-white/20 flex flex-col">
<div tw="p-3 px-6 bg-white/20 flex flex-1 justify-center flex-col">
<span tw="text-black text-3xl font-bold font-sans">
{title?.toString()}
</span>
@ -45,9 +50,9 @@ export async function GET(props: NextRequest) {
</span>
</div>
</div>
{images ? (
{images && images?.split(",")[0].trim() ? (
<img
width={1200 / 2}
width={width}
tw="flex-1"
style={{
objectFit: "cover",
@ -60,8 +65,12 @@ export async function GET(props: NextRequest) {
</div>
),
{
width: 1200 / 2,
height: 630 / 2,
width,
height,
headers: {
"Content-Type": "image/jpeg",
"content-type": "image/jpeg",
},
},
);
}