diff --git a/web/ee/components/pages/editor/editor-body.tsx b/web/ee/components/pages/editor/editor-body.tsx
index 0e9a6072ce..3a38208749 100644
--- a/web/ee/components/pages/editor/editor-body.tsx
+++ b/web/ee/components/pages/editor/editor-body.tsx
@@ -104,7 +104,7 @@ export const WorkspacePageEditorBody: React.FC<Props> = observer((props) => {
       <div
         className={cn("sticky top-0 hidden h-full flex-shrink-0 -translate-x-full p-5 duration-200 md:block", {
           "translate-x-0": sidePeekVisible,
-          "w-40 lg:w-56": !isFullWidth,
+          "w-[10rem] lg:w-[14rem]": !isFullWidth,
           "w-[5%]": isFullWidth,
         })}
       >
@@ -116,8 +116,8 @@ export const WorkspacePageEditorBody: React.FC<Props> = observer((props) => {
         )}
       </div>
       <div
-        className={cn("h-full w-full pt-5", {
-          "md:w-[calc(100%-10rem)] xl:w-[calc(100%-14rem-14rem)]": !isFullWidth,
+        className={cn("h-full w-full pt-5 duration-200", {
+          "md:w-[calc(100%-10rem)] xl:w-[calc(100%-28rem)]": !isFullWidth,
           "md:w-[90%]": isFullWidth,
         })}
       >
@@ -217,8 +217,8 @@ export const WorkspacePageEditorBody: React.FC<Props> = observer((props) => {
         </div>
       </div>
       <div
-        className={cn("hidden xl:block flex-shrink-0", {
-          "w-40 lg:w-56": !isFullWidth,
+        className={cn("hidden xl:block flex-shrink-0 duration-200", {
+          "w-[10rem] lg:w-[14rem]": !isFullWidth,
           "w-[5%]": isFullWidth,
         })}
       />