diff --git a/packages/nc-gui/components/nc/Button.vue b/packages/nc-gui/components/nc/Button.vue
index 5a180e094a..701daebe41 100644
--- a/packages/nc-gui/components/nc/Button.vue
+++ b/packages/nc-gui/components/nc/Button.vue
@@ -73,10 +73,6 @@ useEventListener(NcButton, 'mousedown', () => {
 <template>
   <a-button
     ref="NcButton"
-    :disabled="props.disabled"
-    :loading="loading"
-    :type="type"
-    class="nc-button"
     :class="{
       small: size === 'small',
       medium: size === 'medium',
@@ -84,34 +80,38 @@ useEventListener(NcButton, 'mousedown', () => {
       xxsmall: size === 'xxsmall',
       focused: isFocused,
     }"
+    :disabled="props.disabled"
+    :loading="loading"
     :tabindex="props.disabled ? -1 : 0"
-    @focus="onFocus"
+    :type="type"
+    class="nc-button"
     @blur="onBlur"
+    @focus="onFocus"
   >
     <div
-      class="flex flex-row gap-x-2.5 w-full"
       :class="{
         'justify-center': props.centered,
         'justify-start': !props.centered,
       }"
+      class="flex flex-row gap-x-2.5 w-full"
     >
       <GeneralLoader
         v-if="loading"
-        size="medium"
-        class="flex !bg-inherit"
         :class="{
           '!text-white': type === 'primary' || type === 'danger',
           '!text-gray-800': type !== 'primary' && type !== 'danger',
         }"
+        class="flex !bg-inherit"
+        size="medium"
       />
 
       <slot v-else name="icon" />
       <div
         v-if="!(size === 'xxsmall' && loading) && !props.iconOnly"
-        class="flex flex-row items-center"
         :class="{
           'font-medium': type === 'primary' || type === 'danger',
         }"
+        class="flex flex-row items-center w-full"
       >
         <slot v-if="loading && slots.loading" name="loading" />
 
diff --git a/packages/nc-gui/components/smartsheet/calendar/index.vue b/packages/nc-gui/components/smartsheet/calendar/index.vue
index a8aa6be627..e6f9acfdb9 100644
--- a/packages/nc-gui/components/smartsheet/calendar/index.vue
+++ b/packages/nc-gui/components/smartsheet/calendar/index.vue
@@ -169,8 +169,10 @@ const headerText = computed(() => {
               size="small"
               type="secondary"
             >
-              <span class="font-bold text-center text-brand-500">{{ headerText }}</span>
-              <component :is="iconMap.arrowDown" class="h-4 w-4 text-gray-700" />
+              <div class="flex w-full px-3 py-1 items-center justify-between">
+                <span class="font-bold text-center text-brand-500">{{ headerText }}</span>
+                <component :is="iconMap.arrowDown" class="h-4 w-4 text-gray-700" />
+              </div>
             </NcButton>
 
             <template #overlay>