frontend/src/components/modals/username.js


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

import React from 'react';
import { Button, Close, Input, Overlay, Panel, PanelFooter, PanelHeader, Space } from 'rebass';

export const Modal = ({ modalOpen, toggleModal }) => (
  <Overlay open={modalOpen} onDismiss={toggleModal('usernameModal')}>
    <Panel theme="info">
      <PanelHeader>
        What's your username ?
        <Space auto />
        <Close onClick={toggleModal('usernameModal')} />
      </PanelHeader>
      <Input label="Username" name="username" placeholder="Cesar92" rounded type="text" />
      <PanelFooter>
        <Space auto />
        <Button theme="success" onClick={toggleModal('usernameModal')} children="Ok" />
      </PanelFooter>
    </Panel>
  </Overlay>
);