diff --git a/packages/editor-ui/src/components/DataDisplay.vue b/packages/editor-ui/src/components/DataDisplay.vue
index 56e5d65992..d77b91da06 100644
--- a/packages/editor-ui/src/components/DataDisplay.vue
+++ b/packages/editor-ui/src/components/DataDisplay.vue
@@ -94,9 +94,13 @@ export default Vue.extend({
 		position: relative;
 		width: 80%;
 		height: 80%;
-		margin: 8em auto;
+		margin: 6em auto;
 		background-color: #fff;
 		border-radius: 2px;
+		@media (max-height: 720px) {
+			margin: 1em auto;
+			height: 95%;
+		}
 	}
 }
 
diff --git a/packages/editor-ui/src/n8n-theme.scss b/packages/editor-ui/src/n8n-theme.scss
index 41b82ac966..e946f50df9 100644
--- a/packages/editor-ui/src/n8n-theme.scss
+++ b/packages/editor-ui/src/n8n-theme.scss
@@ -56,6 +56,11 @@ h1, h2, h3, h4, h5, h6 {
 	background-color: $--custom-dialog-background;
 	-webkit-box-shadow: none;
 	box-shadow: none;
+
+	@media (max-height: 720px) {
+		margin: 1em auto !important;
+	}
+
 	.el-dialog__header {
 		padding: 15px 20px;
 		.el-dialog__title {
@@ -462,9 +467,20 @@ h1, h2, h3, h4, h5, h6 {
 	background: #ddd;
 }
 ::-webkit-scrollbar-thumb {
-	background: #ddd;
 	border-radius: 6px;
+	background: lighten($--color-primary, 20%);
 }
 ::-webkit-scrollbar-thumb:hover {
 	background: $--color-primary;
 }
+
+.el-dialog__wrapper {
+	&::-webkit-scrollbar-track,
+	&::-webkit-scrollbar-track:hover {
+		background: #fff;
+	}
+	&::-webkit-scrollbar-thumb {
+		background: $--color-primary;
+		border-radius: 6px;
+	}
+}