diff --git a/src/components/LayerUI.tsx b/src/components/LayerUI.tsx
index 822693fd3..4c8877731 100644
--- a/src/components/LayerUI.tsx
+++ b/src/components/LayerUI.tsx
@@ -419,24 +419,27 @@ const LayerUI = ({
                 />
               </Island>
               {!viewModeEnabled && (
-                <div
-                  className={clsx("undo-redo-buttons zen-mode-transition", {
-                    "layer-ui__wrapper__footer-left--transition-bottom":
-                      zenModeEnabled,
-                  })}
-                >
-                  {actionManager.renderAction("undo", { size: "small" })}
-                  {actionManager.renderAction("redo", { size: "small" })}
-                </div>
+                <>
+                  <div
+                    className={clsx("undo-redo-buttons zen-mode-transition", {
+                      "layer-ui__wrapper__footer-left--transition-bottom":
+                        zenModeEnabled,
+                    })}
+                  >
+                    {actionManager.renderAction("undo", { size: "small" })}
+                    {actionManager.renderAction("redo", { size: "small" })}
+                  </div>
+
+                  <div
+                    className={clsx("eraser-buttons zen-mode-transition", {
+                      "layer-ui__wrapper__footer-left--transition-left":
+                        zenModeEnabled,
+                    })}
+                  >
+                    {actionManager.renderAction("eraser", { size: "small" })}
+                  </div>
+                </>
               )}
-              <div
-                className={clsx("eraser-buttons zen-mode-transition", {
-                  "layer-ui__wrapper__footer-left--transition-left":
-                    zenModeEnabled,
-                })}
-              >
-                {actionManager.renderAction("eraser", { size: "small" })}
-              </div>
             </Section>
           </Stack.Col>
         </div>