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

feat: add prop size to the RadioButtonGroup component #1541

Conversation

rgah2107
Copy link
Collaborator

fix: #1537

Changes proposed in this PR:

@nexxtway/react-rainbow

@commit-lint
Copy link

commit-lint bot commented May 13, 2020

Features

  • add prop size to the RadioButtonGroup component (ee8acb1)

Bug Fixes

Contributors

@rgah2107, @TahimiLeonBravo

Comment on lines -18 to +42
font-size: ${FONT_SIZE_TEXT_LARGE};
font-size: ${props => fontSizeMap[props.size] || fontSizeMap.medium};
color: ${props => props.inverseLabel};
padding: 0 ${PADDING_LARGE};
padding: 0 ${props => paddingMap[props.size] || paddingMap.medium};
Copy link
Contributor

Choose a reason for hiding this comment

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

@TahimiLeonBravo checks here that the size is being changed.

Copy link
Collaborator

Choose a reason for hiding this comment

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

@yvmunayev @rgah2107 I agree with this size changes +1

Comment on lines 6 to 14
const sizeMap = { large: '3.1rem', medium: '2.6rem', small: '1.76rem', 'x-small': '1.26rem' };
const StyledMarker = attachThemeAttrs(styled.span)`
position: absolute;
background: ${props => props.palette.background.main};
opacity: 0;
top: 0;
bottom: 0;
margin: auto;
height: 2.6rem;
height: ${props => sizeMap[props.size] || sizeMap.medium};
Copy link
Contributor

Choose a reason for hiding this comment

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

@TahimiLeonBravo will be able to change to 2.5rem here?

Copy link
Collaborator

Choose a reason for hiding this comment

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

@rgah2107 @yvmunayev 2.6rem is right because we need to make the marker a little higher than the container.
Also, we need to change by small='1.8rem' and 'x-small': '1.3rem' because right now this is not centered vertically
Screen Shot 2020-05-14 at 3 41 41 PM
Screen Shot 2020-05-14 at 3 41 59 PM

@rgah2107 rgah2107 requested a review from yvmunayev May 15, 2020 18:43
};
const paddingMap = {
large: PADDING_LARGE,
medium: PADDING_MEDIUM,
Copy link
Collaborator

Choose a reason for hiding this comment

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

let's use for
medium: PADDING_LARGE
large: PADDING_X_LARGE

@TahimiLeonBravo TahimiLeonBravo merged commit e1606ba into nexxtway:master May 17, 2020
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.

feat: add prop size to the RadioButtonGroup component
4 participants