mirror of
https://github.com/jetkvm/website.git
synced 2025-09-16 08:38:16 +00:00
51 lines
1.5 KiB
TypeScript
51 lines
1.5 KiB
TypeScript
import React from "react";
|
|
import clsx from "clsx";
|
|
|
|
type ProseProps = {
|
|
className?: string;
|
|
children: React.ReactNode;
|
|
textSize?: "sm" | "base" | "lg" | "xl" | "2xl" | "3xl" | "4xl";
|
|
};
|
|
|
|
export function Prose({ className, textSize = "base", children, ...props }: ProseProps) {
|
|
return (
|
|
<div
|
|
className={clsx(
|
|
className,
|
|
{
|
|
"prose-sm": textSize === "sm",
|
|
"prose-base": textSize === "base",
|
|
"prose-lg": textSize === "lg",
|
|
"prose-xl": textSize === "xl",
|
|
"prose-2xl": textSize === "2xl",
|
|
"prose-3xl": textSize === "3xl",
|
|
},
|
|
"prose prose-slate max-w-3xl",
|
|
|
|
// headings
|
|
"prose-headings:scroll-mt-28 prose-headings:font-display prose-headings:font-semibold lg:prose-headings:scroll-mt-[8.5rem]",
|
|
|
|
"prose-h1:fond-bold prose-h2:font-bold",
|
|
|
|
// lead
|
|
"prose-p:text-black/95",
|
|
|
|
//table
|
|
"prose-table:my-0 prose-table:max-w-3xl prose-table:text-[15px] prose-table:text-slate-800 prose-thead:border-slate-800/10 prose-tr:border-slate-800/10 prose-td:py-3",
|
|
|
|
// links
|
|
"prose-a:font-medium prose-a:text-blue-700",
|
|
|
|
// link underline
|
|
"prose-a:no-underline",
|
|
|
|
// pre don't do any changes
|
|
// "prose-pre:rounded-xl prose-pre:bg-slate-100 prose-pre:shadow-none dark:prose-pre:bg-slate-800/60 dark:prose-pre:shadow-none dark:prose-pre:ring-1 dark:prose-pre:ring-slate-300/10",
|
|
)}
|
|
{...props}
|
|
>
|
|
{children}
|
|
</div>
|
|
);
|
|
}
|