Skip to content

refactor: use styled-components in comment-list-item#557

Closed
MrLoh wants to merge 2 commits intogitpoint:masterfrom
MrLoh:styled-components-comment-list-item-component
Closed

refactor: use styled-components in comment-list-item#557
MrLoh wants to merge 2 commits intogitpoint:masterfrom
MrLoh:styled-components-comment-list-item-component

Conversation

@MrLoh
Copy link
Copy Markdown
Contributor

@MrLoh MrLoh commented Oct 22, 2017

related to #532

@andrewda andrewda changed the title Refactor comment-list-item to use styled-components refactor: use styled-components in comment-list-item Oct 22, 2017
@MrLoh
Copy link
Copy Markdown
Contributor Author

MrLoh commented Oct 22, 2017

the CONTRIBUORS.md file is somehow broken, so I couldn't add myself. I think the last contributor might have tried to add himself manually.

@andrewda
Copy link
Copy Markdown
Member

@MrLoh I'll try to fix that.

@andrewda
Copy link
Copy Markdown
Member

@MrLoh try adding yourself now

@MrLoh
Copy link
Copy Markdown
Contributor Author

MrLoh commented Oct 22, 2017

cool, thant worked. I rebased of master and added myself. Should be ready to merge

Copy link
Copy Markdown
Member

@andrewda andrewda left a comment

Choose a reason for hiding this comment

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

Little conflict then LGTM 👍

"name": "Tobias Lohse",
"avatar_url": "https://avatars0.githubusercontent.com/u/1285032?v=4",
"profile": "http://MrLoh.se",
"contributions": []
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

🎉 You contributed codes in fact.


const Header = styled.View`
flex-direction: row;
margin-left: 10px;
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Nice catch for those shorthands properties. But shall we always add units for properties? (cc @alejandronanez)

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

I don’t know. It’s up to you. I never use units for 0 in css.

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

I think we should stick to unitless, that's what we've been doing in other PRs

`;

const LinkDescription = styled.Text`
${{ ...fonts.fontPrimaryBold }};
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Can we just write as ${fonts.fontPrimaryBold}?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

I don’t kno. I’m not sure how this actually works. Just copied it from the other already concerted components. I handle fonts differently in my apps.

Copy link
Copy Markdown
Member

@machour machour Nov 4, 2017

Choose a reason for hiding this comment

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

This should be:

font-family: ${styledFonts.fontPrimaryBold}

EDIT: Actually, let's keep it like you did, I think it would be better to get rid of styledFonts. I'll open a PR for this.

`;

const CommentTextNone = styled.Text`
${{ ...fonts.fontPrimary }};
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Same here.

Copy link
Copy Markdown
Member

@alejandronanez alejandronanez left a comment

Choose a reason for hiding this comment

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

Can you please remove the units (px). I recall not using units in other PRs related to styled-components.


const Header = styled.View`
flex-direction: row;
margin-left: 10px;
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

I think we should stick to unitless, that's what we've been doing in other PRs

@MrLoh
Copy link
Copy Markdown
Contributor Author

MrLoh commented Oct 29, 2017

@alejandronanez I don't think it's a good idea to go unitless, as it is against the styled-component docs and will break percentage units.

I'm also a bit confused as to who is in charge of reviewing and merging pull requests as two other of my pull-requests with the same style issues where accepted and merged allready. #559 #558

@chinesedfan
Copy link
Copy Markdown
Member

@MrLoh Yes, styled-component requires units in sometimes, but it is only for shorthands properties. And sorry about previous PR reviews are inconsistent.

`;

const LinkDescription = styled.Text`
${{ ...fonts.fontPrimaryBold }};
Copy link
Copy Markdown
Member

@machour machour Nov 4, 2017

Choose a reason for hiding this comment

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

This should be:

font-family: ${styledFonts.fontPrimaryBold}

EDIT: Actually, let's keep it like you did, I think it would be better to get rid of styledFonts. I'll open a PR for this.

@machour
Copy link
Copy Markdown
Member

machour commented Jan 15, 2018

hey @MrLoh, I've got a PR pending to switch all styled-components to use the ${fonts.fontPrimaryBold }; notation (#693).
Could you go ahead and switch to this syntax?

also, as @chinesedfan & @alejandronanez explained, we went unit-less for styled-components, it would be great if you could update your PR accordingly.

let us know if you need any help, let's get this PR merged 🎉 🎉

@chinesedfan
Copy link
Copy Markdown
Member

Launched by #723.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants