2 files changed, 12 insertions, 4 deletions
diff --git a/client/components/Folders/FolderForm.jsx b/client/components/Folders/FolderForm.jsx
index b89e2a0..1ed263e 100644
--- a/client/components/Folders/FolderForm.jsx
+++ b/client/components/Folders/FolderForm.jsx
@@ -25,6 +25,7 @@ export default class FolderForm extends Component {
     event.preventDefault()
     let rec = Object.assign({}, this.state)
     delete rec.error
+    this.props.onClose()
     client.folder.create( rec ).then( (data) => {
       this.props.addFolder( data )
     })
diff --git a/client/components/Folders/Folders.jsx b/client/components/Folders/Folders.jsx
index 0d34f58..f63dae2 100644
--- a/client/components/Folders/Folders.jsx
+++ b/client/components/Folders/Folders.jsx
@@ -34,16 +34,23 @@ export default class Folders extends Component {
     const folders = (this.props.folders || []).map( (folder,i) => {
       return (
         <div key={i} onClick={() => this.toggle(folder)}>
-          {folder.name}
+          <span class='name'>{folder.name}</span>
         </div>
       )
     })
     return (
       <div class='folders'>
-        <b>folders</b> <button onClick={() => this.openModal()}>+ folder</button>
-        {folders}
+        <div class='heading'>
+          <b>folders</b>
+          <div class='buttons'>
+            <button onClick={() => this.openModal()}>+ folder</button>
+          </div>
+        </div>
+        <div class='list'>
+          {folders}
+        </div>
         <Modal visible={this.state.adding} onClose={() => this.closeModal()}>
-          <FolderForm addFolder={this.props.addFolder} />
+          <FolderForm addFolder={this.props.addFolder} onClose={() => this.closeModal()} />
         </Modal>
       </div>
     )