<!DOCTYPE html>
<html>
  <head>
    <title>OnSign TV App Simulator</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.6.2/css/bootstrap.min.css"
      integrity="sha512-rt/SrQ4UNIaGfDyEXZtNcyWvQeOq0QLygHluFQcSjaGB04IxWhal71tKuzP6K8eYXYB6vJV4pHkXcmFGGQ1/0w=="
      crossorigin="anonymous" referrerpolicy="no-referrer" />
    <style>
      #_playback_info { font-family: monospace; }
    </style>
  </head>
  <body class="container" style="margin-top: 20px;">
    {% block content %}{% endblock %}

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jscolor/2.4.6/jscolor.js" integrity="sha512-kxGIAF0FpORyJloyjkwKb7bKVM3fXz4OiWn+W+KlXq2J3IttrkdBKaY3Z8DNu84NbQOnRMyszFKCFTmx3LAO9g==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script type="text/javascript">
      (function() {
        'use strict';
        jscolor.presets.default.alpha = true;
        jscolor.presets.default.format = 'hexa';
        jscolor.ready(function() {
          document.querySelectorAll('[data-jscolor]').forEach(function(input) {
            var initialValue = input.getAttribute('value');
            if (initialValue === '') {
              input.value = '';
            }
          });
        });
      })();
    </script>
  </body>
</html>
