diff --git a/frontend/app/block/block.less b/frontend/app/block/block.less
index 8bab8ccfb..1ec757724 100644
--- a/frontend/app/block/block.less
+++ b/frontend/app/block/block.less
@@ -285,9 +285,9 @@
             }
 
             &.is-layoutmode .block-mask-inner {
-                margin-top: 35px; // TODO fix this magic
+                margin-top: var(--header-height); // TODO fix this magic
                 background-color: rgba(0, 0, 0, 0.5);
-                height: calc(100% - 35px);
+                height: calc(100% - var(--header-height));
                 width: 100%;
                 display: flex;
                 align-items: center;
diff --git a/frontend/app/view/term/term.less b/frontend/app/view/term/term.less
index 16dfbef5b..d3b611d83 100644
--- a/frontend/app/view/term/term.less
+++ b/frontend/app/view/term/term.less
@@ -13,7 +13,7 @@
 
 .view-term {
     display: flex;
-    flex-direction: column;
+    flex-direction: row;
     width: 100%;
     height: 100%;
     overflow: hidden;
diff --git a/frontend/app/view/term/term.tsx b/frontend/app/view/term/term.tsx
index dca1d0a19..bfd6ea22d 100644
--- a/frontend/app/view/term/term.tsx
+++ b/frontend/app/view/term/term.tsx
@@ -314,6 +314,7 @@ const TerminalView = ({ blockId, model }: TerminalViewProps) => {
                 drawBoldTextInBrightColors: false,
                 fontWeight: "normal",
                 fontWeightBold: "bold",
+                allowTransparency: true,
             },
             {
                 keydownHandler: handleTerminalKeydown,