Use the same task form layout everywhere

assets/css/src/form.css

@@ -66,8 +66,7 @@ select:focus {
 }
 
 span.select2-container {
-    margin-top: 3px;
-    margin-bottom: 10px;
+    margin-top: 2px;
 }
 
 ::-webkit-input-placeholder {
@@ -155,21 +154,15 @@ input.form-input-large {
     width: 400px;
 }
 
+.form-columns {
+    display: -webkit-flex;
+    display: flex;
+    -webkit-flex-direction: row;
+    flex-direction: row;
+}
+
 .form-column {
-    float: left;
-    margin-right: 3%;
-    max-width: 50%;
-    min-width: 40%;
-}
-
-.form-column ul {
-    margin-top: 15px;
-}
-
-.form-clear {
-    clear: both;
-    padding-top: 20px;
-    padding-bottom: 10px;
+    margin-right: 25px;
 }
 
 .form-login {

assets/css/src/task.css

@@ -256,28 +256,29 @@ span.task-board-age-column {
 
 /* color picker */
 .color-picker {
-    min-height: 35px;
+    width: 180px;
 }
 
-.color-square {
+.color-picker-option {
+    height: 25px;
+}
+
+.color-picker-square {
     display: inline-block;
-    width: 30px;
-    height: 30px;
+    width: 18px;
+    height: 18px;
     margin-right: 5px;
-    margin-bottom: 5px;
     border: 1px solid #000;
-    cursor: pointer;
 }
 
-.color-square:hover {
-    border-style: dotted;
+.color-picker-label {
+    display: inline-block;
+    vertical-align: bottom;
+    padding-bottom: 3px;
 }
 
-div.color-square-selected {
-    border-width: 2px;
-    width: 28px;
-    height: 28px;
-    box-shadow: 3px 2px 10px 0 rgba(180,180,180,0.9);
+#select2-form-color_id-results li.select2-results__option {
+    padding: 3px;
 }
 
 /* Assign to me */