Add a starting date to milestonesmilestone_start_date

2 files changed, 12 insertions, 14 deletions

diff --git a/app/assets/javascripts/due_date_select.js.es6 b/app/assets/javascripts/due_date_select.js.es6
index fd7f961aab9..e84f5ac9183 100644
--- a/app/assets/javascripts/due_date_select.js.es6
+++ b/app/assets/javascripts/due_date_select.js.es6
@@ -145,25 +145,19 @@
 
   class DueDateSelectors {
     constructor() {
-      this.initMilestoneDueDate();
+      this.initMilestoneDatePicker();
       this.initIssuableSelect();
     }
 
-    initMilestoneDueDate() {
-      const $datePicker = $('.datepicker');
+    initMilestoneDatePicker() {
+      $('.datepicker').datepicker({
+        dateFormat: 'yy-mm-dd'
+      });
 
-      if ($datePicker.length) {
-        const $dueDate = $('#milestone_due_date');
-        $datePicker.datepicker({
-          dateFormat: 'yy-mm-dd',
-          onSelect: (dateText, inst) => {
-            $dueDate.val(dateText);
-          }
-        }).datepicker('setDate', $.datepicker.parseDate('yy-mm-dd', $dueDate.val()));
-      }
-      $('.js-clear-due-date').on('click', (e) => {
+      $('.js-clear-due-date,.js-clear-start-date').on('click', (e) => {
         e.preventDefault();
-        $.datepicker._clearDate($datePicker);
+        const datepicker = $(e.target).siblings('.datepicker');
+        $.datepicker._clearDate(datepicker);
       });
     }
 
diff --git a/app/assets/stylesheets/framework/issue_box.scss b/app/assets/stylesheets/framework/issue_box.scss
index ba3930e03bd..ff6f316d576 100644
--- a/app/assets/stylesheets/framework/issue_box.scss
+++ b/app/assets/stylesheets/framework/issue_box.scss
@@ -39,4 +39,8 @@
   &.status-box-expired {
     background: #cea61b;
   }
+
+  &.status-box-upcoming {
+    background: #8f8f8f;
+  }
 }