Move Delete File and Delete Gist in more contextually appropriate places

Author: mythz

src/Gistlyn.Resources/app.js

@@ -26,6 +26,15 @@
 #tabs #files-menu:hover {
     color: #ffc;
 }
+#tabs .delete {
+    font-size: 16px;
+    vertical-align: bottom;
+    padding: 0 0 0 5px;
+    cursor: pointer;
+}
+#tabs .delete:hover {
+    color: #f00;
+}
 .popup {
     display: none;
     position: absolute;

src/Gistlyn.Resources/css/app.min.css

@@ -358,6 +358,9 @@ span.CodeMirror-selectedtext { background: none; }
     flex: 1;
     overflow: auto;
 }
+.macintel .ReactCodeMirror {
+    margin-left: -3px; 
+}
 
 .CodeMirror {
     margin: 0;

src/Gistlyn.Resources/css/editor.css

@@ -26,6 +26,15 @@
 #tabs #files-menu:hover {
     color: #ffc;
 }
+#tabs .delete {
+    font-size: 16px;
+    vertical-align: bottom;
+    padding: 0 0 0 5px;
+    cursor: pointer;
+}
+#tabs .delete:hover {
+    color: #f00;
+}
 .popup {
     display: none;
     position: absolute;

src/Gistlyn/css/codemirror.css

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { queryString, splitOnLast } from 'servicestack-client';
-import { UA, getSortedFileNames, IGistFile } from './utils';
+import { UA, getSortedFileNames, IGistFile, FileNames } from './utils';
 
 import CodeMirror from 'react-codemirror';
 import "jspm_packages/npm/[email protected]/addon/edit/matchbrackets.js";
@@ -149,7 +149,12 @@ export default class Editor extends React.Component<any, any> {
                     <div className={active ? 'active' : null}
                         onClick={e => !active ? this.props.selectFileName(fileName) : this.props.editFileName(fileName) }>
                         {this.props.editingFileName !== fileName
-                            ? <b>{fileName}</b>
+                            ? <b>
+                                {fileName}
+                                { this.props.isOwner && active && FileNames.canDelete(fileName)
+                                    ? <i className="material-icons delete" onClick={e => e.stopPropagation() || confirm(`Are you sure you want to delete file '${fileName}'?`) ? this.props.onDeleteFile(fileName) : null } title="delete file">cancel</i>
+                                    : null}
+                              </b>
                             : <input type="text" className="txtFileName"
                                 onBlur={e => this.props.onRenameFile(fileName, e) }
                                 onKeyDown={e => e.keyCode === 13 ? (e.target as HTMLElement).blur() : null }