diff --git a/src/components/ReceiveBox.js b/src/components/ReceiveBox.js index f8302020..c191b4af 100644 --- a/src/components/ReceiveBox.js +++ b/src/components/ReceiveBox.js @@ -21,7 +21,7 @@ export const AddressBox = styled(Box).attrs({ bg: 'lightGrey', p: 2, })` - border-radius: 3px; + border-radius: ${p => p.theme.radii[1]}px; border: 1px solid ${p => p.theme.colors.fog}; cursor: text; text-align: center; diff --git a/src/components/RequestAmount/index.js b/src/components/RequestAmount/index.js index 889b3ed4..6177c1bc 100644 --- a/src/components/RequestAmount/index.js +++ b/src/components/RequestAmount/index.js @@ -30,8 +30,11 @@ const InputCenter = styled(Box).attrs({ ff: 'Rubik', color: 'graphite', fontSize: 4, + alignItems: 'center', justifyContent: 'center', -})`` +})` + width: 30px; +` const mapStateToProps = (state, { account }) => { const counterValue = getCounterValue(state) @@ -258,23 +261,37 @@ export class RequestAmount extends PureComponent { }) return ( - - {unit.left.code}} - /> - = - {unit.right.code}} - /> - + + + {unit.left.code}} + /> + = + {unit.right.code}} + /> + + + + ) } diff --git a/src/components/base/Button/index.js b/src/components/base/Button/index.js index 3c224787..ab57d741 100644 --- a/src/components/base/Button/index.js +++ b/src/components/base/Button/index.js @@ -19,7 +19,7 @@ const Base = styled.button.attrs({ ${fontSize}; ${fontWeight}; ${fontFamily}; - border-radius: 4px; + border-radius: ${p => p.theme.radii[1]}px; border: ${p => p.primary ? 'none' : `2px solid ${p.disabled ? 'transparent' : p.theme.colors.grey}`}; cursor: ${p => (p.disabled ? 'default' : 'pointer')}; diff --git a/src/components/base/Input/index.js b/src/components/base/Input/index.js index d686f75d..babcba39 100644 --- a/src/components/base/Input/index.js +++ b/src/components/base/Input/index.js @@ -14,7 +14,7 @@ const Container = styled(Box).attrs({ horizontal: true, })` background: ${p => p.theme.colors.white}; - border-radius: 3px; + border-radius: ${p => p.theme.radii[1]}px; border: 1px solid ${p => p.theme.colors.fog}; box-shadow: ${p => (p.isFocus ? `rgba(0, 0, 0, 0.05) 0 2px 2px` : 'none')}; height: 40px; @@ -49,7 +49,7 @@ export const Textarea = styled.textarea.attrs({ min-height: 80px; color: ${p => p.theme.colors.dark}; background: ${p => p.theme.colors.white}; - border-radius: 3px; + border-radius: ${p => p.theme.radii[1]}px; border: 1px solid ${p => p.theme.colors.fog}; box-shadow: none; &:focus { diff --git a/src/components/base/InputCurrency/index.js b/src/components/base/InputCurrency/index.js index 69354e6c..9340982d 100644 --- a/src/components/base/InputCurrency/index.js +++ b/src/components/base/InputCurrency/index.js @@ -43,6 +43,13 @@ const Currencies = styled(Box)` right: -1px; ` +const Currency = styled(Box).attrs({ + color: 'grey', + fontSize: 2, + pl: 2, + pr: 1, +})`` + type Value = string | number type Props = { @@ -133,8 +140,6 @@ class InputCurrency extends PureComponent { return null } - const renderItem = item => item.code - return ( e.stopPropagation()}> - + ) : ( @@ -257,7 +280,7 @@ class Select extends PureComponent { )} - + )} diff --git a/src/components/modals/Send/01-step-amount.js b/src/components/modals/Send/01-step-amount.js index 7e157eac..69f49591 100644 --- a/src/components/modals/Send/01-step-amount.js +++ b/src/components/modals/Send/01-step-amount.js @@ -126,7 +126,7 @@ function Fees(props: PropsFees) { return (