clearFix.js.flow 627 B

1234567891011121314151617181920212223242526272829303132333435
  1. // @flow
  2. import type { Styles } from '../types/style'
  3. /**
  4. * CSS to contain a float (credit to CSSMojo).
  5. *
  6. * @example
  7. * // Styles as object usage
  8. * const styles = {
  9. * ...clearFix(),
  10. * }
  11. *
  12. * // styled-components usage
  13. * const div = styled.div`
  14. * ${clearFix()}
  15. * `
  16. *
  17. * // CSS as JS Output
  18. *
  19. * '&::after': {
  20. * 'clear': 'both',
  21. * 'content': '""',
  22. * 'display': 'table'
  23. * }
  24. */
  25. export default function clearFix(parent?: string = '&'): Styles {
  26. const pseudoSelector = `${parent}::after`
  27. return {
  28. [pseudoSelector]: {
  29. clear: 'both',
  30. content: '""',
  31. display: 'table',
  32. },
  33. }
  34. }