error.html.erb in lookbook-1.0.0.beta.0

- old
+ new
@@ -1,46 +1,46 @@
 <%
 error = error.is_a?(Lookbook::Error) ? error : Lookbook::Error.new(error)
 @title = error.title
-disable_header ||= false
 %>
-<%= component "header" unless disable_header %>
-<div class="h-full w-full bg-red-50 flex flex-col border-red-300" id="error-<%= Time.now %>">
 
-  <header class="mx-8  pt-8 mb-8 flex-none">
-    <h2 class="text-xl font-bold text-red-700"><%= error.title %></h2>
-  </header>
-  
-  <div class="flex-none px-8 py-6 mb-8 border-t border-b border-red-200 bg-red-100 text-base font-mono leading-relaxed">
-    <pre class="whitespace-pre-wrap font-sans leading-tight text-red-900"><%= error.message %></pre>
-  </div>
+<div class="flex flex-col h-screen">
+  <div class="h-full bg-red-50 overflow-y-auto">
+    <header class="mx-8 py-6">
+      <h2 class="text-xl font-bold text-red-700"><%= error.title %></h2>
+    </header>
 
-  <% if error.file_name %>
-    <div class="text-gray-800 text-sm mx-8 mb-2 font-mono flex-none <%= "pl-2" if error.source_code %>">
-      <span><%= error.file_name %></span>
-      <% if error.line_number %>
-        <span>[line <strong><%= error.line_number %></strong>]</span>
-      <% end %>
+    <div class="flex-none px-8 py-6 mb-8 border-t border-b border-red-200 bg-red-100 text-base font-mono leading-relaxed">
+      <pre class="whitespace-pre-wrap font-sans leading-tight text-red-900"><%= error.message %></pre>
     </div>
-  <% end %>
 
-  <% if error.source_code %>
-  <div class="prose max-w-full mx-8">
-      <%= code error.file_lang, highlight_lines: [error.source_code[:highlighted_line]],
-        line_numbers: true,
-        start_line: error.source_code[:start_line],
-        strip: false,
-        class: "py-4 !max-w-full !border-red-200 !mt-1" do %><%= h(error.source_code[:code]) %><% end %>
-  </div>
-  <% end %>
+    <% if error.file_name %>
+      <div class="text-sm mx-8 mb-2 font-mono">
+        <span><%= error.file_name %></span>
+        <% if error.line_number %>
+          <span>[line <strong><%= error.line_number %></strong>]</span>
+        <% end %>
+      </div>
+    <% end %>
 
-  <h3 class="font-bold mb-4 px-8 mt-8 flex-none">Full stack trace</h3>
-  <div class="text-xs font-mono flex-grow h-full overflow-hidden">
-    <div class="h-full overflow-auto px-8 pb-10 text-gray-400 leading-relaxed">
-      <% error.backtrace.each do |line| %>
-        <div class="hover:text-gray-900 transition-colors duration-100">
-          <%= line %>
-        </div>
-      <% end %>
+    <% if error.source_code %>
+      <div class="mx-8 border border-red-200 max-w-screen-lg">
+        <%= render_component :code,
+          language: error.file_lang,
+          highlight_lines: [error.source_code[:highlighted_line]],
+          start_line: error.source_code[:start_line],
+          line_numbers: true do %><%= h(error.source_code[:code]) %><% end %>
+      </div>
+    <% end %>
+
+    <h3 class="font-bold mb-2 px-8 py-2 mt-8 sticky top-0 bg-red-50">Full stack trace:</h3>
+    <div class="text-xs font-mono">
+      <div class="px-8 pb-10 text-gray-400 leading-relaxed">
+        <% error.backtrace.each do |line| %>
+          <div class="hover:text-gray-900 transition-colors duration-100">
+            <%= line %>
+          </div>
+        <% end %>
+      </div>
     </div>
   </div>
 </div>
\ No newline at end of file