feat(layout): make header outside of center

* make header above all content
* make beforeBody --> pageHeader
This commit is contained in:
vanadium23 2024-12-01 22:36:51 +03:00
parent fafdb2719a
commit cfcce875a9
7 changed files with 10 additions and 21 deletions

View File

@ -16,8 +16,7 @@ export const sharedPageComponents: SharedLayout = {
// components for pages that display a single page (e.g. a single note) // components for pages that display a single page (e.g. a single note)
export const defaultContentPageLayout: PageLayout = { export const defaultContentPageLayout: PageLayout = {
pageHeader: [], pageHeader: [
beforeBody: [
Component.Breadcrumbs(), Component.Breadcrumbs(),
Component.ArticleTitle(), Component.ArticleTitle(),
Component.ContentMeta(), Component.ContentMeta(),
@ -39,8 +38,7 @@ export const defaultContentPageLayout: PageLayout = {
// components for pages that display lists of pages (e.g. tags or folders) // components for pages that display lists of pages (e.g. tags or folders)
export const defaultListPageLayout: PageLayout = { export const defaultListPageLayout: PageLayout = {
pageHeader: [], pageHeader: [Component.Breadcrumbs(), Component.ArticleTitle(), Component.ContentMeta()],
beforeBody: [Component.Breadcrumbs(), Component.ArticleTitle(), Component.ContentMeta()],
left: [ left: [
Component.PageTitle(), Component.PageTitle(),
Component.MobileOnly(Component.Spacer()), Component.MobileOnly(Component.Spacer()),

View File

@ -86,7 +86,6 @@ export interface FullPageLayout {
head: QuartzComponent head: QuartzComponent
header: QuartzComponent[] header: QuartzComponent[]
pageHeader: QuartzComponent[] pageHeader: QuartzComponent[]
beforeBody: QuartzComponent[]
pageBody: QuartzComponent pageBody: QuartzComponent
afterBody: QuartzComponent[] afterBody: QuartzComponent[]
left: QuartzComponent[] left: QuartzComponent[]
@ -94,5 +93,5 @@ export interface FullPageLayout {
footer: QuartzComponent footer: QuartzComponent
} }
export type PageLayout = Pick<FullPageLayout, "pageHeader" | "beforeBody" | "left" | "right"> export type PageLayout = Pick<FullPageLayout, "pageHeader" | "left" | "right">
export type SharedLayout = Pick<FullPageLayout, "head" | "header" | "footer" | "afterBody"> export type SharedLayout = Pick<FullPageLayout, "head" | "header" | "footer" | "afterBody">

View File

@ -13,7 +13,6 @@ interface RenderComponents {
head: QuartzComponent head: QuartzComponent
header: QuartzComponent[] header: QuartzComponent[]
pageHeader: QuartzComponent[] pageHeader: QuartzComponent[]
beforeBody: QuartzComponent[]
pageBody: QuartzComponent pageBody: QuartzComponent
afterBody: QuartzComponent[] afterBody: QuartzComponent[]
left: QuartzComponent[] left: QuartzComponent[]
@ -193,7 +192,6 @@ export function renderPage(
head: Head, head: Head,
header, header,
pageHeader, pageHeader,
beforeBody,
pageBody: Content, pageBody: Content,
afterBody, afterBody,
left, left,
@ -234,13 +232,8 @@ export function renderPage(
{LeftComponent} {LeftComponent}
<section class="center"> <section class="center">
<div class="page-header"> <div class="page-header">
<Header {...componentData}>
{pageHeader.map((HeaderComponent) => (
<HeaderComponent {...componentData} />
))}
</Header>
<div class="popover-hint"> <div class="popover-hint">
{beforeBody.map((BodyComponent) => ( {pageHeader.map((BodyComponent) => (
<BodyComponent {...componentData} /> <BodyComponent {...componentData} />
))} ))}
</div> </div>

View File

@ -16,7 +16,6 @@ export const NotFoundPage: QuartzEmitterPlugin = () => {
...sharedPageComponents, ...sharedPageComponents,
pageBody: NotFound(), pageBody: NotFound(),
pageHeader: [], pageHeader: [],
beforeBody: [],
left: [], left: [],
right: [], right: [],
} }

View File

@ -59,7 +59,7 @@ export const ContentPage: QuartzEmitterPlugin<Partial<FullPageLayout>> = (userOp
...userOpts, ...userOpts,
} }
const { head: Head, header, beforeBody, pageBody, afterBody, left, right, footer: Footer } = opts const { head: Head, header, pageHeader, pageBody, afterBody, left, right, footer: Footer } = opts
const Header = HeaderConstructor() const Header = HeaderConstructor()
const Body = BodyConstructor() const Body = BodyConstructor()
@ -71,7 +71,7 @@ export const ContentPage: QuartzEmitterPlugin<Partial<FullPageLayout>> = (userOp
Header, Header,
Body, Body,
...header, ...header,
...beforeBody, ...pageHeader,
pageBody, pageBody,
...afterBody, ...afterBody,
...left, ...left,

View File

@ -33,7 +33,7 @@ export const FolderPage: QuartzEmitterPlugin<Partial<FolderPageOptions>> = (user
...userOpts, ...userOpts,
} }
const { head: Head, header, beforeBody, pageBody, afterBody, left, right, footer: Footer } = opts const { head: Head, header, pageHeader, pageBody, afterBody, left, right, footer: Footer } = opts
const Header = HeaderConstructor() const Header = HeaderConstructor()
const Body = BodyConstructor() const Body = BodyConstructor()
@ -45,7 +45,7 @@ export const FolderPage: QuartzEmitterPlugin<Partial<FolderPageOptions>> = (user
Header, Header,
Body, Body,
...header, ...header,
...beforeBody, ...pageHeader,
pageBody, pageBody,
...afterBody, ...afterBody,
...left, ...left,

View File

@ -30,7 +30,7 @@ export const TagPage: QuartzEmitterPlugin<Partial<TagPageOptions>> = (userOpts)
...userOpts, ...userOpts,
} }
const { head: Head, header, beforeBody, pageBody, afterBody, left, right, footer: Footer } = opts const { head: Head, header, pageHeader, pageBody, afterBody, left, right, footer: Footer } = opts
const Header = HeaderConstructor() const Header = HeaderConstructor()
const Body = BodyConstructor() const Body = BodyConstructor()
@ -42,7 +42,7 @@ export const TagPage: QuartzEmitterPlugin<Partial<TagPageOptions>> = (userOpts)
Header, Header,
Body, Body,
...header, ...header,
...beforeBody, ...pageHeader,
pageBody, pageBody,
...afterBody, ...afterBody,
...left, ...left,