search

ConsenSysMesh / rimble-ui

React components that implement Rimble's Design System.
https://rimble.consensys.design/
MIT License
462 stars 67 forks source link

Added default font-size to Heading by as prop #387

Closed MikeLockz closed 4 years ago

MikeLockz commented 4 years ago

Fixes https://github.com/ConsenSys/rimble-storefront/issues/61

netlify[bot] commented 4 years ago

Deploy preview for rimble-ui-storybook ready!

Built with commit e0d8040d7b24cdba1955feaab0fc2f3740b69073

https://deploy-preview-387--rimble-ui-storybook.netlify.com

netlify[bot] commented 4 years ago

Deploy preview for rimble-ui-storybook ready!

Built with commit a07614fc3b29ea5a06022c3129596f901fccf3ef

https://deploy-preview-387--rimble-ui-storybook.netlify.com

gesquinca commented 4 years ago

@ryancreatescopy @MikeLockz this solution makes it so you can't change the font size for h1-h6 elements via the fontSize prop anymore because the following values are overriding the fontSize prop values. 

  font-size: ${props => {
    switch (props.as) {
      case 'h1':
        return props.theme.fontSizes[6];
      case 'h2':
        return props.theme.fontSizes[5];
      case 'h3':
        return props.theme.fontSizes[4];
      case 'h4':
        return props.theme.fontSizes[3];
      case 'h5':
        return props.theme.fontSizes[2];
      case 'h6':
        return props.theme.fontSizes[1];
      default:
        return props.theme.fontSizes[4];
    }
  }}px

I'm going to revert this change and work on a more appropriate solution.

Related to #389