Removed modern style, was taking too long. Improved import dialog

Author: MartinSGill

WebApp/src/css/_default_styles.less

@@ -128,6 +128,12 @@ footer
   background-size: 32px 32px;
 }
 
+.warning
+{
+  color: @warning-color;
+  font-size: smaller;
+}
+
 /*****************************************************
  * Toolbar
  *****************************************************/
@@ -835,6 +841,22 @@ form
   height: 200px;
 }
 
+.filePicker input
+{
+  width: 310px;
+  margin-top: 5px;
+}
+
+.filePicker button
+{
+}
+
+.fileAlternative
+{
+  text-align: center;
+  font-size: larger;
+}
+
 .dragOver
 {
   border-color: @import-border-hover;

WebApp/src/css/simple_default.less

@@ -36,6 +36,7 @@
 @notice-background: black;
 @notice-text: ivory;
 @notice-error: #FF4848;
+@warning-color: #FF4848;
 
 @add-border: silver;
 @add-background: #edef85;

WebApp/src/css/simple_solarized_dark.less

@@ -36,6 +36,7 @@
 @notice-background: #586e75;
 @notice-text: #002b36;
 @notice-error: #dc322f;
+@warning-color: #dc322f;
 
 @add-border: #586e75;
 @add-background: #b58900;

WebApp/src/css/simple_solarized_light.less

@@ -36,6 +36,7 @@
 @notice-background: #586e75;
 @notice-text: #fdf6e3;
 @notice-error: #dc322f;
+@warning-color: #dc322f;
 
 @add-border: #586e75;
 @add-background: #b58900;

WebApp/src/js/model/options.ts

@@ -155,7 +155,7 @@ module TodoTxtJs
 
             this.themes = [
                 { name: "Original", file: "simple_default.css" },
-                { name: "Modern", file: "modern.css" },
+                // { name: "Modern", file: "modern.css" },
                 { name: "Solarized Dark", file: "simple_solarized_dark.css" },
                 { name: "Solarized Light", file: "simple_solarized_light.css" }
             ];

WebApp/src/js/views/importing.ts

@@ -31,7 +31,7 @@ module TodoTxtJs.View
 {
     export class Importing
     {
-        public appendImport: KnockoutObservable<boolean>;
+        public replaceImport: KnockoutObservable<boolean>;
         public importDetails: KnockoutObservable<string>;
 
         private _dropTarget:any;
@@ -42,7 +42,7 @@ module TodoTxtJs.View
 
         constructor(todoManager:TodoManager)
         {
-            this.appendImport = ko.observable<boolean>(false);
+            this.replaceImport = ko.observable<boolean>(false);
             this.importDetails = ko.observable<string>("");
 
             this._dropTarget = null;
@@ -97,7 +97,7 @@ module TodoTxtJs.View
 
         public onClick_Import()
         {
-            if (!this.appendImport())
+            if (this.replaceImport())
             {
                 this._todoManager.removeAll();
             }

WebApp/src/todotxt.html

@@ -347,18 +347,19 @@ <h1>Display</h1>
         <div id="fileUpload" class="uploadTarget">
             <span>Drop your todo.txt file here.</span>
         </div>
+        <div class="fileAlternative">or</div>
         <div class="filePicker">
             <label><input type="text" readonly></label><button data-bind="click: onClick_PickFile">Pick File</button>
         </div>
         <div class="importDetails" data-bind="text: importDetails">
 
         </div>
-        <div class="importAppendOption">
+        <div class="importReplaceOption">
             <label>
-                <input type="checkbox" data-bind="checked: appendImport"/>
-                Append
+                <input type="checkbox" data-bind="checked: replaceImport"/>
+                Replace
             </label>
-            <span class="warning" data-bind="visible: !appendImport()" >Delete existing entries</span>
+            <span class="warning" data-bind="visible: replaceImport()" >This deletes <b>ALL</b> existing entries</span>
         </div>
     </div>
 </section>