diff --git a/app/assets/javascripts/vue_shared/components/sidebar/date_picker.vue b/app/assets/javascripts/vue_shared/components/sidebar/date_picker.vue
index 1413dd69f24e50f903a821a07f9c34b71859861c..3fcacd156c5c393efcf05bb0eae2e63678a89822 100644
--- a/app/assets/javascripts/vue_shared/components/sidebar/date_picker.vue
+++ b/app/assets/javascripts/vue_shared/components/sidebar/date_picker.vue
@@ -14,6 +14,11 @@
       collapsedCalendarIcon,
     },
     props: {
+      blockClass: {
+        type: String,
+        required: false,
+        default: '',
+      },
       collapsed: {
         type: Boolean,
         required: false,
@@ -91,7 +96,10 @@
 </script>
 
 <template>
-  <div class="block">
+  <div
+    class="block"
+    :class="blockClass"
+  >
     <div class="issuable-sidebar-header">
       <toggle-sidebar
         :collapsed="collapsed"