frontend/index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <!-- Favicons -->
    <link rel="icon" href="<%= PUBLIC_PATH %>/favicon/favicon.svg" type="image/svg+xml" />
    <link rel="apple-touch-icon" href="<%= PUBLIC_PATH %>/favicon/apple-touch-icon.png" />
    <link rel="manifest" href="<%= PUBLIC_PATH %>/manifest.json" />

    <title>Kafbat UI</title>
    <script type="text/javascript">
      window.basePath = '<%= PUBLIC_PATH %>';

      window.__assetsPathBuilder = function (importer) {
        return window.basePath+ "/" + importer;
      };
    </script>
    <style>
      @font-face {
        font-family: 'Inter';
        src: url('<%= PUBLIC_PATH %>/fonts/Inter-Medium.ttf') format('truetype');
        font-weight: 500;
        font-display: swap;
      }

      @font-face {
        font-family: 'Inter';
        src: url('<%= PUBLIC_PATH %>/fonts/Inter-Regular.ttf') format('truetype');
        font-weight: 400;
        font-display: swap;
      }

      @font-face {
        font-family: 'Roboto Mono';
        src: url('<%= PUBLIC_PATH %>/fonts/RobotoMono-Medium.ttf') format('truetype');
        font-weight: 500;
        font-display: swap;
      }

      @font-face {
        font-family: 'Roboto Mono';
        src: url('<%= PUBLIC_PATH %>/fonts/RobotoMono-Regular.ttf') format('truetype');
        font-weight: 400;
        font-display: swap;
      }
    </style>
  </head>

  <body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
    <script type="module" src="/src/index.tsx"></script>
  </body>
</html>