82ca9a27db
Some checks are pending
E2E / Playwright e2e (push) Waiting to run
- Replaced suite page metadata with drive-specific metadata for document and drawing editors. - Introduced new `driveEditorPageMetadata` function to manage titles and favicons based on editor type. - Updated layout components for document and drawing editors to utilize the new metadata structure. - Enhanced document title handling in various editor components to reflect the current editing context. - Added new SVG icons for UltiDocs, UltiSheets, UltiSlides, and UltiDraw to improve visual consistency across editors. - Improved print styles and layout handling for better document rendering in print and PDF formats.
66 lines
2.1 KiB
TypeScript
66 lines
2.1 KiB
TypeScript
"use client"
|
|
|
|
import { DOCS_PAGE_GAP_PX } from "@/lib/drive/docs-page-layout-constants"
|
|
import type { DocPageLayout } from "@/lib/drive/doc-page-setup"
|
|
import {
|
|
pageFooterGeometry,
|
|
pageHeaderGeometry,
|
|
} from "@/lib/drive/docs-header-footer-layout"
|
|
|
|
/** Hides body text that bleeds into header/footer margin bands on each page. */
|
|
export function DocsBodyMarginMasks({
|
|
pageCount,
|
|
pageLayout,
|
|
pageWidth,
|
|
pageHeight,
|
|
pageColor,
|
|
pageRegionHeights,
|
|
}: {
|
|
pageCount: number
|
|
pageLayout: DocPageLayout
|
|
pageWidth: number
|
|
pageHeight: number
|
|
pageColor: string
|
|
pageRegionHeights?: Record<string, number>
|
|
}) {
|
|
return (
|
|
<>
|
|
{Array.from({ length: pageCount }, (_, index) => {
|
|
const pageTop = index * (pageHeight + DOCS_PAGE_GAP_PX)
|
|
const header = pageHeaderGeometry(pageLayout, pageTop, index)
|
|
const footer = pageFooterGeometry(pageLayout, pageTop, pageHeight, index)
|
|
const headerHeight =
|
|
pageRegionHeights?.[`header-${index}`] ?? header.zoneHeight
|
|
const footerHeight =
|
|
pageRegionHeights?.[`footer-${index}`] ?? footer.zoneHeight
|
|
const headerBottom = header.zoneTop + headerHeight
|
|
const footerTop = footer.zoneBottom - footerHeight
|
|
return (
|
|
<div key={`body-mask-${index}`} aria-hidden>
|
|
<div
|
|
className="docs-body-margin-mask pointer-events-none absolute z-[15] box-border border-l border-r border-[#dadce0]"
|
|
style={{
|
|
top: pageTop,
|
|
left: 0,
|
|
width: pageWidth,
|
|
height: headerBottom,
|
|
backgroundColor: pageColor,
|
|
}}
|
|
/>
|
|
<div
|
|
className="docs-body-margin-mask pointer-events-none absolute z-[15] box-border border-l border-r border-[#dadce0]"
|
|
style={{
|
|
top: footerTop,
|
|
left: 0,
|
|
width: pageWidth,
|
|
height: pageTop + pageHeight - footerTop,
|
|
backgroundColor: pageColor,
|
|
}}
|
|
/>
|
|
</div>
|
|
)
|
|
})}
|
|
</>
|
|
)
|
|
}
|