diff options
author | Fred Carlsen <fred@sjelfull.no> | 2018-11-30 19:05:40 +0800 |
---|---|---|
committer | Fred Carlsen <fred@sjelfull.no> | 2018-11-30 19:05:40 +0800 |
commit | 7161e8fed9f64edaa3162642db89f4464b49e876 (patch) | |
tree | ea3069eff47b2b9c793f022efd243f6fe3c125c0 | |
parent | 1105d768612474611a40e090e1e2bddcb30952ab (diff) | |
download | dexon-0x-contracts-7161e8fed9f64edaa3162642db89f4464b49e876.tar dexon-0x-contracts-7161e8fed9f64edaa3162642db89f4464b49e876.tar.gz dexon-0x-contracts-7161e8fed9f64edaa3162642db89f4464b49e876.tar.bz2 dexon-0x-contracts-7161e8fed9f64edaa3162642db89f4464b49e876.tar.lz dexon-0x-contracts-7161e8fed9f64edaa3162642db89f4464b49e876.tar.xz dexon-0x-contracts-7161e8fed9f64edaa3162642db89f4464b49e876.tar.zst dexon-0x-contracts-7161e8fed9f64edaa3162642db89f4464b49e876.zip |
Tweak submit position
-rw-r--r-- | packages/website/ts/@next/components/newsletterForm.tsx | 16 |
1 files changed, 10 insertions, 6 deletions
diff --git a/packages/website/ts/@next/components/newsletterForm.tsx b/packages/website/ts/@next/components/newsletterForm.tsx index 6a82acbff..422d25bec 100644 --- a/packages/website/ts/@next/components/newsletterForm.tsx +++ b/packages/website/ts/@next/components/newsletterForm.tsx @@ -3,10 +3,9 @@ import styled from 'styled-components'; import { colors } from 'ts/style/colors'; -import formArrow from 'ts/@next/icons/form-arrow.svg'; - import {Button} from 'ts/@next/components/button'; -import {Icon} from 'ts/@next/components/icon'; + +import ArrowIcon from 'ts/@next/icons/form-arrow.svg'; interface InputProps { name: string; @@ -25,14 +24,16 @@ const Input = ({ ...props }) => { <label className="visuallyHidden" htmlFor={id}>{label}</label> <StyledInput id={id} placeholder={label} {...props} /> </> - ) + ); }; export const NewsletterForm: React.StatelessComponent = (props: Props) => ( <StyledForm> <InputWrapper> <Input name="email" type="email" label="Email Address" /> - <Icon icon={formArrow} /> + <SubmitButton hasIcon> + Submit + </SubmitButton> </InputWrapper> <Text>Subscribe to our newsletter for updates in the 0x ecosystem</Text> </StyledForm> @@ -62,10 +63,13 @@ const InputWrapper = styled.div` position: relative; `; -const ButtonWrapper = styled(Button)` +const SubmitButton = styled(Button)` display: flex; justify-content: center; align-items: center; + position: absolute; + right: 0; + top: calc(50% - 29px); `; const Text = styled.span` |