mirror of
https://github.com/AmruthPillai/Reactive-Resume.git
synced 2026-07-26 09:54:43 +10:00
brone1323
d251d602fb
All Heading elements apply overflow:hidden via safeTextStyle in primitives.tsx. At 1.5× heading font size with lineHeight 1.2, the line box is too tight to fully render descenders (g, p, y, etc.) in the resume header name field, causing them to appear visually cut off. Raising headerNameLineHeight from 1.2 to 1.3 adds enough vertical room for descenders across all 13 templates that share this constant. Fixes #3042
45 lines
1.5 KiB
TypeScript
45 lines
1.5 KiB
TypeScript
import type { Style } from "@react-pdf/types";
|
||
|
||
export type TemplatePlacement = "main" | "sidebar";
|
||
|
||
export type StyleInput = Style | Style[] | null | undefined;
|
||
|
||
export const composeStyles = (...styles: StyleInput[]): Style[] => {
|
||
return styles.flatMap((style) => {
|
||
if (!style) return [];
|
||
if (Array.isArray(style)) return style.filter(Boolean);
|
||
|
||
return [style];
|
||
});
|
||
};
|
||
|
||
const linkUnderlineStyle = { textDecoration: "underline" } satisfies Style;
|
||
|
||
export const composeLinkStyles = (...styles: StyleInput[]): Style[] => composeStyles(...styles, linkUnderlineStyle);
|
||
|
||
export const mergeStyles = (...styles: StyleInput[]): Style => Object.assign({}, ...composeStyles(...styles));
|
||
|
||
export const mergeLinkStyles = (...styles: StyleInput[]): Style => mergeStyles(...styles, linkUnderlineStyle);
|
||
|
||
// Increased from 1.2 to 1.3 to prevent descenders (g, p, y, etc.) from being
|
||
// clipped by the overflow:hidden applied in safeTextStyle on all Heading elements.
|
||
// At 1.5× heading font size, a lineHeight of 1.2 leaves insufficient room for
|
||
// the descender depth of many fonts, causing letters to appear visually cut off.
|
||
export const headerNameLineHeight = 1.3;
|
||
|
||
export type ResolvePlacementColorOptions = {
|
||
placement: TemplatePlacement;
|
||
defaultForeground: string;
|
||
sidebarForeground?: string | undefined;
|
||
};
|
||
|
||
export const resolvePlacementColor = ({
|
||
placement,
|
||
defaultForeground,
|
||
sidebarForeground,
|
||
}: ResolvePlacementColorOptions) => {
|
||
if (placement === "sidebar" && sidebarForeground) return sidebarForeground;
|
||
|
||
return defaultForeground;
|
||
};
|