import { ImageResponse } from "next/og";

export const size = { width: 32, height: 32 };
export const contentType = "image/png";

export default function Icon() {
  return new ImageResponse(
    (
      <div
        style={{
          width: "100%",
          height: "100%",
          display: "flex",
          flexDirection: "column",
          alignItems: "center",
          justifyContent: "center",
          background: "#0f0404",
          borderRadius: 6,
          gap: 2,
        }}
      >
        <div
          style={{
            width: 20,
            height: 20,
            border: "2px solid #3d8b5f",
            borderRadius: 4,
            display: "flex",
            alignItems: "center",
            justifyContent: "center",
            fontSize: 7,
            fontWeight: 800,
            color: "#3d8b5f",
          }}
        >
          GRV
        </div>
        <div
          style={{
            fontSize: 5,
            fontWeight: 700,
            color: "#1a5c38",
            letterSpacing: 0.5,
            textAlign: "center",
            lineHeight: 1.1,
          }}
        >
          GREAT RIFT
        </div>
      </div>
    ),
    { ...size }
  );
}
