theme generator - live preview

Author: PatrikMatiasko

src/components/Atomic/PageLayout/PageLayout.styles.ts

@@ -27,6 +27,9 @@ export const header = css`
 export const padding = css`
     padding-left: 40px;
     padding-right: 40px;
+`
+
+export const contentPadding = css`
     height: 100%;
 `
 

src/components/Atomic/PageLayout/PageLayout.tsx

@@ -25,7 +25,7 @@ const PageLayout: FC<Props> = memo((props) => {
                     </div>
                     <div css={styles.rightActions}>{header}</div>
                 </div>
-                <ConditionalWrapper condition={xPadding === true} wrapper={(c) => <div css={styles.padding}>{c}</div>}>
+                <ConditionalWrapper condition={xPadding === true} wrapper={(c) => <div css={[styles.padding, styles.contentPadding]}>{c}</div>}>
                     {children}
                 </ConditionalWrapper>
             </div>