Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Refactor PM-407: Outcome components #245

Merged
merged 12 commits into from
Feb 23, 2018

Conversation

mmv08
Copy link
Contributor

@mmv08 mmv08 commented Feb 20, 2018

This PR:

  • Moves all outcome components to components/Outcome
  • Adds TrendingOutcomeScalar and TrendingOutcomeCategorical
  • Uses CSS modules in all outcome components now
  • Adds defaultProps
  • Prepares webpack.config.dev.js for CSS modules

}) => (
<div className="outcomes outcomes--categorical">
<div className={cx('outcomeWrapper')}>
<div className="entry__color" style={entryStyle} />
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why not use cx('entry') here?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@andre-meyer Will fix that, this is related to the question I asked you today about adding class names for elements with no style imported from .scss

const TrendingOutcomeCategorical = ({
entryStyle, outcome, percentage, resolutionDate,
}) => (
<div className="outcomes outcomes--categorical">
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

cx('outcomes', 'categorical')

if we're going for css-modules, we need to use the bound styles everywhere

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👌

@@ -60,6 +60,8 @@ module.exports = {
loader: 'css-loader',
options: {
sourceMap: true,
importLoaders: 2,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What does this do?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@@ -60,6 +60,8 @@ module.exports = {
loader: 'css-loader',
options: {
sourceMap: true,
importLoaders: 2,
localIdentName: '[name]--[local]--[hash:base64:8]',
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Doesn't this break all previously declared global css?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@andre-meyer Right now it doesn't, it will break after we set modules: true, this is just some kind of preparation for names 😃

@andre-meyer andre-meyer merged commit 3e0402d into development Feb 23, 2018
@andre-meyer andre-meyer deleted the refactor/pm-407/outcome-components branch February 23, 2018 12:56
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants