Update

app.py

@@ -23,20 +23,20 @@ examples_data = [
         "screencoder/data/input/test1.png"
     ],
     [
-        "screencoder/data/input/test2.png",
+        "screencoder/data/input/test3.png",
         "",
         "",
         "",
         "",
-        "screencoder/data/input/test2.png"
+        "screencoder/data/input/test3.png"
     ],
     [
-        "screencoder/data/input/test3.png",
+        "screencoder/data/input/draft.png",
         "",
         "",
         "",
         "",
-        "screencoder/data/input/test3.png"
+        "screencoder/data/input/draft.png"
     ],
 ]
 example_rows = [row[:5] for row in examples_data]

screencoder/image_replacer.py

@@ -99,7 +99,7 @@ def main():
     soup = BeautifulSoup(html_content, 'html.parser')
 
     # 1. Find all placeholder elements by their class, in document order.
-    placeholder_elements = soup.find_all('img', src="placeholder.png")
+    placeholder_elements = soup.find_all(class_='bg-gray-400')
 
     # 2. Get the placeholder IDs from the mapping file in the correct, sorted order.
     def natural_sort_key(s):
@@ -132,10 +132,18 @@ def main():
         # Debug: Print the path being used
         print(f"Setting image path for {ph_id}: {relative_img_path}")
         
-        # --- Update the img tag's src attribute ---
-        # Since we're now working with img tags instead of div tags,
-        # we just need to update the src attribute
-        ph_element['src'] = relative_img_path
+        # --- Convert div with bg-gray-400 class to img tag ---
+        # Create a new img element
+        new_img = soup.new_tag('img')
+        new_img['src'] = relative_img_path
+        new_img['class'] = ph_element.get('class', [])
+        # Remove bg-gray-400 class and add appropriate image classes
+        if 'bg-gray-400' in new_img['class']:
+            new_img['class'].remove('bg-gray-400')
+        new_img['class'].extend(['w-full', 'h-full', 'object-cover'])
+        
+        # Replace the div element with the new img element
+        ph_element.replace_with(new_img)
 
     # Save the modified HTML
     final_html_path.write_text(str(soup))