many many things

2024-12-22 14:44:21 +00:00 · 2022-06-04 05:13:19 +02:00 · 2022-06-04 05:13:19 +02:00 · b26da3f911
commit b26da3f911
parent 08636d4419
45 changed files with 1122 additions and 293 deletions
--- a/components/ActionEventList.tsx
+++ b/components/ActionEventList.tsx
@ -3,7 +3,7 @@ import { useTranslation } from "next-i18next";
 import { HTMLProps } from "react";
 import { useMyEventsSWR } from "../hooks/swr/useMyEventsSWR";
 import { Loading } from "./Loading";
-import { EventList } from "./EventList";
+import { ListEvents } from "./ListEvents";
 import { EventCreate } from "./EventCreate";


@ -44,7 +44,7 @@ export function ActionEventList(props: HTMLProps<HTMLFormElement>) {
                <p>
                    {t("eventListDescription")}
                </p>
-                <EventList data={data} />
+                <ListEvents data={data} />
                <p>
                    {t("eventListCreateAnother")}
                </p>
--- a/components/EventCreate.tsx
+++ b/components/EventCreate.tsx
@ -5,7 +5,7 @@ import { useState } from "react"
 import { useAxiosRequest } from "../hooks/useAxiosRequest"
 import { Loading } from "./Loading"
 import { useEffect } from "react"
-import { ErrorBlock } from "./ErrorBlock"
+import { ErrorBlock } from "./errors/ErrorBlock"

 export function EventCreate() {
    const { t } = useTranslation()
--- a/components/ListEvents.tsx
+++ b/components/ListEvents.tsx
@ -1,11 +1,11 @@
 import { Event } from "@prisma/client"
 import { default as Link } from "next/link"

-type EventListProps = {
+type ListEventsProps = {
    data: Event[]
 }

-export function EventList(props: EventListProps) {
+export function ListEvents(props: ListEventsProps) {
    const contents = props.data.map(e => (
        <li key={e.slug}>
            <Link href={`/events/${e.slug}`}>
--- a/components/Loading.tsx
+++ b/components/Loading.tsx
@ -1,5 +1,5 @@
 import { faAsterisk } from "@fortawesome/free-solid-svg-icons";
-import { FestaIcon } from "./FestaIcon";
+import { FestaIcon } from "./extensions/FestaIcon";

 type LoadingProps = {
    text: string
--- a/components/Postcard.tsx
+++ b/components/Postcard.tsx
@ -1,16 +0,0 @@
-import { PostcardContext } from "../contexts/postcard";
-import { useDefinedContext } from "../utils/definedContext";
-
-export function Postcard() {
-    const [postcard, _] = useDefinedContext(PostcardContext)
-
-    const postcardUrl = typeof postcard === "string" ? postcard : postcard.src
-
-    /* eslint-disable @next/next/no-img-element */
-    return <>
-        <div
-            className="postcard"
-            style={{backgroundImage: `url(${postcardUrl})`}}
-        />
-    </>
-}
--- a/components/editable/EditableMarkdown.tsx
+++ b/components/editable/EditableMarkdown.tsx
@ -0,0 +1,15 @@
+import { HTMLProps } from "react";
+import { EditingContext } from "../../contexts/editing";
+import { useDefinedContext } from "../../utils/definedContext";
+import { FestaMarkdown } from "../extensions/FestaMarkdown";
+
+
+export function EditableMarkdown({value, ...props}: HTMLProps<HTMLTextAreaElement>) {
+    const [editing,] = useDefinedContext(EditingContext)
+
+    return editing ? (
+        <textarea value={value} {...props}/>
+    ) : (
+        <FestaMarkdown markdown={value as string}/>
+    )
+}
--- a/components/editable/EditableText.tsx
+++ b/components/editable/EditableText.tsx
@ -0,0 +1,14 @@
+import { HTMLProps } from "react";
+import { EditingContext } from "../../contexts/editing";
+import { useDefinedContext } from "../../utils/definedContext";
+
+
+export function EditableText({value, ...props}: HTMLProps<HTMLInputElement>) {
+    const [editing,] = useDefinedContext(EditingContext)
+
+    return editing ? (
+        <input type="text" value={value} {...props}/>
+    ) : (
+        <span>{value}</span>
+    )
+}
--- a/components/errors/ErrorBlock.tsx
+++ b/components/errors/ErrorBlock.tsx
@ -1,13 +1,12 @@
 import { faCircleExclamation } from "@fortawesome/free-solid-svg-icons";
-import { FestaIcon } from "./FestaIcon";
+import { FestaIcon } from "../extensions/FestaIcon";

 type ErrorBlockProps = {
-    error: JSON,
+    error: Error,
    text: string
 }

 export function ErrorBlock(props: ErrorBlockProps) {
-
    return (
        <div className="error error-block negative">
            <p>
@ -18,8 +17,10 @@ export function ErrorBlock(props: ErrorBlockProps) {
                </span>
            </p>
            <pre>
-                <code lang="json">
-                    {JSON.stringify(props.error, undefined, 4)}
+                <code>
+                    <b>{props.error.name}</b> 
+                    :&nbsp;
+                    {props.error.message}
                </code>
            </pre>
        </div>
--- a/components/errors/ErrorBoundary.tsx
+++ b/components/errors/ErrorBoundary.tsx
@ -0,0 +1,40 @@
+import { Component, ErrorInfo, ReactNode } from "react";
+import { ErrorBlock } from "./ErrorBlock";
+
+type ErrorBoundaryProps = {
+    text: string,
+    children: ReactNode,
+}
+
+type ErrorBoundaryState = {
+    error?: Error,
+    errorInfo?: ErrorInfo,
+}
+
+
+export class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
+    constructor(props: ErrorBoundaryProps) {
+        super(props)
+        this.state = {error: undefined, errorInfo: undefined}
+    }
+
+    componentDidCatch(error: Error, errorInfo: ErrorInfo) {
+        this.setState(state => {
+            return {...state, error, errorInfo}
+        })
+    }
+
+    render() {
+        if(this.state.error) {
+            return (
+                <ViewNotice
+                <main id="page-error-fatal" className="page">
+                    <ErrorBlock text={this.props.text} error={this.state.error}/>
+                </main>
+            )
+        }
+        else {
+            return this.props.children
+        }
+    }
+}
--- a/components/errors/ErrorInline.tsx
+++ b/components/errors/ErrorInline.tsx
@ -1,8 +1,8 @@
 import { faCircleExclamation } from "@fortawesome/free-solid-svg-icons";
-import { FestaIcon } from "./FestaIcon";
+import { FestaIcon } from "../extensions/FestaIcon";

 type ErrorInlineProps = {
-    error: JSON,
+    error: Error,
    text?: string
 }

@ -11,10 +11,14 @@ export function ErrorInline(props: ErrorInlineProps) {
        <span className="error error-inline negative">
            <FestaIcon icon={faCircleExclamation} />
            &nbsp;
+            {props.text ?
+                <>
                    <span>
                        {props.text}
                    </span>
                    &nbsp;
+                </>
+            : null}
            <code lang="json">
                {JSON.stringify(props.error)}
            </code>
--- a/components/extensions/FestaIcon.tsx
+++ b/components/extensions/FestaIcon.tsx
--- a/components/extensions/FestaMarkdown.tsx
+++ b/components/extensions/FestaMarkdown.tsx
@ -0,0 +1,19 @@
+import { ReactNode } from "react"
+import ReactMarkdown from "react-markdown"
+
+type FestaMarkdownProps = {
+    markdown: string,
+}
+
+export function FestaMarkdown({markdown}: FestaMarkdownProps) {
+    return (
+        <ReactMarkdown
+            components={{
+                h1: "h3",
+                h2: "h3",
+            }}
+        >
+            {markdown}
+        </ReactMarkdown>
+    )
+}
--- a/components/postcard/Postcard.tsx
+++ b/components/postcard/Postcard.tsx
@ -0,0 +1,28 @@
+import { useEffect } from "react"
+import { PostcardContext } from "./PostcardContext"
+import { useDefinedContext } from "../../utils/definedContext"
+import { StaticImageData } from "next/image"
+
+type PostcardProps = {
+    src?: string | StaticImageData
+}
+
+export function Postcard({src}: PostcardProps) {
+    const [, setPostcard] = useDefinedContext(PostcardContext)
+
+    useEffect(
+        () => {
+            if(src) {
+                if(typeof src === "object") {
+                    setPostcard(src.src)
+                }
+                else {
+                    setPostcard(src)
+                }
+            }
+        },
+        [src]
+    )
+
+    return null
+}
--- a/components/postcard/PostcardContext.tsx
+++ b/components/postcard/PostcardContext.tsx
@ -0,0 +1,7 @@
+import { createStateContext } from "../../utils/stateContext";
+
+
+/**
+ * Context containing data about the website's current postcard, the blurred background image.
+ */
+export const PostcardContext = createStateContext<string>()
--- a/components/postcard/PostcardRenderer.tsx
+++ b/components/postcard/PostcardRenderer.tsx
@ -0,0 +1,14 @@
+import { PostcardContext } from "./PostcardContext"
+import { useDefinedContext } from "../../utils/definedContext";
+
+
+export function PostcardRenderer() {
+    const [postcard,] = useDefinedContext(PostcardContext)
+
+    return <>
+        <div
+            className="postcard"
+            style={{backgroundImage: `url(${postcard})`}}
+        />
+    </>
+}
--- a/components/tools/ToolBar.tsx
+++ b/components/tools/ToolBar.tsx
@ -0,0 +1,16 @@
+import {default as classNames} from "classnames"
+import { ReactNode } from "react"
+
+type ToolBarProps = {
+    vertical: "top" | "bottom",
+    horizontal: "left" | "right",
+    children: ReactNode,
+}
+
+export function ToolBar({vertical, horizontal, children}: ToolBarProps) {
+    return (
+        <div className={classNames("toolbar", `toolbar-${vertical}`, `toolbar-${horizontal}`)} aria-role="toolbar">
+            {children}
+        </div>
+    )
+}
--- a/components/tools/ToolToggleEditing.tsx
+++ b/components/tools/ToolToggleEditing.tsx
@ -0,0 +1,19 @@
+import { faBinoculars, faPencil } from "@fortawesome/free-solid-svg-icons"
+import { useTranslation } from "next-i18next"
+import { EditingContext } from "../../contexts/editing"
+import { useDefinedContext } from "../../utils/definedContext"
+import { FestaIcon } from "../extensions/FestaIcon"
+
+export function ToolToggleEditing() {
+    const {t} = useTranslation()
+    const [editing, setEditing] = useDefinedContext(EditingContext)
+
+    return (
+        <button 
+            aria-label={editing ? t("toggleEditingView") : t("toggleEditingEdit")}
+            onClick={() => setEditing(!editing)}
+        >
+            <FestaIcon icon={editing ? faBinoculars : faPencil}/>
+        </button>
+    )
+}
--- a/components/view/ViewContent.tsx
+++ b/components/view/ViewContent.tsx
@ -0,0 +1,20 @@
+import { ReactNode } from "react"
+
+type ViewContentProps = {
+    title: ReactNode
+    content: ReactNode
+}
+
+
+export function ViewContent(props: ViewContentProps) {
+    return (
+        <main className="view-content">
+            <h1 className="view-content-title">
+                {props.title}
+            </h1>
+            <div className="view-content-content">
+                {props.content}
+            </div>
+        </main>
+    )
+}
--- a/components/view/ViewLanding.tsx
+++ b/components/view/ViewLanding.tsx
@ -0,0 +1,26 @@
+import { ReactNode } from "react"
+
+type ViewLandingProps = {
+    title: ReactNode
+    subtitle: ReactNode
+    actions: ReactNode
+}
+
+
+export function ViewLanding(props: ViewLandingProps) {
+    return (
+        <main className="view-landing">
+            <hgroup className="view-landing-titles">
+                <h1 className="view-landing-titles-title">
+                    {props.title}
+                </h1>
+                <h2 className="view-landing-titles-subtitle">
+                    {props.subtitle}
+                </h2>
+            </hgroup>
+            <div className="view-landing-actions">
+                {props.actions}
+            </div>
+        </main>
+    )
+}
--- a/components/view/ViewNotice.tsx
+++ b/components/view/ViewNotice.tsx
@ -0,0 +1,14 @@
+import { ReactNode } from "react"
+
+type ViewNoticeProps = {
+    notice: ReactNode
+}
+
+
+export function ViewNotice(props: ViewNoticeProps) {
+    return (
+        <main className="view-notice">
+            {props.notice}
+        </main>
+    )
+}
--- a/contexts/editing.tsx
+++ b/contexts/editing.tsx
@ -0,0 +1,4 @@
+import { createStateContext } from "../utils/stateContext";
+
+
+export const EditingContext = createStateContext<boolean>()
--- a/contexts/postcard.tsx
+++ b/contexts/postcard.tsx
@ -1,8 +0,0 @@
-import { createStateContext } from "../utils/stateContext";
-import { StaticImageData } from "next/image";
-
-
-/**
- * Context containing data about the website's current postcard, the blurred background image.
- */
-export const PostcardContext = createStateContext<string | StaticImageData>()
--- a/package.json
+++ b/package.json
@ -25,6 +25,7 @@
    "prisma": "^3.14.0",
    "react": "18.1.0",
    "react-dom": "18.1.0",
+    "react-markdown": "^8.0.3",
    "react-storage-hooks": "^4.0.1",
    "react-telegram-login": "^1.1.2",
    "swr": "^1.3.0"
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@ -3,19 +3,21 @@ import type { AppProps } from 'next/app'
 import { LoginContext } from '../contexts/login'
 import { useState } from 'react'
 import defaultPostcard from "../public/postcards/adi-goldstein-Hli3R6LKibo-unsplash.jpg"
-import { Postcard } from '../components/Postcard'
-import { PostcardContext } from '../contexts/postcard'
+import { PostcardRenderer } from '../components/postcard/PostcardRenderer'
+import { PostcardContext } from '../components/postcard/PostcardContext'
 import { StaticImageData } from 'next/image'
-import { appWithTranslation } from 'next-i18next'
+import { appWithTranslation, useTranslation } from 'next-i18next'
 import { FestaLoginData } from '../types/user'
 import { useStoredLogin } from "../hooks/useStoredLogin"
 import { SWRConfig } from 'swr'
 import { AxiosRequestConfig } from 'axios'
 import { useAxios } from '../hooks/useAxios'
+import { ErrorBoundary } from '../components/errors/ErrorBoundary'


 const App = ({ Component, pageProps }: AppProps): JSX.Element => {
-    const [postcard, setPostcard] = useState<string | StaticImageData>(defaultPostcard)
+    const {t} = useTranslation()
+    const [postcard, setPostcard] = useState<string>(defaultPostcard.src)
    const [login, setLogin] = useState<FestaLoginData | null>(null)
    useStoredLogin(setLogin)

@ -30,16 +32,18 @@ const App = ({ Component, pageProps }: AppProps): JSX.Element => {
        }
    }

-    return (
+    return <>
+        <ErrorBoundary text={t("genericError")}>
        <PostcardContext.Provider value={[postcard, setPostcard]}>
        <LoginContext.Provider value={[login, setLogin]}>
        <SWRConfig value={swrConfig}>
-            <Postcard/>
+            <PostcardRenderer/>
            <Component {...pageProps} />
        </SWRConfig>
        </LoginContext.Provider>
        </PostcardContext.Provider>
-    )
+        </ErrorBoundary>
+    </>
 }

 export default appWithTranslation(App)
--- a/pages/events/[slug].tsx
+++ b/pages/events/[slug].tsx
@ -2,10 +2,16 @@ import { Event, User } from "@prisma/client";
 import { NextPageContext } from "next";
 import { useTranslation } from "next-i18next";
 import { serverSideTranslations } from "next-i18next/serverSideTranslations";
-import { useEffect } from "react";
-import { PostcardContext } from "../../contexts/postcard";
-import { useDefinedContext } from "../../utils/definedContext";
+import Head from "next/head";
+import { useState } from "react";
+import { ToolBar } from "../../components/tools/ToolBar";
+import { EditableMarkdown } from "../../components/editable/EditableMarkdown";
+import { EditableText } from "../../components/editable/EditableText";
+import { ToolToggleEditing } from "../../components/tools/ToolToggleEditing";
+import { EditingContext } from "../../contexts/editing";
 import { database } from "../../utils/prismaClient";
+import { Postcard } from "../../components/postcard/Postcard";
+import { ViewContent } from "../../components/view/ViewContent";


 export async function getServerSideProps(context: NextPageContext) {
@ -38,24 +44,31 @@ type PageEventDetailProps = {

 export default function PageEventDetail({event}: PageEventDetailProps) {
    const {t} = useTranslation()
-    const [_, setPostcard] = useDefinedContext(PostcardContext)
+    const editState = useState<boolean>(false)
+    const [description, setDescription] = useState<string>("")

-    useEffect(
-        () => {
-            if(event.postcard) {
-                setPostcard(event.postcard)
+    return <>
+        <Head>
+            <title key="title">{event.name} - {t("siteTitle")}</title>
+        </Head>
+        <Postcard 
+            src={event.postcard ?? undefined}
+        />
+        <EditingContext.Provider value={editState}>
+            <ToolBar vertical="top" horizontal="right">
+                <ToolToggleEditing/>
+            </ToolBar>
+            <ViewContent
+                title={
+                    <EditableText value={event.name}/>
                }
-        },
-        [event]
-    )
-
-    return (
-        <main id="page-event-detail" className="page">
-            <hgroup>
-                <h1>
-                    {event.name}
-                </h1>
-            </hgroup>
-        </main>
-    )
+                content={<>
+                    <EditableMarkdown 
+                        value={description} 
+                        onChange={e => setDescription((e.target as HTMLTextAreaElement).value)}
+                    />
+                </>}
+            />
+        </EditingContext.Provider>
+    </>
 }
--- a/pages/index.tsx
+++ b/pages/index.tsx
@ -1,13 +1,14 @@
 import { NextPageContext } from 'next'
 import { useTranslation } from 'next-i18next'
-import { serverSideTranslations } from 'next-i18next/serverSideTranslations';
-import { LoginContext } from '../contexts/login';
-import { useDefinedContext } from '../utils/definedContext';
-import { ActionLoginTelegram } from '../components/ActionLoginTelegram';
-import { ActionEventList } from '../components/ActionEventList';
-import { PostcardContext } from '../contexts/postcard';
+import { serverSideTranslations } from 'next-i18next/serverSideTranslations'
+import { LoginContext } from '../contexts/login'
+import { useDefinedContext } from '../utils/definedContext'
+import { ActionLoginTelegram } from '../components/ActionLoginTelegram'
+import { ActionEventList } from '../components/ActionEventList'
+import {default as Head} from 'next/head'
 import defaultPostcard from "../public/postcards/adi-goldstein-Hli3R6LKibo-unsplash.jpg"
-import { useEffect } from 'react';
+import { Postcard } from '../components/postcard/Postcard'
+import { ViewLanding } from '../components/view/ViewLanding'


 export async function getStaticProps(context: NextPageContext) {
@ -22,26 +23,19 @@ export async function getStaticProps(context: NextPageContext) {
 export default function PageIndex() {
    const { t } = useTranslation()
    const [login, ] = useDefinedContext(LoginContext)
-    const [, setPostcard] = useDefinedContext(PostcardContext)

-    useEffect(
-        () => {
-            setPostcard(defaultPostcard)
-        },
-        []
-    )
-
-    return (
-        <main id="page-index" className="page">
-            <hgroup className="hero-titles">
-                <h1>
-                    {t("siteTitle")}
-                </h1>
-                <h2>
-                    {t("siteSubtitle")}
-                </h2>
-            </hgroup>
-            {login ?
+    return <>
+        <Head>
+            <title key="title">{t("siteTitle")}</title>
+        </Head>
+        <Postcard 
+            src={defaultPostcard}
+        />
+        <ViewLanding
+            title={t("siteTitle")}
+            subtitle={t("siteSubtitle")}
+            actions={
+                (login ?
                    <ActionEventList
                        className="hero-action"
                    />
@ -49,7 +43,8 @@ export default function PageIndex() {
                    <ActionLoginTelegram
                        className="hero-action"
                    />
-            }
-        </main>
                )
            }
+        />
+    </>
+}
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@ -85,4 +85,6 @@ model Event {
    name        String
    /// The URL to the postcard of the event.
    postcard    String?
+    /// The description of the event. It will be parsed in Markdown!
+    description String  @default("")
 }
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/public/locales/it-IT/common.json
+++ b/public/locales/it-IT/common.json
@ -22,5 +22,7 @@
    "eventListCreateSubmitLabel": "Crea",
    "eventListCreateRunning": "Creazione in corso...",
    "eventListCreateRedirecting": "Caricamento dell'evento in corso...",
-    "eventListCreateError": "Si è verificato il seguente errore nella creazione del tuo evento:"
+    "eventListCreateError": "Si è verificato il seguente errore nella creazione del tuo evento:",
+    "toggleEditingEdit": "Modifica pagina",
+    "toggleEditingView": "Visualizza anteprima"
 }
--- a/public/postcards/markus-spiske-iar-afB0QQw-unsplash-red.jpg
+++ b/public/postcards/markus-spiske-iar-afB0QQw-unsplash-red.jpg
--- a/public/vercel.svg
+++ b/public/vercel.svg
@ -1,4 +0,0 @@
-<svg width="283" height="64" viewBox="0 0 283 64" fill="none" 
-    xmlns="http://www.w3.org/2000/svg">
-    <path d="M141.04 16c-11.04 0-19 7.2-19 18s8.96 18 20 18c6.67 0 12.55-2.64 16.19-7.09l-7.65-4.42c-2.02 2.21-5.09 3.5-8.54 3.5-4.79 0-8.86-2.5-10.37-6.5h28.02c.22-1.12.35-2.28.35-3.5 0-10.79-7.96-17.99-19-17.99zm-9.46 14.5c1.25-3.99 4.67-6.5 9.45-6.5 4.79 0 8.21 2.51 9.45 6.5h-18.9zM248.72 16c-11.04 0-19 7.2-19 18s8.96 18 20 18c6.67 0 12.55-2.64 16.19-7.09l-7.65-4.42c-2.02 2.21-5.09 3.5-8.54 3.5-4.79 0-8.86-2.5-10.37-6.5h28.02c.22-1.12.35-2.28.35-3.5 0-10.79-7.96-17.99-19-17.99zm-9.45 14.5c1.25-3.99 4.67-6.5 9.45-6.5 4.79 0 8.21 2.51 9.45 6.5h-18.9zM200.24 34c0 6 3.92 10 10 10 4.12 0 7.21-1.87 8.8-4.92l7.68 4.43c-3.18 5.3-9.14 8.49-16.48 8.49-11.05 0-19-7.2-19-18s7.96-18 19-18c7.34 0 13.29 3.19 16.48 8.49l-7.68 4.43c-1.59-3.05-4.68-4.92-8.8-4.92-6.07 0-10 4-10 10zm82.48-29v46h-9V5h9zM36.95 0L73.9 64H0L36.95 0zm92.38 5l-27.71 48L73.91 5H84.3l17.32 30 17.32-30h10.39zm58.91 12v9.69c-1-.29-2.06-.49-3.2-.49-5.81 0-10 4-10 10V51h-9V17h9v9.2c0-5.08 5.91-9.2 13.2-9.2z" fill="#000"/>
-</svg>
--- a/styles/color-schemes.css
+++ b/styles/color-schemes.css
@ -1,4 +1,4 @@
-/* Light theme / unsupported */
+@media (prefers-color-scheme: light) {
    body {
        --background: #fafafa;
        --foreground: black;
@ -17,9 +17,9 @@
    .postcard {
        filter: blur(7px) contrast(25%) brightness(175%);
    }
+}

 /* Dark theme */
-@media (prefers-color-scheme: dark) {
    body {
        --background: #050505;
        --foreground: white;
@ -38,4 +38,3 @@
    .postcard {
        filter: blur(7px) contrast(50%) brightness(50%);
    }
-}
--- a/styles/components/icon.css
+++ b/styles/components/icon.css
@ -0,0 +1,3 @@
+.icon {
+    filter: drop-shadow(1px 1px 1px var(--background));
+}
--- a/styles/components/list-events.css
+++ b/styles/components/list-events.css
@ -0,0 +1,12 @@
+.list-events {
+    max-height: 20vh;
+    padding-left: 20px;
+    padding-bottom: 12px;
+
+    text-align: left;
+
+    overflow-y: scroll;
+
+    column-count: auto;
+    column-width: 140px;
+}
--- a/styles/components/postcard.css
+++ b/styles/components/postcard.css
@ -0,0 +1,15 @@
+.postcard {
+    width: 100vw;
+    height: 100vh;
+
+    background-attachment: fixed;
+    background-size: cover;
+    z-index: -1;
+
+    position: fixed;
+    top: 0;
+    left: 0;
+
+    user-select: none;
+    pointer-events: none;
+}
--- a/styles/components/telegram-login.css
+++ b/styles/components/telegram-login.css
@ -0,0 +1,3 @@
+.container-btn-telegram > div {
+    height: 40px;
+}
--- a/styles/components/toolbar.css
+++ b/styles/components/toolbar.css
@ -0,0 +1,31 @@
+.toolbar {
+    display: flex;
+
+    justify-content: flex-start;
+    align-content: flex-start;
+
+    position: absolute;
+}
+
+.toolbar-top {
+    top: 8px;
+}
+
+.toolbar-bottom {
+    bottom: 8px;
+}
+
+.toolbar-left {
+    left: 8px;
+    flex-direction: row;
+}
+
+.toolbar-right {
+    right: 8px;
+    flex-direction: row-reverse;
+}
+
+.toolbar > * {
+    width: 40px;
+    height: 40px;
+}
--- a/styles/components/views/content.css
+++ b/styles/components/views/content.css
@ -0,0 +1,20 @@
+.view-content {
+    display: grid;
+    grid-template-areas: 
+        "title"
+        "content"
+    ;
+    grid-template-columns: auto;
+    grid-template-rows: auto 1fr;
+
+    justify-content: stretch;
+}
+
+.view-content-title {
+    grid-area: title;
+    text-align: center;
+}
+
+.view-content-content {
+    grid-area: content;
+}
--- a/styles/components/views/landing.css
+++ b/styles/components/views/landing.css
@ -0,0 +1,46 @@
+.view-landing {
+    display: grid;
+    grid-template-areas: 
+        "titles"
+        "actions"
+    ;
+    grid-template-columns: 100%;
+    grid-template-rows: auto 1fr;
+
+    justify-content: stretch;
+    text-align: center;
+
+    gap: 32px;
+}
+
+.view-landing-titles {
+    grid-area: titles;
+    align-self: center;
+}
+
+.view-landing-titles-title {
+    font-size: 10rem;
+}
+
+.view-landing-titles-subtitle {
+    font-size: 2.5rem;
+}
+
+@media (max-width: 800px) or (max-height: 600px) {
+    .view-landing-titles-title {
+        font-size: 5rem;
+    }
+
+    .view-landing-titles-subtitle {
+        font-size: 1.5rem;
+    }
+}
+
+.view-landing-actions {
+    grid-area: actions;
+    align-self: start;
+    justify-self: center;
+
+    max-width: 800px;
+    width: 100%;
+}
--- a/styles/components/views/notice.css
+++ b/styles/components/views/notice.css
@ -0,0 +1,6 @@
+.view-notice {
+    display: flex;
+
+    justify-content: center;
+    align-content: center;
+}
--- a/styles/elements.css
+++ b/styles/elements.css
@ -0,0 +1,71 @@
+body {
+    padding: 0;
+    margin: 0;
+
+    background-color: var(--background);
+
+    color: var(--foreground);
+    font-family: sans-serif;
+    text-shadow: 1px 1px 1px var(--background);
+
+    min-height: 100vh;
+}
+
+h1, h2, h3, h4, h5, h6 {
+    text-shadow: 2px 2px 2px var(--background);
+    margin: 0;
+}
+
+a {
+    color: var(--anchor);
+}
+
+a:visited {
+    color: var(--anchor-visited);
+}
+
+a:active {
+    color: var(--anchor-active);
+}
+
+input, button, textarea {
+    padding: 8px;
+
+    color: var(--foreground);
+    background-color: var(--interactable);
+
+    border-width: 2px;
+    border-color: var(--border);
+    border-radius: 16px;
+
+    font-size: 1em;
+
+    vertical-align: middle;
+
+}
+
+input[type="text"] {
+    border-style: inset;
+
+    width: 100%;
+}
+
+button, input[type="submit"] {
+    border-style: outset;
+    text-align: center;
+
+    width: 100%;
+}
+
+button:active:not([disabled]), input[type="submit"]:active:not([disabled]) {
+    border-style: inset;
+}
+
+textarea {
+    border-style: inset;
+    border-radius: 16px 16px 0 16px;
+
+    width: 100%;
+    min-width: 100%;
+    max-width: 100%;
+}
--- a/styles/globals.css
+++ b/styles/globals.css
@ -1,4 +1,17 @@
@import "color-schemes.css";
+@import "elements.css";
+@import "mood.css";
+/* Ughhh, there's no way to have readable CSS by using modules and Next? */
+@import "components/views/content.css";
+@import "components/views/landing.css";
+@import "components/views/notice.css";
+
+@import "components/toolbar.css";
+@import "components/icon.css";
+@import "components/list-events.css";
+@import "components/postcard.css";
+@import "components/telegram-login.css";
+

 * {
    box-sizing: border-box;
@ -10,124 +23,16 @@
    text-shadow: none;
 }

-body {
-    padding: 0;
-    margin: 0;
-
-    background-color: var(--background);
-
-    color: var(--foreground);
-    font-family: sans-serif;
-    text-shadow: 1px 1px 1px var(--background);
-
-    min-height: 100vh;
-}
-
-hgroup > * {
-    margin: 0;
-}
-
-h1, h2, h3, h4, h5, h6 {
-    text-shadow: 2px 2px 2px var(--background);
-}
-
-a {
-    color: var(--anchor);
-}
-
-a:visited {
-    color: var(--anchor-visited);
-}
-
-a:active {
-    color: var(--anchor-active);
-}
-
-input, button {
-    padding: 8px;
-
-    color: var(--foreground);
-    background-color: var(--interactable);
-
-    border-width: 2px;
-    border-color: var(--border);
-    border-radius: 16px;
-
-    font-size: medium;
-    height: 40px;
-
-    vertical-align: middle;
-}
-
-input[type="text"] {
-    border-style: inset;
-}
-
-input[type="submit"], button {
-    border-style: outset;
-    text-align: center;
-}
-
-input[type="submit"]:active:not([disabled]), button:active:not([disabled]) {
-    border-style: inset;
-}
-
 *[disabled] {
    opacity: 0.2;
    cursor: not-allowed;
 }

-.positive {
-    color: var(--positive);
-}
-
-.negative {
-    color: var(--negative);
-}
-
-.square-40 {
-    width: 40px;
-    height: 40px;
-}
-
-input.positive, button.positive {
-    border-color: var(--positive);
-}
-
-input.negative, button.negative {
-    border-color: var(--negative);
-}
-
 .page {
    min-height: 100vh;
    padding: 12px;
 }

-.container-btn-telegram > div {
-    height: 40px;
-}
-
-.postcard {
-    width: 100vw;
-    height: 100vh;
-
-    background-attachment: fixed;
-    background-size: cover;
-
-    position: absolute;
-    z-index: -1;
-
-    user-select: none;
-    pointer-events: none;
-}
-
-.icon {
-    filter: drop-shadow(1px 1px 1px var(--background));
-}
-
-.icon.fa-pulse {
-    filter: drop-shadow(1px 1px 1px var(--background));
-}

 .form-monorow {
    max-width: 600px;
@ -150,70 +55,9 @@ input.negative, button.negative {
    flex-grow: 0;
 }

-.list-events {
-    max-height: 20vh;
-    padding-left: 20px;
-    padding-bottom: 12px;
-
-    text-align: left;
-
-    overflow-y: scroll;
-
-    column-count: auto;
-    column-width: 140px;
-}
-
 .error-block pre {
    display: inline-block;
    margin: 0;

    text-align: left;
 }
-
-#page-index {
-    display: grid;
-    grid-template-columns: 100%;
-    grid-template-rows: auto 1fr;
-
-    justify-content: stretch;
-    text-align: center;
-
-    gap: 32px;
-}
-
-#page-index .hero-titles {
-    align-self: center;
-    grid-row: 1;
-}
-
-#page-index .hero-titles h1 {
-    font-size: 10rem;
-}
-
-#page-index .hero-titles h2 {
-    font-size: 2.5rem;
-}
-
-@media (max-width: 640px) or (max-height: 640px) {
-    #page-index .hero-titles h1 {
-        font-size: 5rem;
-    }
-
-    #page-index .hero-titles h2 {
-        font-size: 1.5rem;
-    }
-}
-
-#page-index .hero-action {
-    align-self: start;
-    justify-self: center;
-
-    grid-row: 2;
-
-    max-width: 800px;
-    width: 100%;
-}
-
-#page-event-detail hgroup {
-    text-align: center;
-}
--- a/styles/mood.css
+++ b/styles/mood.css
@ -0,0 +1,15 @@
+.positive {
+    color: var(--positive);
+}
+
+.negative {
+    color: var(--negative);
+}
+
+input.positive, button.positive {
+    border-color: var(--positive);
+}
+
+input.negative, button.negative {
+    border-color: var(--negative);
+}
--- a/yarn.lock
+++ b/yarn.lock
@ -187,6 +187,20 @@
  resolved "https://registry.npmjs.org/@rushstack/eslint-patch/-/eslint-patch-1.1.3.tgz#6801033be7ff87a6b7cadaf5b337c9f366a3c4b0"
  integrity sha512-WiBSI6JBIhC6LRIsB2Kwh8DsGTlbBU+mLRxJmAe3LjHTdkDpwIbEOZgoXBbZilk/vlfjK8i6nKRAvIRn1XaIMw==

+"@types/debug@^4.0.0":
+  version "4.1.7"
+  resolved "https://registry.npmjs.org/@types/debug/-/debug-4.1.7.tgz#7cc0ea761509124709b8b2d1090d8f6c17aadb82"
+  integrity sha512-9AonUzyTjXXhEOa0DnqpzZi6VHlqKMswga9EXjpXnnqxwLtdvPPtlO8evrI5D9S6asFRCQ6v+wpiUKbw+vKqyg==
+  dependencies:
+    "@types/ms" "*"
+
+"@types/hast@^2.0.0":
+  version "2.3.4"
+  resolved "https://registry.npmjs.org/@types/hast/-/hast-2.3.4.tgz#8aa5ef92c117d20d974a82bdfb6a648b08c0bafc"
+  integrity sha512-wLEm0QvaoawEDoTRwzTXp4b4jpwiJDvR5KMnFnVodm3scufTlBOWRD6N1OBf9TZMhjlNsSfcO5V+7AF4+Vy+9g==
+  dependencies:
+    "@types/unist" "*"
+
 "@types/hoist-non-react-statics@^3.3.1":
  version "3.3.1"
  resolved "https://registry.npmjs.org/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#1124aafe5118cb591977aeb1ceaaed1070eb039f"
@ -200,12 +214,29 @@
  resolved "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz#ee28707ae94e11d2b827bcbe5270bcea7f3e71ee"
  integrity sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ==

+"@types/mdast@^3.0.0":
+  version "3.0.10"
+  resolved "https://registry.npmjs.org/@types/mdast/-/mdast-3.0.10.tgz#4724244a82a4598884cbbe9bcfd73dff927ee8af"
+  integrity sha512-W864tg/Osz1+9f4lrGTZpCSO5/z4608eUp19tbozkq2HJK6i3z1kT0H9tlADXuYIb1YYOBByU4Jsqkk75q48qA==
+  dependencies:
+    "@types/unist" "*"
+
+"@types/mdurl@^1.0.0":
+  version "1.0.2"
+  resolved "https://registry.npmjs.org/@types/mdurl/-/mdurl-1.0.2.tgz#e2ce9d83a613bacf284c7be7d491945e39e1f8e9"
+  integrity sha512-eC4U9MlIcu2q0KQmXszyn5Akca/0jrQmwDRgpAMJai7qBWq4amIQhZyNau4VYGtCeALvW1/NtjzJJ567aZxfKA==
+
+"@types/ms@*":
+  version "0.7.31"
+  resolved "https://registry.npmjs.org/@types/ms/-/ms-0.7.31.tgz#31b7ca6407128a3d2bbc27fe2d21b345397f6197"
+  integrity sha512-iiUgKzV9AuaEkZqkOLDIvlQiL6ltuZd9tGcW3gwpnX8JbuiuhFlEGmmFXEXkN50Cvq7Os88IY2v0dkDqXYWVgA==
+
 "@types/node@17.0.35":
  version "17.0.35"
  resolved "https://registry.npmjs.org/@types/node/-/node-17.0.35.tgz#635b7586086d51fb40de0a2ec9d1014a5283ba4a"
  integrity sha512-vu1SrqBjbbZ3J6vwY17jBs8Sr/BKA+/a/WtjRG+whKg1iuLFOosq872EXS0eXWILdO36DHQQeku/ZcL6hz2fpg==

-"@types/prop-types@*":
+"@types/prop-types@*", "@types/prop-types@^15.0.0":
  version "15.7.5"
  resolved "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.5.tgz#5f19d2b85a98e9558036f6a3cacc8819420f05cf"
  integrity sha512-JCB8C6SnDoQf0cNycqd/35A7MjcnK+ZTqE7judS6o7utxUCg6imJg3QK2qzHKszlTjcj2cn+NwMB2i96ubpj7w==
@ -240,6 +271,11 @@
  resolved "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.2.tgz#1a62f89525723dde24ba1b01b092bf5df8ad4d39"
  integrity sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==

+"@types/unist@*", "@types/unist@^2.0.0":
+  version "2.0.6"
+  resolved "https://registry.npmjs.org/@types/unist/-/unist-2.0.6.tgz#250a7b16c3b91f672a24552ec64678eeb1d3a08d"
+  integrity sha512-PBjIUxZHOuj0R15/xuwJYjFi+KZdNFrehocChv4g5hu6aFroHue8m0lBP0POdK2nKzbw0cgV1mws8+V/JAcEkQ==
+
 "@typescript-eslint/parser@^5.21.0":
  version "5.27.0"
  resolved "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.27.0.tgz#62bb091ed5cf9c7e126e80021bb563dcf36b6b12"
@ -393,6 +429,11 @@ axobject-query@^2.2.0:
  resolved "https://registry.npmjs.org/axobject-query/-/axobject-query-2.2.0.tgz#943d47e10c0b704aa42275e20edf3722648989be"
  integrity sha512-Td525n+iPOOyUQIeBfcASuG6uJsDOITl7Mds5gFyerkWiX7qhUTdYUBlSgNMyVqtSJqwpt1kXGLdUt6SykLMRA==

+bail@^2.0.0:
+  version "2.0.2"
+  resolved "https://registry.npmjs.org/bail/-/bail-2.0.2.tgz#d26f5cd8fe5d6f832a31517b9f7c356040ba6d5d"
+  integrity sha512-0xO6mYd7JB2YesxDKplafRpsiOzPt9V02ddPCLbY1xYGPOX24NTyN50qnUxgCPcSoYMhKpAuBTjQoRZCAkUDRw==
+
 balanced-match@^1.0.0:
  version "1.0.2"
  resolved "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz#e83e3a7e3f300b34cb9d87f615fa0cbf357690ee"
@ -439,6 +480,11 @@ chalk@^4.0.0:
    ansi-styles "^4.1.0"
    supports-color "^7.1.0"

+character-entities@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.npmjs.org/character-entities/-/character-entities-2.0.1.tgz#98724833e1e27990dee0bd0f2b8a859c3476aac7"
+  integrity sha512-OzmutCf2Kmc+6DrFrrPS8/tDh2+DpnrfzdICHWhcVC9eOd0N1PXmQEE1a8iM4IziIAG+8tmTq3K+oo0ubH6RRQ==
+
 classnames@^2.3.1:
  version "2.3.1"
  resolved "https://registry.npmjs.org/classnames/-/classnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e"
@ -463,6 +509,11 @@ combined-stream@^1.0.8:
  dependencies:
    delayed-stream "~1.0.0"

+comma-separated-tokens@^2.0.0:
+  version "2.0.2"
+  resolved "https://registry.npmjs.org/comma-separated-tokens/-/comma-separated-tokens-2.0.2.tgz#d4c25abb679b7751c880be623c1179780fe1dd98"
+  integrity sha512-G5yTt3KQN4Yn7Yk4ed73hlZ1evrFKXeUW3086p3PRFNp7m2vIjI6Pg+Kgb+oyzhd9F2qdcoj67+y3SdxL5XWsg==
+
 concat-map@0.0.1:
  version "0.0.1"
  resolved "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz#d8a96bd77fd68df7793a73036a3ba0d5405d477b"
@ -533,13 +584,20 @@ debug@^3.2.7:
  dependencies:
    ms "^2.1.1"

-debug@^4.1.1, debug@^4.3.2, debug@^4.3.4:
+debug@^4.0.0, debug@^4.1.1, debug@^4.3.2, debug@^4.3.4:
  version "4.3.4"
  resolved "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz#1319f6579357f2338d3337d2cdd4914bb5dcc865"
  integrity sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==
  dependencies:
    ms "2.1.2"

+decode-named-character-reference@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.npmjs.org/decode-named-character-reference/-/decode-named-character-reference-1.0.2.tgz#daabac9690874c394c81e4162a0304b35d824f0e"
+  integrity sha512-O8x12RzrUF8xyVcY0KJowWsmaJxQbmy0/EtnNtHRpsOcT7dFk5W598coHqBVpmWo1oQQfsCqfCmkZN5DJrZVdg==
+  dependencies:
+    character-entities "^2.0.0"
+
 deep-is@^0.1.3:
  version "0.1.4"
  resolved "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz#a6f2dce612fadd2ef1f519b73551f17e85199831"
@ -558,6 +616,16 @@ delayed-stream@~1.0.0:
  resolved "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz#df3ae199acadfb7d440aaae0b29e2272b24ec619"
  integrity sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==

+dequal@^2.0.0:
+  version "2.0.2"
+  resolved "https://registry.npmjs.org/dequal/-/dequal-2.0.2.tgz#85ca22025e3a87e65ef75a7a437b35284a7e319d"
+  integrity sha512-q9K8BlJVxK7hQYqa6XISGmBZbtQQWVXSrRrWreHC94rMt1QL/Impruc+7p2CYSYuVIUr+YCt6hjrs1kkdJRTug==
+
+diff@^5.0.0:
+  version "5.1.0"
+  resolved "https://registry.npmjs.org/diff/-/diff-5.1.0.tgz#bc52d298c5ea8df9194800224445ed43ffc87e40"
+  integrity sha512-D+mk+qE8VC/PAUrlAU34N+VfXev0ghe5ywmpqrawphmVZc1bEfn56uo9qpyGp1p4xpzOHkSW4ztBd6L7Xx4ACw==
+
 dir-glob@^3.0.1:
  version "3.0.1"
  resolved "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz#56dbf73d992a4a93ba1584f4534063fd2e41717f"
@ -857,6 +925,11 @@ esutils@^2.0.2:
  resolved "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz#74d2eb4de0b8da1293711910d50775b9b710ef64"
  integrity sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==

+extend@^3.0.0:
+  version "3.0.2"
+  resolved "https://registry.npmjs.org/extend/-/extend-3.0.2.tgz#f8b1136b4071fbd8eb140aff858b1019ec2915fa"
+  integrity sha512-fjquC59cD7CyW6urNXK0FBufkZcoiGG80wTuPujX590cB5Ttln20E2UB4S/WARVqhXffZl2LNgS+gQdPIIim/g==
+
 fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3:
  version "3.1.3"
  resolved "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz#3a7d56b559d6cbc3eb512325244e619a65c6c525"
@ -1078,6 +1151,11 @@ has@^1.0.3:
  dependencies:
    function-bind "^1.1.1"

+hast-util-whitespace@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.npmjs.org/hast-util-whitespace/-/hast-util-whitespace-2.0.0.tgz#4fc1086467cc1ef5ba20673cb6b03cec3a970f1c"
+  integrity sha512-Pkw+xBHuV6xFeJprJe2BBEoDV+AvQySaz3pPDRUs5PNZEMQjpXJJueqrpcHIXxnWTcAGi/UOCgVShlkY6kLoqg==
+
 hoist-non-react-statics@^3.2.0, hoist-non-react-statics@^3.3.0:
  version "3.3.2"
  resolved "https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
@ -1140,6 +1218,11 @@ inherits@2:
  resolved "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz#0fa2c64f932917c3433a0ded55363aae37416b7c"
  integrity sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==

+inline-style-parser@0.1.1:
+  version "0.1.1"
+  resolved "https://registry.npmjs.org/inline-style-parser/-/inline-style-parser-0.1.1.tgz#ec8a3b429274e9c0a1f1c4ffa9453a7fef72cea1"
+  integrity sha512-7NXolsK4CAS5+xvdj5OMMbI962hU/wvwoxk+LWR9Ek9bVtyuuYScDN6eS0rUm6TxApFpw7CX1o4uJzcd4AyD3Q==
+
 internal-slot@^1.0.3:
  version "1.0.3"
  resolved "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.3.tgz#7347e307deeea2faac2ac6205d4bc7d34967f59c"
@ -1164,6 +1247,11 @@ is-boolean-object@^1.1.0:
    call-bind "^1.0.2"
    has-tostringtag "^1.0.0"

+is-buffer@^2.0.0:
+  version "2.0.5"
+  resolved "https://registry.npmjs.org/is-buffer/-/is-buffer-2.0.5.tgz#ebc252e400d22ff8d77fa09888821a24a658c191"
+  integrity sha512-i2R6zNFDwgEHJyQUtJEk0XFi1i0dPFn/oqjK3/vPCcDeJvW5NQ83V8QbicfF1SupOaB0h8ntgBC2YiE7dfyctQ==
+
 is-callable@^1.1.4, is-callable@^1.2.4:
  version "1.2.4"
  resolved "https://registry.npmjs.org/is-callable/-/is-callable-1.2.4.tgz#47301d58dd0259407865547853df6d61fe471945"
@ -1212,6 +1300,11 @@ is-number@^7.0.0:
  resolved "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz#7535345b896734d5f80c4d06c50955527a14f12b"
  integrity sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==

+is-plain-obj@^4.0.0:
+  version "4.0.0"
+  resolved "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-4.0.0.tgz#06c0999fd7574edf5a906ba5644ad0feb3a84d22"
+  integrity sha512-NXRbBtUdBioI73y/HmOhogw/U5msYPC9DAtGkJXeFcFWSFZw0mCUsPxk/snTuJHzNKA8kLBK4rH97RMB1BfCXw==
+
 is-regex@^1.1.4:
  version "1.1.4"
  resolved "https://registry.npmjs.org/is-regex/-/is-regex-1.1.4.tgz#eef5663cd59fa4c0ae339505323df6854bb15958"
@ -1290,6 +1383,11 @@ json5@^1.0.1:
    array-includes "^3.1.4"
    object.assign "^4.1.2"

+kleur@^4.0.3:
+  version "4.1.4"
+  resolved "https://registry.npmjs.org/kleur/-/kleur-4.1.4.tgz#8c202987d7e577766d039a8cd461934c01cda04d"
+  integrity sha512-8QADVssbrFjivHWQU7KkMgptGTl6WAcSdlbBPY4uNF+mWr6DGcKrvY2w4FQJoXch7+fKMjj0dRrL75vk3k23OA==
+
 language-subtag-registry@~0.3.2:
  version "0.3.21"
  resolved "https://registry.npmjs.org/language-subtag-registry/-/language-subtag-registry-0.3.21.tgz#04ac218bea46f04cb039084602c6da9e788dd45a"
@ -1337,11 +1435,259 @@ lru-cache@^6.0.0:
  dependencies:
    yallist "^4.0.0"

+mdast-util-definitions@^5.0.0:
+  version "5.1.0"
+  resolved "https://registry.npmjs.org/mdast-util-definitions/-/mdast-util-definitions-5.1.0.tgz#b6d10ef00a3c4cf191e8d9a5fa58d7f4a366f817"
+  integrity sha512-5hcR7FL2EuZ4q6lLMUK5w4lHT2H3vqL9quPvYZ/Ku5iifrirfMHiGdhxdXMUbUkDmz5I+TYMd7nbaxUhbQkfpQ==
+  dependencies:
+    "@types/mdast" "^3.0.0"
+    "@types/unist" "^2.0.0"
+    unist-util-visit "^3.0.0"
+
+mdast-util-from-markdown@^1.0.0:
+  version "1.2.0"
+  resolved "https://registry.npmjs.org/mdast-util-from-markdown/-/mdast-util-from-markdown-1.2.0.tgz#84df2924ccc6c995dec1e2368b2b208ad0a76268"
+  integrity sha512-iZJyyvKD1+K7QX1b5jXdE7Sc5dtoTry1vzV28UZZe8Z1xVnB/czKntJ7ZAkG0tANqRnBF6p3p7GpU1y19DTf2Q==
+  dependencies:
+    "@types/mdast" "^3.0.0"
+    "@types/unist" "^2.0.0"
+    decode-named-character-reference "^1.0.0"
+    mdast-util-to-string "^3.1.0"
+    micromark "^3.0.0"
+    micromark-util-decode-numeric-character-reference "^1.0.0"
+    micromark-util-decode-string "^1.0.0"
+    micromark-util-normalize-identifier "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+    unist-util-stringify-position "^3.0.0"
+    uvu "^0.5.0"
+
+mdast-util-to-hast@^12.1.0:
+  version "12.1.1"
+  resolved "https://registry.npmjs.org/mdast-util-to-hast/-/mdast-util-to-hast-12.1.1.tgz#89a2bb405eaf3b05eb8bf45157678f35eef5dbca"
+  integrity sha512-qE09zD6ylVP14jV4mjLIhDBOrpFdShHZcEsYvvKGABlr9mGbV7mTlRWdoFxL/EYSTNDiC9GZXy7y8Shgb9Dtzw==
+  dependencies:
+    "@types/hast" "^2.0.0"
+    "@types/mdast" "^3.0.0"
+    "@types/mdurl" "^1.0.0"
+    mdast-util-definitions "^5.0.0"
+    mdurl "^1.0.0"
+    micromark-util-sanitize-uri "^1.0.0"
+    unist-builder "^3.0.0"
+    unist-util-generated "^2.0.0"
+    unist-util-position "^4.0.0"
+    unist-util-visit "^4.0.0"
+
+mdast-util-to-string@^3.1.0:
+  version "3.1.0"
+  resolved "https://registry.npmjs.org/mdast-util-to-string/-/mdast-util-to-string-3.1.0.tgz#56c506d065fbf769515235e577b5a261552d56e9"
+  integrity sha512-n4Vypz/DZgwo0iMHLQL49dJzlp7YtAJP+N07MZHpjPf/5XJuHUWstviF4Mn2jEiR/GNmtnRRqnwsXExk3igfFA==
+
+mdurl@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.npmjs.org/mdurl/-/mdurl-1.0.1.tgz#fe85b2ec75a59037f2adfec100fd6c601761152e"
+  integrity sha512-/sKlQJCBYVY9Ers9hqzKou4H6V5UWc/M59TH2dvkt+84itfnq7uFOMLpOiOS4ujvHP4etln18fmIxA5R5fll0g==
+
 merge2@^1.3.0, merge2@^1.4.1:
  version "1.4.1"
  resolved "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae"
  integrity sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==

+micromark-core-commonmark@^1.0.1:
+  version "1.0.6"
+  resolved "https://registry.npmjs.org/micromark-core-commonmark/-/micromark-core-commonmark-1.0.6.tgz#edff4c72e5993d93724a3c206970f5a15b0585ad"
+  integrity sha512-K+PkJTxqjFfSNkfAhp4GB+cZPfQd6dxtTXnf+RjZOV7T4EEXnvgzOcnp+eSTmpGk9d1S9sL6/lqrgSNn/s0HZA==
+  dependencies:
+    decode-named-character-reference "^1.0.0"
+    micromark-factory-destination "^1.0.0"
+    micromark-factory-label "^1.0.0"
+    micromark-factory-space "^1.0.0"
+    micromark-factory-title "^1.0.0"
+    micromark-factory-whitespace "^1.0.0"
+    micromark-util-character "^1.0.0"
+    micromark-util-chunked "^1.0.0"
+    micromark-util-classify-character "^1.0.0"
+    micromark-util-html-tag-name "^1.0.0"
+    micromark-util-normalize-identifier "^1.0.0"
+    micromark-util-resolve-all "^1.0.0"
+    micromark-util-subtokenize "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.1"
+    uvu "^0.5.0"
+
+micromark-factory-destination@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/micromark-factory-destination/-/micromark-factory-destination-1.0.0.tgz#fef1cb59ad4997c496f887b6977aa3034a5a277e"
+  integrity sha512-eUBA7Rs1/xtTVun9TmV3gjfPz2wEwgK5R5xcbIM5ZYAtvGF6JkyaDsj0agx8urXnO31tEO6Ug83iVH3tdedLnw==
+  dependencies:
+    micromark-util-character "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+
+micromark-factory-label@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.npmjs.org/micromark-factory-label/-/micromark-factory-label-1.0.2.tgz#6be2551fa8d13542fcbbac478258fb7a20047137"
+  integrity sha512-CTIwxlOnU7dEshXDQ+dsr2n+yxpP0+fn271pu0bwDIS8uqfFcumXpj5mLn3hSC8iw2MUr6Gx8EcKng1dD7i6hg==
+  dependencies:
+    micromark-util-character "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+    uvu "^0.5.0"
+
+micromark-factory-space@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/micromark-factory-space/-/micromark-factory-space-1.0.0.tgz#cebff49968f2b9616c0fcb239e96685cb9497633"
+  integrity sha512-qUmqs4kj9a5yBnk3JMLyjtWYN6Mzfcx8uJfi5XAveBniDevmZasdGBba5b4QsvRcAkmvGo5ACmSUmyGiKTLZew==
+  dependencies:
+    micromark-util-character "^1.0.0"
+    micromark-util-types "^1.0.0"
+
+micromark-factory-title@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.npmjs.org/micromark-factory-title/-/micromark-factory-title-1.0.2.tgz#7e09287c3748ff1693930f176e1c4a328382494f"
+  integrity sha512-zily+Nr4yFqgMGRKLpTVsNl5L4PMu485fGFDOQJQBl2NFpjGte1e86zC0da93wf97jrc4+2G2GQudFMHn3IX+A==
+  dependencies:
+    micromark-factory-space "^1.0.0"
+    micromark-util-character "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+    uvu "^0.5.0"
+
+micromark-factory-whitespace@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/micromark-factory-whitespace/-/micromark-factory-whitespace-1.0.0.tgz#e991e043ad376c1ba52f4e49858ce0794678621c"
+  integrity sha512-Qx7uEyahU1lt1RnsECBiuEbfr9INjQTGa6Err+gF3g0Tx4YEviPbqqGKNv/NrBaE7dVHdn1bVZKM/n5I/Bak7A==
+  dependencies:
+    micromark-factory-space "^1.0.0"
+    micromark-util-character "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+
+micromark-util-character@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.npmjs.org/micromark-util-character/-/micromark-util-character-1.1.0.tgz#d97c54d5742a0d9611a68ca0cd4124331f264d86"
+  integrity sha512-agJ5B3unGNJ9rJvADMJ5ZiYjBRyDpzKAOk01Kpi1TKhlT1APx3XZk6eN7RtSz1erbWHC2L8T3xLZ81wdtGRZzg==
+  dependencies:
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+
+micromark-util-chunked@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/micromark-util-chunked/-/micromark-util-chunked-1.0.0.tgz#5b40d83f3d53b84c4c6bce30ed4257e9a4c79d06"
+  integrity sha512-5e8xTis5tEZKgesfbQMKRCyzvffRRUX+lK/y+DvsMFdabAicPkkZV6gO+FEWi9RfuKKoxxPwNL+dFF0SMImc1g==
+  dependencies:
+    micromark-util-symbol "^1.0.0"
+
+micromark-util-classify-character@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/micromark-util-classify-character/-/micromark-util-classify-character-1.0.0.tgz#cbd7b447cb79ee6997dd274a46fc4eb806460a20"
+  integrity sha512-F8oW2KKrQRb3vS5ud5HIqBVkCqQi224Nm55o5wYLzY/9PwHGXC01tr3d7+TqHHz6zrKQ72Okwtvm/xQm6OVNZA==
+  dependencies:
+    micromark-util-character "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+
+micromark-util-combine-extensions@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/micromark-util-combine-extensions/-/micromark-util-combine-extensions-1.0.0.tgz#91418e1e74fb893e3628b8d496085639124ff3d5"
+  integrity sha512-J8H058vFBdo/6+AsjHp2NF7AJ02SZtWaVUjsayNFeAiydTxUwViQPxN0Hf8dp4FmCQi0UUFovFsEyRSUmFH3MA==
+  dependencies:
+    micromark-util-chunked "^1.0.0"
+    micromark-util-types "^1.0.0"
+
+micromark-util-decode-numeric-character-reference@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/micromark-util-decode-numeric-character-reference/-/micromark-util-decode-numeric-character-reference-1.0.0.tgz#dcc85f13b5bd93ff8d2868c3dba28039d490b946"
+  integrity sha512-OzO9AI5VUtrTD7KSdagf4MWgHMtET17Ua1fIpXTpuhclCqD8egFWo85GxSGvxgkGS74bEahvtM0WP0HjvV0e4w==
+  dependencies:
+    micromark-util-symbol "^1.0.0"
+
+micromark-util-decode-string@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.npmjs.org/micromark-util-decode-string/-/micromark-util-decode-string-1.0.2.tgz#942252ab7a76dec2dbf089cc32505ee2bc3acf02"
+  integrity sha512-DLT5Ho02qr6QWVNYbRZ3RYOSSWWFuH3tJexd3dgN1odEuPNxCngTCXJum7+ViRAd9BbdxCvMToPOD/IvVhzG6Q==
+  dependencies:
+    decode-named-character-reference "^1.0.0"
+    micromark-util-character "^1.0.0"
+    micromark-util-decode-numeric-character-reference "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+
+micromark-util-encode@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.npmjs.org/micromark-util-encode/-/micromark-util-encode-1.0.1.tgz#2c1c22d3800870ad770ece5686ebca5920353383"
+  integrity sha512-U2s5YdnAYexjKDel31SVMPbfi+eF8y1U4pfiRW/Y8EFVCy/vgxk/2wWTxzcqE71LHtCuCzlBDRU2a5CQ5j+mQA==
+
+micromark-util-html-tag-name@^1.0.0:
+  version "1.1.0"
+  resolved "https://registry.npmjs.org/micromark-util-html-tag-name/-/micromark-util-html-tag-name-1.1.0.tgz#eb227118befd51f48858e879b7a419fc0df20497"
+  integrity sha512-BKlClMmYROy9UiV03SwNmckkjn8QHVaWkqoAqzivabvdGcwNGMMMH/5szAnywmsTBUzDsU57/mFi0sp4BQO6dA==
+
+micromark-util-normalize-identifier@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/micromark-util-normalize-identifier/-/micromark-util-normalize-identifier-1.0.0.tgz#4a3539cb8db954bbec5203952bfe8cedadae7828"
+  integrity sha512-yg+zrL14bBTFrQ7n35CmByWUTFsgst5JhA4gJYoty4Dqzj4Z4Fr/DHekSS5aLfH9bdlfnSvKAWsAgJhIbogyBg==
+  dependencies:
+    micromark-util-symbol "^1.0.0"
+
+micromark-util-resolve-all@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/micromark-util-resolve-all/-/micromark-util-resolve-all-1.0.0.tgz#a7c363f49a0162e931960c44f3127ab58f031d88"
+  integrity sha512-CB/AGk98u50k42kvgaMM94wzBqozSzDDaonKU7P7jwQIuH2RU0TeBqGYJz2WY1UdihhjweivStrJ2JdkdEmcfw==
+  dependencies:
+    micromark-util-types "^1.0.0"
+
+micromark-util-sanitize-uri@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmjs.org/micromark-util-sanitize-uri/-/micromark-util-sanitize-uri-1.0.0.tgz#27dc875397cd15102274c6c6da5585d34d4f12b2"
+  integrity sha512-cCxvBKlmac4rxCGx6ejlIviRaMKZc0fWm5HdCHEeDWRSkn44l6NdYVRyU+0nT1XC72EQJMZV8IPHF+jTr56lAg==
+  dependencies:
+    micromark-util-character "^1.0.0"
+    micromark-util-encode "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+
+micromark-util-subtokenize@^1.0.0:
+  version "1.0.2"
+  resolved "https://registry.npmjs.org/micromark-util-subtokenize/-/micromark-util-subtokenize-1.0.2.tgz#ff6f1af6ac836f8bfdbf9b02f40431760ad89105"
+  integrity sha512-d90uqCnXp/cy4G881Ub4psE57Sf8YD0pim9QdjCRNjfas2M1u6Lbt+XZK9gnHL2XFhnozZiEdCa9CNfXSfQ6xA==
+  dependencies:
+    micromark-util-chunked "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.0"
+    uvu "^0.5.0"
+
+micromark-util-symbol@^1.0.0:
+  version "1.0.1"
+  resolved "https://registry.npmjs.org/micromark-util-symbol/-/micromark-util-symbol-1.0.1.tgz#b90344db62042ce454f351cf0bebcc0a6da4920e"
+  integrity sha512-oKDEMK2u5qqAptasDAwWDXq0tG9AssVwAx3E9bBF3t/shRIGsWIRG+cGafs2p/SnDSOecnt6hZPCE2o6lHfFmQ==
+
+micromark-util-types@^1.0.0, micromark-util-types@^1.0.1:
+  version "1.0.2"
+  resolved "https://registry.npmjs.org/micromark-util-types/-/micromark-util-types-1.0.2.tgz#f4220fdb319205812f99c40f8c87a9be83eded20"
+  integrity sha512-DCfg/T8fcrhrRKTPjRrw/5LLvdGV7BHySf/1LOZx7TzWZdYRjogNtyNq885z3nNallwr3QUKARjqvHqX1/7t+w==
+
+micromark@^3.0.0:
+  version "3.0.10"
+  resolved "https://registry.npmjs.org/micromark/-/micromark-3.0.10.tgz#1eac156f0399d42736458a14b0ca2d86190b457c"
+  integrity sha512-ryTDy6UUunOXy2HPjelppgJ2sNfcPz1pLlMdA6Rz9jPzhLikWXv/irpWV/I2jd68Uhmny7hHxAlAhk4+vWggpg==
+  dependencies:
+    "@types/debug" "^4.0.0"
+    debug "^4.0.0"
+    decode-named-character-reference "^1.0.0"
+    micromark-core-commonmark "^1.0.1"
+    micromark-factory-space "^1.0.0"
+    micromark-util-character "^1.0.0"
+    micromark-util-chunked "^1.0.0"
+    micromark-util-combine-extensions "^1.0.0"
+    micromark-util-decode-numeric-character-reference "^1.0.0"
+    micromark-util-encode "^1.0.0"
+    micromark-util-normalize-identifier "^1.0.0"
+    micromark-util-resolve-all "^1.0.0"
+    micromark-util-sanitize-uri "^1.0.0"
+    micromark-util-subtokenize "^1.0.0"
+    micromark-util-symbol "^1.0.0"
+    micromark-util-types "^1.0.1"
+    uvu "^0.5.0"
+
 micromatch@^4.0.4:
  version "4.0.5"
  resolved "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz#bc8999a7cbbf77cdc89f132f6e467051b49090c6"
@ -1374,6 +1720,11 @@ minimist@^1.2.0, minimist@^1.2.5, minimist@^1.2.6:
  resolved "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz#8637a5b759ea0d6e98702cfb3a9283323c93af44"
  integrity sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==

+mri@^1.1.0:
+  version "1.2.0"
+  resolved "https://registry.npmjs.org/mri/-/mri-1.2.0.tgz#6721480fec2a11a4889861115a48b6cbe7cc8f0b"
+  integrity sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==
+
 ms@2.0.0:
  version "2.0.0"
  resolved "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz#5608aeadfc00be6c2901df5f9861788de0d597c8"
@ -1596,7 +1947,7 @@ prisma@^3.14.0:
  dependencies:
    "@prisma/engines" "3.14.0-36.2b0c12756921c891fec4f68d9444e18c7d5d4a6a"

-prop-types@^15.6.2, prop-types@^15.8.1:
+prop-types@^15.0.0, prop-types@^15.6.2, prop-types@^15.8.1:
  version "15.8.1"
  resolved "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"
  integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==
@ -1605,6 +1956,11 @@ prop-types@^15.6.2, prop-types@^15.8.1:
    object-assign "^4.1.1"
    react-is "^16.13.1"

+property-information@^6.0.0:
+  version "6.1.1"
+  resolved "https://registry.npmjs.org/property-information/-/property-information-6.1.1.tgz#5ca85510a3019726cb9afed4197b7b8ac5926a22"
+  integrity sha512-hrzC564QIl0r0vy4l6MvRLhafmUowhO/O3KgVSoXIbbA2Sz4j8HGpJc6T2cubRVwMwpdiG/vKGfhT4IixmKN9w==
+
 punycode@^2.1.0:
  version "2.1.1"
  resolved "https://registry.npmjs.org/punycode/-/punycode-2.1.1.tgz#b58b010ac40c22c5657616c8d2c2c02c7bf479ec"
@ -1637,6 +1993,32 @@ react-is@^16.13.1, react-is@^16.7.0:
  resolved "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
  integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==

+react-is@^18.0.0:
+  version "18.1.0"
+  resolved "https://registry.npmjs.org/react-is/-/react-is-18.1.0.tgz#61aaed3096d30eacf2a2127118b5b41387d32a67"
+  integrity sha512-Fl7FuabXsJnV5Q1qIOQwx/sagGF18kogb4gpfcG4gjLBWO0WDiiz1ko/ExayuxE7InyQkBLkxRFG5oxY6Uu3Kg==
+
+react-markdown@^8.0.3:
+  version "8.0.3"
+  resolved "https://registry.npmjs.org/react-markdown/-/react-markdown-8.0.3.tgz#e8aba0d2f5a1b2124d476ee1fff9448a2f57e4b3"
+  integrity sha512-We36SfqaKoVNpN1QqsZwWSv/OZt5J15LNgTLWynwAN5b265hrQrsjMtlRNwUvS+YyR3yDM8HpTNc4pK9H/Gc0A==
+  dependencies:
+    "@types/hast" "^2.0.0"
+    "@types/prop-types" "^15.0.0"
+    "@types/unist" "^2.0.0"
+    comma-separated-tokens "^2.0.0"
+    hast-util-whitespace "^2.0.0"
+    prop-types "^15.0.0"
+    property-information "^6.0.0"
+    react-is "^18.0.0"
+    remark-parse "^10.0.0"
+    remark-rehype "^10.0.0"
+    space-separated-tokens "^2.0.0"
+    style-to-object "^0.3.0"
+    unified "^10.0.0"
+    unist-util-visit "^4.0.0"
+    vfile "^5.0.0"
+
 react-storage-hooks@^4.0.1:
  version "4.0.1"
  resolved "https://registry.npmjs.org/react-storage-hooks/-/react-storage-hooks-4.0.1.tgz#e30ed5cda48c77c431ecc02ec3824bd615f5b7fb"
@ -1684,6 +2066,25 @@ regexpp@^3.2.0:
  resolved "https://registry.npmjs.org/regexpp/-/regexpp-3.2.0.tgz#0425a2768d8f23bad70ca4b90461fa2f1213e1b2"
  integrity sha512-pq2bWo9mVD43nbts2wGv17XLiNLya+GklZ8kaDLV2Z08gDCsGpnKn9BFMepvWuHCbyVvY7J5o5+BVvoQbmlJLg==

+remark-parse@^10.0.0:
+  version "10.0.1"
+  resolved "https://registry.npmjs.org/remark-parse/-/remark-parse-10.0.1.tgz#6f60ae53edbf0cf38ea223fe643db64d112e0775"
+  integrity sha512-1fUyHr2jLsVOkhbvPRBJ5zTKZZyD6yZzYaWCS6BPBdQ8vEMBCH+9zNCDA6tET/zHCi/jLqjCWtlJZUPk+DbnFw==
+  dependencies:
+    "@types/mdast" "^3.0.0"
+    mdast-util-from-markdown "^1.0.0"
+    unified "^10.0.0"
+
+remark-rehype@^10.0.0:
+  version "10.1.0"
+  resolved "https://registry.npmjs.org/remark-rehype/-/remark-rehype-10.1.0.tgz#32dc99d2034c27ecaf2e0150d22a6dcccd9a6279"
+  integrity sha512-EFmR5zppdBp0WQeDVZ/b66CWJipB2q2VLNFMabzDSGR66Z2fQii83G5gTBbgGEnEEA0QRussvrFHxk1HWGJskw==
+  dependencies:
+    "@types/hast" "^2.0.0"
+    "@types/mdast" "^3.0.0"
+    mdast-util-to-hast "^12.1.0"
+    unified "^10.0.0"
+
 resolve-from@^4.0.0:
  version "4.0.0"
  resolved "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz#4abcd852ad32dd7baabfe9b40e00a36db5f392e6"
@ -1725,6 +2126,13 @@ run-parallel@^1.1.9:
  dependencies:
    queue-microtask "^1.2.2"

+sade@^1.7.3:
+  version "1.8.1"
+  resolved "https://registry.npmjs.org/sade/-/sade-1.8.1.tgz#0a78e81d658d394887be57d2a409bf703a3b2701"
+  integrity sha512-xal3CZX1Xlo/k4ApwCFrHVACi9fBqJ7V+mwhBsuf/1IOKbBy098Fex+Wa/5QMubw09pSZ/u8EY8PWgevJsXp1A==
+  dependencies:
+    mri "^1.1.0"
+
 scheduler@^0.22.0:
  version "0.22.0"
  resolved "https://registry.npmjs.org/scheduler/-/scheduler-0.22.0.tgz#83a5d63594edf074add9a7198b1bae76c3db01b8"
@ -1775,6 +2183,11 @@ source-map-js@^1.0.1:
  resolved "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
  integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==

+space-separated-tokens@^2.0.0:
+  version "2.0.1"
+  resolved "https://registry.npmjs.org/space-separated-tokens/-/space-separated-tokens-2.0.1.tgz#43193cec4fb858a2ce934b7f98b7f2c18107098b"
+  integrity sha512-ekwEbFp5aqSPKaqeY1PGrlGQxPNaq+Cnx4+bE2D8sciBQrHpbwoBbawqTN2+6jPs9IdWxxiUcN0K2pkczD3zmw==
+
 string.prototype.matchall@^4.0.7:
  version "4.0.7"
  resolved "https://registry.npmjs.org/string.prototype.matchall/-/string.prototype.matchall-4.0.7.tgz#8e6ecb0d8a1fb1fda470d81acecb2dba057a481d"
@ -1824,6 +2237,13 @@ strip-json-comments@^3.1.0, strip-json-comments@^3.1.1:
  resolved "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz#31f1281b3832630434831c310c01cccda8cbe006"
  integrity sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==

+style-to-object@^0.3.0:
+  version "0.3.0"
+  resolved "https://registry.npmjs.org/style-to-object/-/style-to-object-0.3.0.tgz#b1b790d205991cc783801967214979ee19a76e46"
+  integrity sha512-CzFnRRXhzWIdItT3OmF8SQfWyahHhjq3HwcMNCNLn+N7klOOqPjMeG/4JSu77D7ypZdGvSzvkrbyeTMizz2VrA==
+  dependencies:
+    inline-style-parser "0.1.1"
+
 styled-jsx@5.0.2:
  version "5.0.2"
  resolved "https://registry.npmjs.org/styled-jsx/-/styled-jsx-5.0.2.tgz#ff230fd593b737e9e68b630a694d460425478729"
@ -1858,6 +2278,11 @@ to-regex-range@^5.0.1:
  dependencies:
    is-number "^7.0.0"

+trough@^2.0.0:
+  version "2.1.0"
+  resolved "https://registry.npmjs.org/trough/-/trough-2.1.0.tgz#0f7b511a4fde65a46f18477ab38849b22c554876"
+  integrity sha512-AqTiAOLcj85xS7vQ8QkAV41hPDIJ71XJB4RCUrzo/1GM2CQwhkJGaf9Hgr7BOugMRpgGUrqRg/DrBDl4H40+8g==
+
 tsconfig-paths@^3.14.1:
  version "3.14.1"
  resolved "https://registry.npmjs.org/tsconfig-paths/-/tsconfig-paths-3.14.1.tgz#ba0734599e8ea36c862798e920bcf163277b137a"
@ -1912,6 +2337,84 @@ unbox-primitive@^1.0.2:
    has-symbols "^1.0.3"
    which-boxed-primitive "^1.0.2"

+unified@^10.0.0:
+  version "10.1.2"
+  resolved "https://registry.npmjs.org/unified/-/unified-10.1.2.tgz#b1d64e55dafe1f0b98bb6c719881103ecf6c86df"
+  integrity sha512-pUSWAi/RAnVy1Pif2kAoeWNBa3JVrx0MId2LASj8G+7AiHWoKZNTomq6LG326T68U7/e263X6fTdcXIy7XnF7Q==
+  dependencies:
+    "@types/unist" "^2.0.0"
+    bail "^2.0.0"
+    extend "^3.0.0"
+    is-buffer "^2.0.0"
+    is-plain-obj "^4.0.0"
+    trough "^2.0.0"
+    vfile "^5.0.0"
+
+unist-builder@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.npmjs.org/unist-builder/-/unist-builder-3.0.0.tgz#728baca4767c0e784e1e64bb44b5a5a753021a04"
+  integrity sha512-GFxmfEAa0vi9i5sd0R2kcrI9ks0r82NasRq5QHh2ysGngrc6GiqD5CDf1FjPenY4vApmFASBIIlk/jj5J5YbmQ==
+  dependencies:
+    "@types/unist" "^2.0.0"
+
+unist-util-generated@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.npmjs.org/unist-util-generated/-/unist-util-generated-2.0.0.tgz#86fafb77eb6ce9bfa6b663c3f5ad4f8e56a60113"
+  integrity sha512-TiWE6DVtVe7Ye2QxOVW9kqybs6cZexNwTwSMVgkfjEReqy/xwGpAXb99OxktoWwmL+Z+Epb0Dn8/GNDYP1wnUw==
+
+unist-util-is@^5.0.0:
+  version "5.1.1"
+  resolved "https://registry.npmjs.org/unist-util-is/-/unist-util-is-5.1.1.tgz#e8aece0b102fa9bc097b0fef8f870c496d4a6236"
+  integrity sha512-F5CZ68eYzuSvJjGhCLPL3cYx45IxkqXSetCcRgUXtbcm50X2L9oOWQlfUfDdAf+6Pd27YDblBfdtmsThXmwpbQ==
+
+unist-util-position@^4.0.0:
+  version "4.0.3"
+  resolved "https://registry.npmjs.org/unist-util-position/-/unist-util-position-4.0.3.tgz#5290547b014f6222dff95c48d5c3c13a88fadd07"
+  integrity sha512-p/5EMGIa1qwbXjA+QgcBXaPWjSnZfQ2Sc3yBEEfgPwsEmJd8Qh+DSk3LGnmOM4S1bY2C0AjmMnB8RuEYxpPwXQ==
+  dependencies:
+    "@types/unist" "^2.0.0"
+
+unist-util-stringify-position@^3.0.0:
+  version "3.0.2"
+  resolved "https://registry.npmjs.org/unist-util-stringify-position/-/unist-util-stringify-position-3.0.2.tgz#5c6aa07c90b1deffd9153be170dce628a869a447"
+  integrity sha512-7A6eiDCs9UtjcwZOcCpM4aPII3bAAGv13E96IkawkOAW0OhH+yRxtY0lzo8KiHpzEMfH7Q+FizUmwp8Iqy5EWg==
+  dependencies:
+    "@types/unist" "^2.0.0"
+
+unist-util-visit-parents@^4.0.0:
+  version "4.1.1"
+  resolved "https://registry.npmjs.org/unist-util-visit-parents/-/unist-util-visit-parents-4.1.1.tgz#e83559a4ad7e6048a46b1bdb22614f2f3f4724f2"
+  integrity sha512-1xAFJXAKpnnJl8G7K5KgU7FY55y3GcLIXqkzUj5QF/QVP7biUm0K0O2oqVkYsdjzJKifYeWn9+o6piAK2hGSHw==
+  dependencies:
+    "@types/unist" "^2.0.0"
+    unist-util-is "^5.0.0"
+
+unist-util-visit-parents@^5.0.0:
+  version "5.1.0"
+  resolved "https://registry.npmjs.org/unist-util-visit-parents/-/unist-util-visit-parents-5.1.0.tgz#44bbc5d25f2411e7dfc5cecff12de43296aa8521"
+  integrity sha512-y+QVLcY5eR/YVpqDsLf/xh9R3Q2Y4HxkZTp7ViLDU6WtJCEcPmRzW1gpdWDCDIqIlhuPDXOgttqPlykrHYDekg==
+  dependencies:
+    "@types/unist" "^2.0.0"
+    unist-util-is "^5.0.0"
+
+unist-util-visit@^3.0.0:
+  version "3.1.0"
+  resolved "https://registry.npmjs.org/unist-util-visit/-/unist-util-visit-3.1.0.tgz#9420d285e1aee938c7d9acbafc8e160186dbaf7b"
+  integrity sha512-Szoh+R/Ll68QWAyQyZZpQzZQm2UPbxibDvaY8Xc9SUtYgPsDzx5AWSk++UUt2hJuow8mvwR+rG+LQLw+KsuAKA==
+  dependencies:
+    "@types/unist" "^2.0.0"
+    unist-util-is "^5.0.0"
+    unist-util-visit-parents "^4.0.0"
+
+unist-util-visit@^4.0.0:
+  version "4.1.0"
+  resolved "https://registry.npmjs.org/unist-util-visit/-/unist-util-visit-4.1.0.tgz#f41e407a9e94da31594e6b1c9811c51ab0b3d8f5"
+  integrity sha512-n7lyhFKJfVZ9MnKtqbsqkQEk5P1KShj0+//V7mAcoI6bpbUjh3C/OG8HVD+pBihfh6Ovl01m8dkcv9HNqYajmQ==
+  dependencies:
+    "@types/unist" "^2.0.0"
+    unist-util-is "^5.0.0"
+    unist-util-visit-parents "^5.0.0"
+
 uri-js@^4.2.2:
  version "4.4.1"
  resolved "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz#9b1a52595225859e55f669d928f88c6c57f2a77e"
@ -1919,6 +2422,16 @@ uri-js@^4.2.2:
  dependencies:
    punycode "^2.1.0"

+uvu@^0.5.0:
+  version "0.5.3"
+  resolved "https://registry.npmjs.org/uvu/-/uvu-0.5.3.tgz#3d83c5bc1230f153451877bfc7f4aea2392219ae"
+  integrity sha512-brFwqA3FXzilmtnIyJ+CxdkInkY/i4ErvP7uV0DnUVxQcQ55reuHphorpF+tZoVHK2MniZ/VJzI7zJQoc9T9Yw==
+  dependencies:
+    dequal "^2.0.0"
+    diff "^5.0.0"
+    kleur "^4.0.3"
+    sade "^1.7.3"
+
 v8-compile-cache@^2.0.3:
  version "2.3.0"
  resolved "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz#2de19618c66dc247dcfb6f99338035d8245a2cee"
@ -1929,6 +2442,24 @@ vary@^1:
  resolved "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz#2299f02c6ded30d4a5961b0b9f74524a18f634fc"
  integrity sha1-IpnwLG3tMNSllhsLn3RSShj2NPw=

+vfile-message@^3.0.0:
+  version "3.1.2"
+  resolved "https://registry.npmjs.org/vfile-message/-/vfile-message-3.1.2.tgz#a2908f64d9e557315ec9d7ea3a910f658ac05f7d"
+  integrity sha512-QjSNP6Yxzyycd4SVOtmKKyTsSvClqBPJcd00Z0zuPj3hOIjg0rUPG6DbFGPvUKRgYyaIWLPKpuEclcuvb3H8qA==
+  dependencies:
+    "@types/unist" "^2.0.0"
+    unist-util-stringify-position "^3.0.0"
+
+vfile@^5.0.0:
+  version "5.3.2"
+  resolved "https://registry.npmjs.org/vfile/-/vfile-5.3.2.tgz#b499fbc50197ea50ad3749e9b60beb16ca5b7c54"
+  integrity sha512-w0PLIugRY3Crkgw89TeMvHCzqCs/zpreR31hl4D92y6SOE07+bfJe+dK5Q2akwS+i/c801kzjoOr9gMcTe6IAA==
+  dependencies:
+    "@types/unist" "^2.0.0"
+    is-buffer "^2.0.0"
+    unist-util-stringify-position "^3.0.0"
+    vfile-message "^3.0.0"
+
 void-elements@3.1.0:
  version "3.1.0"
  resolved "https://registry.npmjs.org/void-elements/-/void-elements-3.1.0.tgz#614f7fbf8d801f0bb5f0661f5b2f5785750e4f09"