From 0cc21f83d931c78b0e14b5aac636c98df0af8294 Mon Sep 17 00:00:00 2001 From: Alex Windett Date: Tue, 10 Jan 2017 17:00:23 +0000 Subject: [PATCH] creating close icon component --- ui/src/components/close/index.js | 29 ++++++------- ui/src/components/close/readme.md | 65 ------------------------------ ui/src/index.js | 1 + ui/src/shared/assets/close.png | Bin 0 -> 345 bytes ui/stories/index.js | 6 +++ 5 files changed, 20 insertions(+), 81 deletions(-) delete mode 100644 ui/src/components/close/readme.md create mode 100644 ui/src/shared/assets/close.png diff --git a/ui/src/components/close/index.js b/ui/src/components/close/index.js index 2f1c6aec..2380337d 100644 --- a/ui/src/components/close/index.js +++ b/ui/src/components/close/index.js @@ -1,39 +1,36 @@ -const constants = require('../../shared/constants'); -const fns = require('../../shared/functions'); -const composers = require('../../shared/composers'); const React = require('react'); const Styled = require('styled-components'); -const closeIcon = require('../../shared/assets/close'); - -const { - colors -} = constants; - -const { - remcalc -} = fns; +const closeIcon = require('../../shared/assets/close.png'); const { default: styled } = Styled; +const StyledButton = styled.button` + background: none; + border: none; +`; + const Close = ({ style, onClick }) => { return ( - Close + Close ); }; Close.propTypes = { - style: React.PropTypes.object, - onClick: React.PropTypes.func + onClick: React.PropTypes.func, + style: React.PropTypes.object }; module.exports = Close; diff --git a/ui/src/components/close/readme.md b/ui/src/components/close/readme.md deleted file mode 100644 index a114f555..00000000 --- a/ui/src/components/close/readme.md +++ /dev/null @@ -1,65 +0,0 @@ -# `` - -## demo - -```embed -const React = require('react'); -const ReactDOM = require('react-dom/server'); -const Base = require('../base'); -const Container = require('../container'); -const Row = require('../row'); -const Column = require('../column'); -const Notificaton = require('./index.js'); -const styles = require('./style.css'); - -const style = { - marginBottom: 0 -} - -nmodule.exports = ReactDOM.renderToString( - - - - -

This is the warning content

-
-
-
- - - -

This is the question content

-
-
-
- - - -

This is the alert content

-
-
-
- -); -``` - -## usage - -```js -const React = require('react'); -const Notificaton = require('ui/avatar'); - -module.exports = () => { - return ( - -

This is the warning content

-
- -

This is the question content

-
- -

This is the alert content

-
- ); -} -``` diff --git a/ui/src/index.js b/ui/src/index.js index 86b9c453..b638bdc6 100644 --- a/ui/src/index.js +++ b/ui/src/index.js @@ -7,6 +7,7 @@ module.exports = { Checkbox: require('./components/checkbox'), Column: require('./components/column'), Container: require('./components/container'), + Close: require('./components/close'), Input: require('./components/input'), List: require('./components/list'), Modal: require('./components/modal'), diff --git a/ui/src/shared/assets/close.png b/ui/src/shared/assets/close.png new file mode 100644 index 0000000000000000000000000000000000000000..94fca5fadc9930a49dbe73bd5231eb6707370e3d GIT binary patch literal 345 zcmV-f0jBPx$6G=otR45f={{R0!Kg+VkeZrmU~Fvcb?)4`^NeX}Y1RM! z{cB-lWW373!QnW0^5oaZdO(VShVBK52?Eu4GqJO?&jKk13TprO@ne5(ZmuXy1CnAP zpqfoUyoV7a2~q@74AKPB46+Hxmxh`QQoIp}LubvJ^&6}KT@#Rh9f-w&7)3Ei9b5y5 z1G4G+_wNUROid6UXzCUq4g#4B;)4Jago2PDX8>6slVLy+=tlt<2Smd)pm`8vGS+|q zYd}*B@?a3i )); +storiesOf('Close', module) + .add('Default', () => ( + + )); + storiesOf('Toggle', module) .add('default', () => (