chore: Remove older UI (#11720)

app/javascript/dashboard/assets/scss/plugins/_date-picker.scss

@@ -0,0 +1,97 @@
+@import 'vue-datepicker-next/scss/index';
+
+.date-picker {
+  // To be removed one SLA reports date picker is created
+  &.small {
+    .mx-input {
+      @apply h-8 text-sm;
+    }
+  }
+
+  &.no-margin {
+    .mx-input {
+      margin-bottom: 0 !important;
+    }
+  }
+
+  &:not(.auto-width) {
+    .mx-datepicker-range {
+      @apply w-[320px];
+    }
+  }
+
+  .mx-datepicker {
+    @apply w-full;
+  }
+
+  .mx-input {
+    @apply h-[2.5rem] flex border border-solid border-n-weak rounded-md shadow-none;
+  }
+
+  .mx-input:disabled,
+  .mx-input[readonly] {
+    @apply bg-n-background cursor-pointer;
+  }
+
+  .mx-icon-calendar {
+    @apply text-n-slate-10;
+  }
+}
+
+.mx-datepicker-main {
+  @apply border-0 bg-n-solid-2 rounded-xl;
+
+  .cell {
+    &.disabled {
+      @apply bg-n-slate-2 dark:bg-n-background text-n-slate-10;
+    }
+
+    &:hover,
+    &.hover-in-range,
+    &.in-range {
+      @apply bg-n-slate-3 dark:bg-n-solid-3 text-n-slate-12;
+    }
+  }
+
+  .mx-calendar + .mx-calendar {
+    @apply border-l border-n-weak;
+  }
+
+  .mx-datepicker-footer {
+    @apply border border-n-weak;
+  }
+
+  .mx-time {
+    @apply border-0 bg-n-background dark:bg-n-solid-2;
+
+    .mx-time-header {
+      @apply border-0;
+    }
+
+    .mx-time-item {
+      &.disabled {
+        @apply bg-n-slate-2 dark:bg-n-background;
+      }
+
+      &:hover {
+        @apply bg-n-slate-3 dark:bg-n-solid-3;
+      }
+    }
+  }
+
+  .today {
+    @apply font-semibold;
+  }
+}
+
+.mx-datepicker-popup {
+  @apply z-[99999];
+}
+
+.mx-datepicker-inline {
+  @apply w-full;
+
+  .mx-calendar {
+    @apply w-full;
+  }
+}

app/javascript/dashboard/assets/scss/plugins/_dropdown.scss

@@ -1,7 +0,0 @@
-.dropdown-pane {
-  @apply border rounded-lg hidden relative invisible shadow-lg border-n-strong dark:border-n-strong box-content p-2 w-fit z-[9999];
-
-  &.dropdown-pane--open {
-    @apply bg-n-alpha-3 backdrop-blur-[100px] absolute  block visible;
-  }
-}

app/javascript/dashboard/assets/scss/plugins/_multiselect.scss

@@ -17,6 +17,10 @@
     @apply mb-4;
   }
 
+  &.invalid .multiselect__tags {
+    @apply border-0 outline outline-1 outline-n-ruby-8 dark:outline-n-ruby-8 hover:outline-n-ruby-9 dark:hover:outline-n-ruby-9 disabled:outline-n-ruby-8 dark:disabled:outline-n-ruby-8;
+  }
+
   &.multiselect--disabled {
     @apply opacity-50  rounded-lg cursor-not-allowed pointer-events-auto;
 
@@ -124,8 +128,7 @@
   }
 
   .multiselect__input {
-    @include ghost-input;
-    @apply text-sm h-[2.875rem] mb-0 p-0;
+    @apply text-sm h-[2.875rem] mb-0 p-0 shadow-none border-transparent hover:border-transparent hover:shadow-none focus:border-transparent focus:shadow-none active:border-transparent active:shadow-none;
   }
 
   .multiselect__single {