diff --git a/dashboard/src/app/(authenticated)/[tenantId]/(diagram)/components/NodeTypes/Task/TaskDetails.tsx b/dashboard/src/app/(authenticated)/[tenantId]/(diagram)/components/NodeTypes/Task/TaskDetails.tsx
index e34de7924..5e4e15a26 100644
--- a/dashboard/src/app/(authenticated)/[tenantId]/(diagram)/components/NodeTypes/Task/TaskDetails.tsx
+++ b/dashboard/src/app/(authenticated)/[tenantId]/(diagram)/components/NodeTypes/Task/TaskDetails.tsx
@@ -84,7 +84,7 @@ export const TaskDetails: FC<{
                 </Entry>
               }
               <Entry label="Worker Log Output:">
-                <div className={"bg-gray-300 rounded-lg text-center border border-black max-w-52 text-nowrap min-h-5"} >
+                <div className={"bg-gray-300 rounded-lg text-center border border-black w-full text-nowrap min-h-5"} >
                   <OverflowText text={taskRunData.attempts[taskAttemptIndex].logOutput?.str ?? "-"} className="text-xs" variant={resultString === "ERROR" ? "error" : undefined} />
                 </div>
               </Entry>
diff --git a/dashboard/src/app/(authenticated)/[tenantId]/components/OverflowText.tsx b/dashboard/src/app/(authenticated)/[tenantId]/components/OverflowText.tsx
index c25e67c0a..28192f498 100644
--- a/dashboard/src/app/(authenticated)/[tenantId]/components/OverflowText.tsx
+++ b/dashboard/src/app/(authenticated)/[tenantId]/components/OverflowText.tsx
@@ -1,11 +1,11 @@
 'use client'
-import { FC, useEffect, useRef, useState } from 'react'
-import { cn } from '@/components/utils'
+import { tryFormatAsJson } from '@/app/utils/tryFormatAsJson'
 import { Button } from '@/components/ui/button'
-import { ChevronRight } from 'lucide-react'
 import { Dialog, DialogContent, DialogTrigger } from '@/components/ui/dialog'
+import { cn } from '@/components/utils'
+import { ChevronRight } from 'lucide-react'
+import { FC, useEffect, useRef, useState } from 'react'
 import { CopyButton } from './CopyButton'
-import { tryFormatAsJson } from '@/app/utils/tryFormatAsJson'
 
 type OverflowTextProps = {
   text: string
@@ -37,7 +37,7 @@ export const OverflowText: FC<OverflowTextProps> = ({ text, className, variant }
               className
             )}
           >
-            <span className="truncate">{formattedText}</span>
+            <span className="truncate font-code">{formattedText}</span>
             <div className="flex flex-shrink-0 items-center gap-1 text-xs text-muted-foreground text-nowrap">
               View
               <ChevronRight className="h-4 w-4 opacity-50" />
@@ -51,14 +51,14 @@ export const OverflowText: FC<OverflowTextProps> = ({ text, className, variant }
               'bg-status-failed text-red-500': variant === 'error',
             })}
           >
-            <div className="max-w-full whitespace-pre-wrap break-words p-4">{formattedText}</div>
+            <div className="max-w-full whitespace-pre-wrap break-words p-4 font-code">{formattedText}</div>
           </div>
         </DialogContent>
       </Dialog>
     )
   }
   return (
-    <div ref={textRef} className={cn(className, "flex items-center justify-center h-full")}>
+    <div ref={textRef} className={cn(className, "flex items-center justify-center h-full font-code")}>
       {formattedText}
     </div>
   )
diff --git a/dashboard/src/app/(authenticated)/layout.tsx b/dashboard/src/app/(authenticated)/layout.tsx
index 29484f8fe..e610db672 100644
--- a/dashboard/src/app/(authenticated)/layout.tsx
+++ b/dashboard/src/app/(authenticated)/layout.tsx
@@ -2,11 +2,11 @@ import { Toaster } from '@/components/ui/sonner'
 import { WhoAmIContext } from '@/contexts/WhoAmIContext'
 import type { Metadata } from 'next'
 import { Inter } from 'next/font/google'
-import { Header } from './[tenantId]/components/Header'
-import { QueryProvider } from './[tenantId]/components/QueryProvider'
+import { SWRConfig } from 'swr'
 import getWhoAmI from '../getWhoami'
 import '../globals.css'
-import { SWRConfig } from 'swr'
+import { Header } from './[tenantId]/components/Header'
+import { QueryProvider } from './[tenantId]/components/QueryProvider'
 
 const inter = Inter({ subsets: ['latin'] })
 
