LBRYFoundation/lbry-desktop
1
0
Fork 0
mirror of https://github.com/LBRYFoundation/lbry-desktop.git synced 2025-09-03 02:35:12 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

referrer modal styling

Browse source
This commit is contained in:
Sean Yesmunt 2020-01-15 10:25:24 -05:00
parent fb7fa5a19e
commit 1c0a7ede0a
2 changed files with 36 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

56
ui/modal/modalSetReferrer/view.jsx
View file

@ -4,6 +4,7 @@ import { FormField, Form } from 'component/common/form';
import { Modal } from 'modal/modal'; import { Modal } from 'modal/modal';
import Button from 'component/button'; import Button from 'component/button';
import HelpLink from 'component/common/help-link'; import HelpLink from 'component/common/help-link';
import Card from 'component/common/card';
type Props = { type Props = {
closeModal: () => void, closeModal: () => void,
@ -40,29 +41,38 @@ class ModalSetReferrer extends React.PureComponent<Props, State> {
const { referrer } = this.state; const { referrer } = this.state;
return ( return (
<Modal isOpen title={__('Enter Invitee')} contentLabel={__('Enter Invitee')} type="custom" onAborted={closeModal}> <Modal isOpen contentLabel={__('Enter Invitee')} type="card" onAborted={closeModal}>
<Form onSubmit={this.handleSubmit}> <Card
<p> title={__('Enter Invitee')}
{__('Did someone invite you to use lbry.tv? Tell us who and you both get a reward!')} subtitle={
<HelpLink href="https://lbry.com/faq/referrals" />. <React.Fragment>
</p> {__('Did someone invite you to use lbry.tv? Tell us who and you both get a reward!')}
<FormField <HelpLink href="https://lbry.com/faq/referrals" />
autoFocus </React.Fragment>
type="text" }
name="referrer-code" actions={
inputButton={ <React.Fragment>
<Button button="primary" type="submit" disabled={!referrer || rewardIsPending} label={__('Set')} /> <Form onSubmit={this.handleSubmit}>
} <FormField
label={__('Code or channel')} autoFocus
placeholder="0123abc" type="text"
value={referrer} name="referrer-code"
onChange={e => this.setState({ referrer: e.target.value })} inputButton={
/> <Button button="primary" type="submit" disabled={!referrer || rewardIsPending} label={__('Set')} />
</Form> }
<div className="card__actions"> label={__('Code or channel')}
<Button button="primary" label={__('Done')} onClick={closeModal} /> placeholder="0123abc"
<Button button="link" label={__('Close')} onClick={closeModal} /> value={referrer}
</div> onChange={e => this.setState({ referrer: e.target.value })}
/>
</Form>
<div className="card__actions">
<Button button="primary" label={__('Done')} onClick={closeModal} />
<Button button="link" label={__('Close')} onClick={closeModal} />
</div>
</React.Fragment>
}
/>
</Modal> </Modal>
); );
} }

7
ui/scss/component/_icon.scss
View file

@ -18,11 +18,10 @@
} }
.icon--help { .icon--help {
margin-left: var(--spacing-small); color: var(--color-subtitle);
top: 0.2rem; margin-left: var(--spacing-xsmall);
opacity: 0.7; opacity: 0.7;
height: 1rem; top: 2px;
width: 1rem;
} }
.icon--hidden { .icon--hidden {