Update style for the todo app

customize.dist/src/less/mixins.less

@@ -191,3 +191,22 @@
         }
     }
 }
+
+.sidebarButton {
+    button.btn {
+        background-color: @button-bg;
+        border-color: darken(@button-bg, 10%);
+        color: white;
+        &:hover {
+            background-color: darken(@button-bg, 10%);
+        }
+        &.btn-danger {
+            background-color: @button-red-bg;
+            border-color: darken(@button-red-bg, 10%);
+            color: white;
+            &:hover {
+                background-color: darken(@button-red-bg, 10%);
+            }
+        }
+    }
+}

customize.dist/src/less/sidebar-layout.less

@@ -7,9 +7,6 @@
 @description-color: #777;
 
 @button-width: 400px;
-@button-bg: #3066e5;
-@button-alt-bg: #fff;
-@button-red-bg: #e54e4e;
 
 
 .cp {
@@ -72,25 +69,10 @@
                     border-left: 0px;
                 }
             }
-            button.btn {
-                background-color: @button-bg;
-                border-color: darken(@button-bg, 10%);
-                color: white;
-                &:hover {
-                    background-color: darken(@button-bg, 10%);
-                }
-                &.btn-danger {
-                    background-color: @button-red-bg;
-                    border-color: darken(@button-red-bg, 10%);
-                    color: white;
-                    &:hover {
-                        background-color: darken(@button-red-bg, 10%);
-                    }
-                }
-            }
             &>div {
                 margin: 10px 0;
             }
+            .sidebarButton;
         }
     }
 }

customize.dist/src/less/variables.less

@@ -128,6 +128,10 @@
 
 @category-bg: #f4f4f4;
 
+@button-bg: #3066e5;
+@button-alt-bg: #fff;
+@button-red-bg: #e54e4e;
+
 .unselectable () {
     -webkit-touch-callout: none;
     -webkit-user-select: none;

www/todo/todo.less

@@ -53,6 +53,20 @@ body {
     #newTodoName {
         flex: 1;
         margin-right: 15px;
+        border-radius: 0;
+        border: 0;
+        background-color: darken(@toolbar-todo-bg, 10%);
+        color: #fff;
+        padding: 5px 10px;
+    }
+
+    button {
+        border-radius: 0;
+        background-color: darken(@toolbar-todo-bg, 20%);
+        border:0;
+        &:hover {
+            background-color: darken(@toolbar-todo-bg, 25%);
+        }
     }
 }