Rainnny/RESTfulMC
1
0
Fork 0
Code Issues 1 Pull Requests 10 Actions Wiki Activity

Space out markdown headings more
All checks were successful
Deploy Frontend / docker (17, 3.8.5) (push) Successful in 1m2s
Details

Browse Source
This commit is contained in:
Braydon 2024-04-21 13:41:22 -04:00
parent e1e02ae0f4
commit 3ea7e8c70e
1 changed files with 26 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
Frontend/src/app/components/mdx.tsx
View File

@ -16,22 +16,34 @@ import {
*/ */
const components: any = { const components: any = {
h1: ({ children }: { children: ReactNode }): ReactElement => ( h1: ({ children }: { children: ReactNode }): ReactElement => (
<Heading size="text-4xl">{children}</Heading> <Heading size={1} className="text-4xl">
{children}
</Heading>
), ),
h2: ({ children }: { children: ReactNode }): ReactElement => ( h2: ({ children }: { children: ReactNode }): ReactElement => (
<Heading size="text-3xl">{children}</Heading> <Heading size={2} className="text-3xl">
{children}
</Heading>
), ),
h3: ({ children }: { children: ReactNode }): ReactElement => ( h3: ({ children }: { children: ReactNode }): ReactElement => (
<Heading size="text-2xl">{children}</Heading> <Heading size={3} className="text-2xl">
{children}
</Heading>
), ),
h4: ({ children }: { children: ReactNode }): ReactElement => ( h4: ({ children }: { children: ReactNode }): ReactElement => (
<Heading size="text-xl">{children}</Heading> <Heading size={4} className="text-xl">
{children}
</Heading>
), ),
h5: ({ children }: { children: ReactNode }): ReactElement => ( h5: ({ children }: { children: ReactNode }): ReactElement => (
<Heading size="text-lg">{children}</Heading> <Heading size={5} className="text-lg">
{children}
</Heading>
), ),
h6: ({ children }: { children: ReactNode }): ReactElement => ( h6: ({ children }: { children: ReactNode }): ReactElement => (
<Heading size="text-md">{children}</Heading> <Heading size={5} className="text-md">
{children}
</Heading>
), ),
a: ({ a: ({
href, href,
@ -97,16 +109,21 @@ export const CustomMDX = (props: any): ReactElement => (
/** /**
* A heading component. * A heading component.
* *
* @param size the size of the heading. * @param className the class name of the heading
* @param size the size of the heading
* @param children the children within the heading * @param children the children within the heading
* @return the heading jsx * @return the heading jsx
*/ */
const Heading = ({ const Heading = ({
className,
size, size,
children, children,
}: { }: {
size: string; className: string;
size: number;
children: ReactNode; children: ReactNode;
}): ReactElement => ( }): ReactElement => (
<h1 className={cn("pt-2.5 font-bold", size)}>{children}</h1> <h1 className={cn("pt-2.5 font-bold", size >= 2 && "pt-7", className)}>
{children}
</h1>
); );