import React, { FC, PropsWithChildren } from 'react'

import { theming } from '../../themes'
import { useStyles } from './styles'

export const ColoredPage: FC<PropsWithChildren> = ({ children }) => {
  const { coloredPageWrapper, childrenWrapper } = useStyles({ theme: theming.useTheme() })

  return (
    <div className={coloredPageWrapper}>
      <div className={childrenWrapper}>{children}</div>
    </div>
  )
}
