split out and clean up prose class
This commit is contained in:
@@ -6,7 +6,7 @@ import { SideNav } from "~/components/side-nav"
|
|||||||
import { SidebarLayout } from "~/components/sidebar-layout"
|
import { SidebarLayout } from "~/components/sidebar-layout"
|
||||||
import type { ContentIndexEntry } from "~/helpers/create-index.server"
|
import type { ContentIndexEntry } from "~/helpers/create-index.server"
|
||||||
import { createContentIndex } from "~/helpers/create-index.server"
|
import { createContentIndex } from "~/helpers/create-index.server"
|
||||||
import { linkClass } from "~/styles"
|
import { docsProseClass, linkClass } from "~/styles"
|
||||||
|
|
||||||
type LoaderData = ContentIndexEntry[]
|
type LoaderData = ContentIndexEntry[]
|
||||||
|
|
||||||
@@ -32,7 +32,7 @@ export default function Docs() {
|
|||||||
</SideNav>
|
</SideNav>
|
||||||
}
|
}
|
||||||
body={
|
body={
|
||||||
<section className="prose max-w-none prose-invert prose-h1:font-light flex-1 prose-h1:mb-4 prose-p:my-4 prose-pre:text-[15px] prose-pre:font-monospace prose-h2:font-light h-[200vh]">
|
<section className={docsProseClass}>
|
||||||
<Outlet />
|
<Outlet />
|
||||||
</section>
|
</section>
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -6,3 +6,13 @@ export const linkClass = clsx`
|
|||||||
after:absolute after:block after:w-full after:h-px after:bg-white/50 after:translate-y-[3px] after:opacity-0 after:transition
|
after:absolute after:block after:w-full after:h-px after:bg-white/50 after:translate-y-[3px] after:opacity-0 after:transition
|
||||||
hover:after:translate-y-[-1px] hover:after:opacity-100
|
hover:after:translate-y-[-1px] hover:after:opacity-100
|
||||||
`
|
`
|
||||||
|
|
||||||
|
export const docsProseClass = clsx`
|
||||||
|
prose prose-invert
|
||||||
|
prose-h1:font-light prose-h1:mb-4
|
||||||
|
prose-h2:font-light
|
||||||
|
prose-h3:font-light
|
||||||
|
prose-p:my-4
|
||||||
|
prose-pre:text-[15px] prose-pre:font-monospace
|
||||||
|
max-w-none
|
||||||
|
`
|
||||||
|
|||||||
Reference in New Issue
Block a user