Showing
2 changed files
with
19 additions
and
6 deletions
| ... | @@ -18,7 +18,7 @@ | ... | @@ -18,7 +18,7 @@ |
| 18 | this.callback = callback; | 18 | this.callback = callback; |
| 19 | } | 19 | } |
| 20 | 20 | ||
| 21 | - hide(e) { | 21 | + hide() { |
| 22 | console.log('test'); | 22 | console.log('test'); |
| 23 | $(React.findDOMNode(this)).hide(); | 23 | $(React.findDOMNode(this)).hide(); |
| 24 | } | 24 | } |
| ... | @@ -70,12 +70,19 @@ | ... | @@ -70,12 +70,19 @@ |
| 70 | }); | 70 | }); |
| 71 | } | 71 | } |
| 72 | 72 | ||
| 73 | + overlayClick(e) { | ||
| 74 | + if(e.target.className === 'overlay') { | ||
| 75 | + this.hide(); | ||
| 76 | + } | ||
| 77 | + } | ||
| 78 | + | ||
| 73 | render() { | 79 | render() { |
| 74 | var loadMore = this.loadMore.bind(this); | 80 | var loadMore = this.loadMore.bind(this); |
| 75 | var selectImage = this.selectImage.bind(this); | 81 | var selectImage = this.selectImage.bind(this); |
| 82 | + var overlayClick = this.overlayClick.bind(this); | ||
| 76 | var hide = this.hide.bind(this); | 83 | var hide = this.hide.bind(this); |
| 77 | return ( | 84 | return ( |
| 78 | - <div className="overlay" onClick={hide}> | 85 | + <div className="overlay" onClick={overlayClick}> |
| 79 | <div id="image-manager"> | 86 | <div id="image-manager"> |
| 80 | <div className="image-manager-content"> | 87 | <div className="image-manager-content"> |
| 81 | <div className="dropzone-container" ref="dropZone"> | 88 | <div className="dropzone-container" ref="dropZone"> |
| ... | @@ -117,7 +124,7 @@ | ... | @@ -117,7 +124,7 @@ |
| 117 | 124 | ||
| 118 | constructor(){ | 125 | constructor(){ |
| 119 | super(); | 126 | super(); |
| 120 | - this._dblClickTime = 160; | 127 | + this._dblClickTime = 350; |
| 121 | this._cClickTime = 0; | 128 | this._cClickTime = 0; |
| 122 | } | 129 | } |
| 123 | 130 | ||
| ... | @@ -142,7 +149,7 @@ | ... | @@ -142,7 +149,7 @@ |
| 142 | var imageClick = this.imageClick.bind(this); | 149 | var imageClick = this.imageClick.bind(this); |
| 143 | return ( | 150 | return ( |
| 144 | <div> | 151 | <div> |
| 145 | - <img onDoubleClick={imageClick} src={this.props.image.thumbnail}/> | 152 | + <img onClick={imageClick} src={this.props.image.thumbnail}/> |
| 146 | </div> | 153 | </div> |
| 147 | ); | 154 | ); |
| 148 | } | 155 | } | ... | ... |
| 1 | #image-manager { | 1 | #image-manager { |
| 2 | - background-color: #EEE; | 2 | + background-color: rgb(37, 37, 37); |
| 3 | max-width: 90%; | 3 | max-width: 90%; |
| 4 | max-height: 90%; | 4 | max-height: 90%; |
| 5 | width: 90%; | 5 | width: 90%; |
| ... | @@ -21,6 +21,12 @@ | ... | @@ -21,6 +21,12 @@ |
| 21 | left: 0; | 21 | left: 0; |
| 22 | z-index: 999; | 22 | z-index: 999; |
| 23 | display: flex; | 23 | display: flex; |
| 24 | + p, h1, h2, h3, h4, label, input { | ||
| 25 | + color: #EEE; | ||
| 26 | + } | ||
| 27 | + h1, h2, h3 { | ||
| 28 | + font-weight: 300; | ||
| 29 | + } | ||
| 24 | } | 30 | } |
| 25 | #image-manager .dropzone-container { | 31 | #image-manager .dropzone-container { |
| 26 | height: 100px; | 32 | height: 100px; |
| ... | @@ -38,7 +44,7 @@ | ... | @@ -38,7 +44,7 @@ |
| 38 | display: block; | 44 | display: block; |
| 39 | float: left; | 45 | float: left; |
| 40 | text-align: center; | 46 | text-align: center; |
| 41 | - background-color: #888; | 47 | + background-color: #404040; |
| 42 | margin: 1px; | 48 | margin: 1px; |
| 43 | color: #FFF; | 49 | color: #FFF; |
| 44 | line-height: 140px; | 50 | line-height: 140px; | ... | ... |
-
Please register or sign in to post a comment