A design system in a box. hip-ui.tngl.io/docs/introduction
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

add maxWidth prop

+8 -3
+8 -3
packages/hip-ui/src/components/header-layout/index.tsx
··· 9 9 10 10 const styles = stylex.create({ 11 11 root: { 12 - "--page-content-max-width": "1280px", 13 12 backgroundColor: uiColor.bg, 14 13 containerType: "inline-size", 15 14 display: "flex", ··· 17 16 minHeight: "100vh", 18 17 width: "100cqw", 19 18 }, 19 + rootMaxWidth: (maxWidth: string | undefined) => ({ 20 + "--page-content-max-width": maxWidth || "1280px", 21 + }), 20 22 header: { 21 23 flexShrink: 0, 22 24 }, ··· 88 90 */ 89 91 export interface HeaderLayoutRootProps extends StyleXComponentProps< 90 92 React.ComponentProps<"div"> 91 - > {} 93 + > { 94 + maxWidth?: string; 95 + } 92 96 93 97 export const HeaderLayoutRoot = ({ 94 98 style, 99 + maxWidth, 95 100 ...props 96 101 }: HeaderLayoutRootProps) => { 97 102 return ( 98 103 <div 99 104 {...props} 100 - {...stylex.props(styles.root, style)} 105 + {...stylex.props(styles.root, styles.rootMaxWidth(maxWidth), style)} 101 106 data-header-layout={true} 102 107 /> 103 108 );