Make main page prettier

diff --git a/dist/flowy.css b/dist/flowy.css
index 1cf2149945cfc78e5f43e627a87dcd01f131cbd9..d931a5239c08024a5de091880263ac6da231167d 100644 (file)
--- a/dist/flowy.css
+++ b/dist/flowy.css
@@ -1,6 +1,18 @@
 body {
   background: #f9f9fa;
 }
+.page {
+  width: 80%;
+  margin-left: auto;
+  margin-right: auto;
+  max-width: 700px;
+  border: 1px solid #ccc;
+  padding-top: 60px;
+  padding-bottom: 10px;
+  padding-right: 60px;
+  padding-left: 60px;
+  background: #ffffff;
+}
 .todo > .text {
   font-size: 20pt;
   margin-top: 5px;
@@ -18,12 +30,6 @@ body {
 }
 #todo-list {
   width: 80%;
-  margin: auto;
-  max-width: 600px;
-  border: 1px solid #ccc;
-  padding-top: 60px;
-  padding-bottom: 10px;
-  background: #ffffff;
 }
 .with-dropshadow {
   box-shadow: 0 2px 12px rgba(0, 0, 0, 0.6);
@@ -50,13 +56,10 @@ body {
 }
 .shortcuts .description {
   background-color: #efefef;
-  max-width: 80px;
-  padding: 0 0 0 7px;
-}
-.shortcuts .keybinding {
-  padding: 0 0 0 7px;
+  max-width: 70px;
 }
 .shortcuts td {
+  padding: 10px;
   border-top: 0;
   border-bottom: 1px solid #aaa;
 }

diff --git a/dist/flowy.js b/dist/flowy.js
index 42bd5ec1bab331e985b743afc1803f6d9bcf4f9d..876950d4056b232044edce1dcb3d041c12460467 100644 (file)
--- a/dist/flowy.js
+++ b/dist/flowy.js
@@ -282,8 +282,10 @@ var Shortcut = (function(document, _) {
                 allowRebind: false, // Insert javascript to allow rebinding shortcuts
                 highlightRepeats: true, // Warn about shortcuts which are bound to multiple actions (if user can remap shortcuts) // TODO
                 shortcuts: _.sortBy(this.shortcuts, 'description'),
+                noDisplay: [], // ids not to display
                 includeElement: true,
             });
+            options.shortcuts = _.reject(options.shortcuts, function(shortcut) { return _.contains(options.noDisplay, shortcut.id); } );
             if (options.objectGrouping === "default") {
                 var multipleObjectTypes = _.chain(options.shortcuts).pluck('object').unique().size().value() > 1;
                 options.objectGrouping = multipleObjectTypes;
@@ -399,9 +401,12 @@ var TodoView = Backbone.View.extend({
     "input > .text": "textChange",
     "blur > .text": "render", // Because the model shouldn't update the view during active editing, add a re-render at the end
     "keydown > .text": "keydown",
-    'Shortcut("toggleComplete", "Mark an item as complete or not", "ctrl+enter") > .text': "toggleComplete",
+    'Shortcut("toggleComplete", "Complete", "ctrl+enter") > .text': "toggleComplete",
     'Shortcut("backspace", "Combine an item with the previous item", "backspace") > .text': "backspace",
     'Shortcut("delete", "Combine an item with the next item", "del") > .text': "delete",
+    //'Shortcut("next", "Next", "down") > .text': 'next',
+    //'Shortcut("previous", "Previous", "previous") > .text': 'previous',
+
   },
   initialize: function() {
     this.childViewPositions = [];
@@ -806,7 +811,7 @@ var AppView = Backbone.View.extend({
                 e.save();
             });
         });
-        Shortcut.bindShortcutsDisplay(this.$("#shortcuts-wrapper")[0], {allowRebind: true});
+        Shortcut.bindShortcutsDisplay(this.$("#shortcuts-wrapper")[0], {allowRebind: true, noDisplay: ['backspace', 'delete'] });
         this.views = {}; // A list of views for each element in the collection
         this.list.fetch();
         this.render();

diff --git a/dist/flowy.unwrapped.js b/dist/flowy.unwrapped.js
index d3435203eb7ce95c4557d751c01ae1f3737083f1..6ddd069e16b59412d34b71a93f08dae393121206 100644 (file)
--- a/dist/flowy.unwrapped.js
+++ b/dist/flowy.unwrapped.js
@@ -281,8 +281,10 @@ var Shortcut = (function(document, _) {
                 allowRebind: false, // Insert javascript to allow rebinding shortcuts
                 highlightRepeats: true, // Warn about shortcuts which are bound to multiple actions (if user can remap shortcuts) // TODO
                 shortcuts: _.sortBy(this.shortcuts, 'description'),
+                noDisplay: [], // ids not to display
                 includeElement: true,
             });
+            options.shortcuts = _.reject(options.shortcuts, function(shortcut) { return _.contains(options.noDisplay, shortcut.id); } );
             if (options.objectGrouping === "default") {
                 var multipleObjectTypes = _.chain(options.shortcuts).pluck('object').unique().size().value() > 1;
                 options.objectGrouping = multipleObjectTypes;
@@ -398,9 +400,12 @@ var TodoView = Backbone.View.extend({
     "input > .text": "textChange",
     "blur > .text": "render", // Because the model shouldn't update the view during active editing, add a re-render at the end
     "keydown > .text": "keydown",
-    'Shortcut("toggleComplete", "Mark an item as complete or not", "ctrl+enter") > .text': "toggleComplete",
+    'Shortcut("toggleComplete", "Complete", "ctrl+enter") > .text': "toggleComplete",
     'Shortcut("backspace", "Combine an item with the previous item", "backspace") > .text': "backspace",
     'Shortcut("delete", "Combine an item with the next item", "del") > .text': "delete",
+    //'Shortcut("next", "Next", "down") > .text': 'next',
+    //'Shortcut("previous", "Previous", "previous") > .text': 'previous',
+
   },
   initialize: function() {
     this.childViewPositions = [];
@@ -805,7 +810,7 @@ var AppView = Backbone.View.extend({
                 e.save();
             });
         });
-        Shortcut.bindShortcutsDisplay(this.$("#shortcuts-wrapper")[0], {allowRebind: true});
+        Shortcut.bindShortcutsDisplay(this.$("#shortcuts-wrapper")[0], {allowRebind: true, noDisplay: ['backspace', 'delete'] });
         this.views = {}; // A list of views for each element in the collection
         this.list.fetch();
         this.render();

diff --git a/dist/index.html b/dist/index.html
index 9d38c0418c32ca8f588efa8aeaac099b05000839..007e18accc6b556f8424b48a8baaf2a052ce9d6c 100644 (file)
--- a/dist/index.html
+++ b/dist/index.html
@@ -6,8 +6,10 @@
 </head>
 <body>
 <div id="todo-app">
-    <div id="todo-list">
+    <div class="page">
+        <div id="todo-list">
 
+        </div>
     </div>
     <button id="reset-button">Initial setup / Reset</button>
     <div id="shortcuts-wrapper">

diff --git a/src/css/flowy.less b/src/css/flowy.less
index 3a00616116280352ff35f28474150b004af0add2..5d03024a4b15bc7d8abc24033ccd01cf30ea6336 100644 (file)
--- a/src/css/flowy.less
+++ b/src/css/flowy.less
@@ -2,6 +2,19 @@ body {
     background: #f9f9fa;
 }
 
+.page {
+    width: 80%;
+    margin-left: auto;
+    margin-right: auto;
+    max-width: 700px;
+    border: 1px solid #ccc;
+    padding-top: 60px;
+    padding-bottom: 10px;
+    padding-right: 60px;
+    padding-left: 60px;
+    background: #ffffff;
+}
+
 .todo > .text {
     font-size: 20pt;
     margin-top: 5px;
@@ -24,12 +37,6 @@ body {
 
 #todo-list {
     width: 80%;
-    margin: auto;
-    max-width: 600px;
-    border: 1px solid #ccc;
-    padding-top: 60px;
-    padding-bottom: 10px;
-    background: #ffffff;
 }
 
 .with-dropshadow {
@@ -57,13 +64,12 @@ body {
     width: 100%;
     .description {
         background-color: #efefef;
-        max-width: 80px;
-        padding: 0 0 0 7px;
+        max-width: 70px;
     }
     .keybinding {
-        padding: 0 0 0 7px;
     }
     td {
+        padding: 10px;
         border-top: 0;
         border-bottom: 1px solid #aaa;
     }

diff --git a/src/index.html b/src/index.html
index 9d38c0418c32ca8f588efa8aeaac099b05000839..007e18accc6b556f8424b48a8baaf2a052ce9d6c 100644 (file)
--- a/src/index.html
+++ b/src/index.html
@@ -6,8 +6,10 @@
 </head>
 <body>
 <div id="todo-app">
-    <div id="todo-list">
+    <div class="page">
+        <div id="todo-list">
 
+        </div>
     </div>
     <button id="reset-button">Initial setup / Reset</button>
     <div id="shortcuts-wrapper">

diff --git a/src/library/shortcut.js b/src/library/shortcut.js
index fd37777bf3c13fd983a8f909800e8afba4b16049..a5bf9464771d8b448fc17c27f0505ce933e39ff4 100644 (file)
--- a/src/library/shortcut.js
+++ b/src/library/shortcut.js
@@ -220,8 +220,10 @@ var Shortcut = (function(document, _) {
                 allowRebind: false, // Insert javascript to allow rebinding shortcuts
                 highlightRepeats: true, // Warn about shortcuts which are bound to multiple actions (if user can remap shortcuts) // TODO
                 shortcuts: _.sortBy(this.shortcuts, 'description'),
+                noDisplay: [], // ids not to display
                 includeElement: true,
             });
+            options.shortcuts = _.reject(options.shortcuts, function(shortcut) { return _.contains(options.noDisplay, shortcut.id); } );
             if (options.objectGrouping === "default") {
                 var multipleObjectTypes = _.chain(options.shortcuts).pluck('object').unique().size().value() > 1;
                 options.objectGrouping = multipleObjectTypes;

diff --git a/src/views/app.js b/src/views/app.js
index eac1db0deb2cff313ad281137e54e0fa395847c3..ca9cd2980022ff28ef94e228a2ccb5c5bfec5b8d 100644 (file)
--- a/src/views/app.js
+++ b/src/views/app.js
@@ -79,7 +79,7 @@ var AppView = Backbone.View.extend({
                 e.save();
             });
         });
-        Shortcut.bindShortcutsDisplay(this.$("#shortcuts-wrapper")[0], {allowRebind: true});
+        Shortcut.bindShortcutsDisplay(this.$("#shortcuts-wrapper")[0], {allowRebind: true, noDisplay: ['backspace', 'delete'] });
         this.views = {}; // A list of views for each element in the collection
         this.list.fetch();
         this.render();

diff --git a/src/views/todo.js b/src/views/todo.js
index e57faf16d3b8308f11d9c1a06008b842987e5402..03a6a4465ed9ccd9a092e8c1e20ee8c5813f4e5d 100644 (file)
--- a/src/views/todo.js
+++ b/src/views/todo.js
@@ -11,9 +11,12 @@ var TodoView = Backbone.View.extend({
     "input > .text": "textChange",
     "blur > .text": "render", // Because the model shouldn't update the view during active editing, add a re-render at the end
     "keydown > .text": "keydown",
-    'Shortcut("toggleComplete", "Mark an item as complete or not", "ctrl+enter") > .text': "toggleComplete",
+    'Shortcut("toggleComplete", "Complete", "ctrl+enter") > .text': "toggleComplete",
     'Shortcut("backspace", "Combine an item with the previous item", "backspace") > .text': "backspace",
     'Shortcut("delete", "Combine an item with the next item", "del") > .text': "delete",
+    //'Shortcut("next", "Next", "down") > .text': 'next',
+    //'Shortcut("previous", "Previous", "previous") > .text': 'previous',
+
   },
   initialize: function() {
     this.childViewPositions = [];