diff --git a/web/src/components/repo/pipeline/PipelineLog.vue b/web/src/components/repo/pipeline/PipelineLog.vue
index 09fc3a7aa..e8196fd5a 100644
--- a/web/src/components/repo/pipeline/PipelineLog.vue
+++ b/web/src/components/repo/pipeline/PipelineLog.vue
@@ -1,7 +1,7 @@
 <template>
   <div v-if="pipeline" class="flex flex-col pt-10 md:pt-0">
     <div
-      class="flex flex-col flex-grow shadow md:mt-0 !p-0 !rounded-none !md:rounded-md overflow-hidden code-box"
+      class="flex flex-col flex-grow shadow md:mt-0 !p-0 !rounded-none !md:rounded-md overflow-hidden code-box-log"
       @mouseover="showActions = true"
       @mouseleave="showActions = false"
     >
diff --git a/web/src/style.css b/web/src/style.css
index 69ae1c65b..c88043557 100644
--- a/web/src/style.css
+++ b/web/src/style.css
@@ -170,3 +170,8 @@ body,
 code:not(pre > code) {
   @apply bg-wp-code-inline-100 text-wp-code-inline-text-100 px-1.5 py-0.5 rounded-md;
 }
+
+.code-box-log {
+  @apply bg-wp-code-300 p-4 rounded-md text-sm text-wp-code-text-100 break-words;
+  white-space: pre-wrap;
+}