feat: Dark Mode (#7471)

app/javascript/dashboard/components/CustomSnoozeModal.vue

@@ -1,7 +1,7 @@
 <template>
-  <div class="column">
+  <div class="flex flex-col">
     <woot-modal-header :header-title="$t('CONVERSATION.CUSTOM_SNOOZE.TITLE')" />
-    <form class="row modal-content" @submit.prevent="chooseTime">
+    <form class="modal-content" @submit.prevent="chooseTime">
       <date-picker
         v-model="snoozeTime"
         type="datetime"
@@ -11,7 +11,7 @@
         :disabled-time="disabledTime"
         :popup-style="{ width: '100%' }"
       />
-      <div class="modal-footer justify-content-end w-full">
+      <div class="flex flex-row justify-end gap-2 py-2 px-0 w-full">
         <woot-button variant="clear" @click.prevent="onClose">
           {{ this.$t('CONVERSATION.CUSTOM_SNOOZE.CANCEL') }}
         </woot-button>
@@ -64,12 +64,8 @@ export default {
   },
 };
 </script>
-
 <style lang="scss" scoped>
-.modal-footer {
-  padding: var(--space-two);
-}
 .modal-content {
-  padding: var(--space-small) var(--space-two) var(--space-zero);
+  @apply pt-2 px-5 pb-6;
 }
 </style>