well.tsx 582 B

1234567891011121314151617181920212223
  1. import React from 'react';
  2. import styled from '@emotion/styled';
  3. type Props = {
  4. hasImage?: boolean;
  5. centered?: boolean;
  6. children: React.ReactNode;
  7. theme?: any;
  8. };
  9. type WellProps = Omit<React.HTMLProps<HTMLDivElement>, keyof Props> & Props;
  10. const Well = styled('div')<WellProps>`
  11. border: 1px solid ${p => p.theme.border};
  12. box-shadow: none;
  13. background: ${p => p.theme.backgroundSecondary};
  14. padding: ${p => (p.hasImage ? '80px 30px' : '15px 20px')};
  15. margin-bottom: 20px;
  16. border-radius: 3px;
  17. ${p => p.centered && 'text-align: center'};
  18. `;
  19. export default Well;