JSFiddle - React, Tailwind, and code Playground
by Paweł Niemczyk
HTML
<div style="color-scheme:light dark;">\n <h2 style="font-family:Arial,sans-serif;">Document Processing Report</h2>\n \n <table style="font-family:Arial,sans-serif;border-collapse:collapse;width:100%;margin-bottom:16px;border:1px solid #ddd;">\n <tr><th style="padding:4px 8px;border:1px solid #ddd;text-align:left;background:#f7f7f7;font-weight:bold;">S3</th><td style="padding:4px 8px;border:1px solid #ddd;text-align:left;"><span style="display:inline-block;padding:2px 6px;border-radius:4px;background:#007bff;color:#fff;font-size:12px;font-weight:600;">security</span> <code>undefined</code></td></tr>\n <tr><th style="padding:4px 8px;border:1px solid #ddd;text-align:left;background:#f7f7f7;font-weight:bold;">Elements</th><td style="padding:4px 8px;border:1px solid #ddd;text-align:left;">1 <span style="display:inline-block;padding:2px 6px;border-radius:4px;background:#17a2b8;color:#fff;font-size:12px;font-weight:600;">PDF</span></td></tr>\n <tr><th style="padding:4px 8px;border:1px solid #ddd;text-align:left;background:#f7f7f7;font-weight:bold;">Status</th><td style="padding:4px 8px;border:1px solid #ddd;text-align:left;;color:#28a745;font-weight:bold;">✔ all uploaded</td></tr>\n </table>\n <h3 style="font-family:Arial,sans-serif;">Details</h3>\n \n <table style="font-family:Arial,sans-serif;border-collapse:collapse;width:100%;margin-bottom:16px;border:1px solid #ddd;">\n <tr><th style="padding:4px 8px;border:1px solid #ddd;text-align:left;background:#f7f7f7;font-weight:bold;">File</th><td style="padding:4px 8px;border:1px solid #ddd;text-align:left;">TwojeDokumenty_mcrqo0qu_1ee4br2.pdf <span style="display:inline-block;padding:2px 6px;border-radius:4px;background:#6c757d;color:#fff;font-size:12px;font-weight:600;">121 kB</span> <span style="display:inline-block;padding:2px 6px;border-radius:4px;background:#17a2b8;color:#fff;font-size:12px;font-weight:600;">PDF</span></td></tr>\n <tr><th...