Merge remote-tracking branch 'origin/master' into support-gitaly-tls

1 files changed, 19 insertions, 19 deletions

diff --git a/app/assets/javascripts/boards/components/issue_due_date.vue b/app/assets/javascripts/boards/components/issue_due_date.vue
index 025ef7e9743..e038198e6f0 100644
--- a/app/assets/javascripts/boards/components/issue_due_date.vue
+++ b/app/assets/javascripts/boards/components/issue_due_date.vue
@@ -1,6 +1,6 @@
 <script>
 import dateFormat from 'dateformat';
-import { GlTooltip } from '@gitlab-org/gitlab-ui';
+import { GlTooltip } from '@gitlab/ui';
 import Icon from '~/vue_shared/components/icon.vue';
 import { __ } from '~/locale';
 import { getDayDifference, getTimeago, dateInWords } from '~/lib/utils/datetime_utility';
@@ -15,6 +15,16 @@ export default {
       type: String,
       required: true,
     },
+    cssClass: {
+      type: String,
+      required: false,
+      default: '',
+    },
+    tooltipPlacement: {
+      type: String,
+      required: false,
+      default: 'bottom',
+    },
   },
   computed: {
     title() {
@@ -66,25 +76,15 @@ export default {
 
 <template>
   <span>
-    <span
-      ref="issueDueDate"
-      class="board-card-info card-number"
-    >
-      <icon
-        :class="{'text-danger': isPastDue, 'board-card-info-icon': true}"
-        name="calendar"
-      /><time
-        :class="{'text-danger': isPastDue}"
-        datetime="date"
-        class="board-card-info-text">{{ body }}</time>
+    <span ref="issueDueDate" :class="cssClass" class="board-card-info card-number">
+      <icon :class="{ 'text-danger': isPastDue, 'board-card-info-icon': true }" name="calendar" />
+      <time :class="{ 'text-danger': isPastDue }" datetime="date" class="board-card-info-text">{{
+        body
+      }}</time>
     </span>
-    <gl-tooltip
-      :target="() => $refs.issueDueDate"
-      placement="bottom"
-    >
-      <span class="bold">{{ __('Due date') }}</span>
-      <br />
-      <span :class="{'text-danger-muted': isPastDue}">{{ title }}</span>
+    <gl-tooltip :target="() => $refs.issueDueDate" :placement="tooltipPlacement">
+      <span class="bold">{{ __('Due date') }}</span> <br />
+      <span :class="{ 'text-danger-muted': isPastDue }">{{ title }}</span>
     </gl-tooltip>
   </span>
 </template>