packages/react-devtools-shell/multi.html (56 lines of code) (raw):

<!doctype html> <html> <head> <meta charset="utf8"> <title>React DevTools</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> * { box-sizing: border-box; } body { display: flex; flex-direction: row; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol; font-size: 12px; line-height: 1.5; } .column { display: flex; flex-direction: column; flex: 1 1 50%; } .column:first-of-type { border-right: 1px solid #3d424a; } .iframe { height: 50%; flex: 0 0 50%; border: none; } .devtools { height: 50%; flex: 0 0 50%; } </style> </head> <body> <div class="column left-column"> <iframe id="iframe-left" class="iframe"></iframe> <div id="devtools-left" class="devtools"></div> </div> <div class="column"> <iframe id="iframe-right" class="iframe"></iframe> <div id="devtools-right" class="devtools"></div> </div> <script src="dist/multi-devtools.js"></script> </body> </html>