trezor-firmware/core/tools/dialog-designer/index.html

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Trezor Dialog Designer</title>
  <link href="https://fonts.googleapis.com/css2?family=Roboto+Mono:wght@400;700&family=Roboto:wght@400;700&display=swap" rel="stylesheet">
</head>
<body>
  <table>
  <tr><td>Title:</td><td><input id="title" value="SD card protection"></td><td rowspan="7"><canvas id="canvas" width="240" height="240" style="margin: 10px; background: black;"></canvas></td></tr>
  <tr><td>Line 1:</td><td><input id="line1" value="Do you really want to"><input type="checkbox" id="bold_line1"><input type="checkbox" id="mono_line1"></td></tr>
  <tr><td>Line 2:</td><td><input id="line2" value="secure your device with"><input type="checkbox" id="bold_line2"><input type="checkbox" id="mono_line2"></td></tr>
  <tr><td>Line 3:</td><td><input id="line3" value="SD card protection?"><input type="checkbox" id="bold_line3"><input type="checkbox" id="mono_line3"></td></tr>
  <tr><td>Line 4:</td><td><input id="line4" value=""><input type="checkbox" id="bold_line4"><input type="checkbox" id="mono_line4"></td></tr>
  <tr><td>Line 5:</td><td><input id="line5" value=""><input type="checkbox" id="bold_line5"><input type="checkbox" id="mono_line5"></td></tr>
  <tr><td>Confirm:</td><td><input id="confirm" value=""></td></tr>
  </table>
  <!-- keep these lines here so the fonts are preloaded -->
  <div style="font-size: 20px; font-family: 'Roboto';"> </div>
  <div style="font-size: 20px; font-family: 'Roboto'; font-weight: bold;"> </div>
  <div style="font-size: 20px; font-family: 'Roboto Mono';"> </div>
  <div style="font-size: 20px; font-family: 'Roboto Mono'; font-weight: bold;"> </div>
  <script src="script.js"></script>
</body>
</html>