diff --git a/dashboard/tailwind.config.ts b/dashboard/tailwind.config.ts
index a24595ffe..668bf3efd 100644
--- a/dashboard/tailwind.config.ts
+++ b/dashboard/tailwind.config.ts
@@ -5,91 +5,94 @@ const config = {
   content: ['./pages/**/*.{ts,tsx}', './components/**/*.{ts,tsx}', './app/**/*.{ts,tsx}', './src/**/*.{ts,tsx}'],
   prefix: '',
   theme: {
-  	container: {
-  		center: true,
-  		padding: '2rem',
-  		screens: {
-  			'2xl': '1400px'
-  		}
-  	},
-  	extend: {
-  		colors: {
-  			border: 'hsl(var(--border))',
-  			input: 'hsl(var(--input))',
-  			ring: 'hsl(var(--ring))',
-  			background: 'hsl(var(--background))',
-  			foreground: 'hsl(var(--foreground))',
-  			primary: {
-  				DEFAULT: 'hsl(var(--primary))',
-  				foreground: 'hsl(var(--primary-foreground))'
-  			},
-  			secondary: {
-  				DEFAULT: 'hsl(var(--secondary))',
-  				foreground: 'hsl(var(--secondary-foreground))'
-  			},
-  			destructive: {
-  				DEFAULT: 'hsl(var(--destructive))',
-  				foreground: 'hsl(var(--destructive-foreground))'
-  			},
-  			muted: {
-  				DEFAULT: 'hsl(var(--muted))',
-  				foreground: 'hsl(var(--muted-foreground))'
-  			},
-  			accent: {
-  				DEFAULT: 'hsl(var(--accent))',
-  				foreground: 'hsl(var(--accent-foreground))'
-  			},
-  			popover: {
-  				DEFAULT: 'hsl(var(--popover))',
-  				foreground: 'hsl(var(--popover-foreground))'
-  			},
-  			card: {
-  				DEFAULT: 'hsl(var(--card))',
-  				foreground: 'hsl(var(--card-foreground))'
-  			},
-  			status: {
-  				running: 'theme("colors.blue.300")',
-  				success: 'theme("colors.green.300")',
-  				failed: 'theme("colors.red.300")',
-  				exception: 'theme("colors.orange.300")',
-  				halting: 'theme("colors.purple.300")'
-  			},
-  			chart: {
-  				'1': 'hsl(var(--chart-1))',
-  				'2': 'hsl(var(--chart-2))',
-  				'3': 'hsl(var(--chart-3))',
-  				'4': 'hsl(var(--chart-4))',
-  				'5': 'hsl(var(--chart-5))'
-  			}
-  		},
-  		borderRadius: {
-  			lg: 'var(--radius)',
-  			md: 'calc(var(--radius) - 2px)',
-  			sm: 'calc(var(--radius) - 4px)'
-  		},
-  		keyframes: {
-  			'accordion-down': {
-  				from: {
-  					height: '0'
-  				},
-  				to: {
-  					height: 'var(--radix-accordion-content-height)'
-  				}
-  			},
-  			'accordion-up': {
-  				from: {
-  					height: 'var(--radix-accordion-content-height)'
-  				},
-  				to: {
-  					height: '0'
-  				}
-  			}
-  		},
-  		animation: {
-  			'accordion-down': 'accordion-down 0.2s ease-out',
-  			'accordion-up': 'accordion-up 0.2s ease-out'
-  		}
-  	}
+    container: {
+      center: true,
+      padding: '2rem',
+      screens: {
+        '2xl': '1400px',
+      },
+    },
+    extend: {
+      colors: {
+        border: 'hsl(var(--border))',
+        input: 'hsl(var(--input))',
+        ring: 'hsl(var(--ring))',
+        background: 'hsl(var(--background))',
+        foreground: 'hsl(var(--foreground))',
+        primary: {
+          DEFAULT: 'hsl(var(--primary))',
+          foreground: 'hsl(var(--primary-foreground))',
+        },
+        secondary: {
+          DEFAULT: 'hsl(var(--secondary))',
+          foreground: 'hsl(var(--secondary-foreground))',
+        },
+        destructive: {
+          DEFAULT: 'hsl(var(--destructive))',
+          foreground: 'hsl(var(--destructive-foreground))',
+        },
+        muted: {
+          DEFAULT: 'hsl(var(--muted))',
+          foreground: 'hsl(var(--muted-foreground))',
+        },
+        accent: {
+          DEFAULT: 'hsl(var(--accent))',
+          foreground: 'hsl(var(--accent-foreground))',
+        },
+        popover: {
+          DEFAULT: 'hsl(var(--popover))',
+          foreground: 'hsl(var(--popover-foreground))',
+        },
+        card: {
+          DEFAULT: 'hsl(var(--card))',
+          foreground: 'hsl(var(--card-foreground))',
+        },
+        status: {
+          running: 'theme("colors.blue.300")',
+          success: 'theme("colors.green.300")',
+          failed: 'theme("colors.red.300")',
+          exception: 'theme("colors.orange.300")',
+          halting: 'theme("colors.purple.300")',
+        },
+        chart: {
+          '1': 'hsl(var(--chart-1))',
+          '2': 'hsl(var(--chart-2))',
+          '3': 'hsl(var(--chart-3))',
+          '4': 'hsl(var(--chart-4))',
+          '5': 'hsl(var(--chart-5))',
+        },
+      },
+      borderRadius: {
+        lg: 'var(--radius)',
+        md: 'calc(var(--radius) - 2px)',
+        sm: 'calc(var(--radius) - 4px)',
+      },
+      keyframes: {
+        'accordion-down': {
+          from: {
+            height: '0',
+          },
+          to: {
+            height: 'var(--radix-accordion-content-height)',
+          },
+        },
+        'accordion-up': {
+          from: {
+            height: 'var(--radix-accordion-content-height)',
+          },
+          to: {
+            height: '0',
+          },
+        },
+      },
+      animation: {
+        'accordion-down': 'accordion-down 0.2s ease-out',
+        'accordion-up': 'accordion-up 0.2s ease-out',
+      },
+      fontFamily: {
+        code: ['Fira Code', 'sans-serif'],
+      },
+    },
   },
   plugins: [require('tailwindcss-animate')],
 } satisfies Config