feat(calendar/dialog): increase width and margin

Author: nicholaschiang

components/calendar/dialog/page.module.scss

@@ -6,7 +6,7 @@
   position: relative;
   display: flex;
   height: 100%;
-  max-height: calc(100vh - 12px);
+  max-height: calc(100vh - 48px);
 
   .nav {
     display: flex;
@@ -82,8 +82,7 @@
   padding: 0 24px;
   overflow: auto;
   height: 100%;
-  width: 350px;
-  min-height: 350px;
+  width: 400px;
 }
 
 @mixin header() {

components/calendar/dialog/surface.tsx

@@ -84,8 +84,8 @@ export default function DialogSurface({
       document.documentElement.clientHeight || 0,
       window.innerHeight || 0
     );
-    if (alignedCenter < 0) return PREVIEW_MARGIN;
-    if (alignedCenter + bounds.height > vh) return vh - bounds.height - PREVIEW_MARGIN;
+    if (alignedCenter < 24) return 24;
+    if (alignedCenter + bounds.height + 24 > vh) return vh - bounds.height - 24;
     return alignedCenter;
   }, [alignedCenter, bounds.height]);