index.html - iuna - iuna - experimental mainnet-candidate protocol

index.html (2920B)
      1 <!doctype html>
      2 <html lang="en">
      3 <head>
      4   <meta charset="utf-8">
      5   <meta name="viewport" content="width=device-width, initial-scale=1">
      6   <title>iuna</title>
      7   <style>
      8     :root {
      9       color-scheme: dark;
     10       font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
     11       background: #101214;
     12       color: #f4f0e8;
     13     }
     14 
     15     html {
     16       width: 100%;
     17       height: 100%;
     18       overflow: hidden;
     19     }
     20 
     21     body {
     22       width: 100%;
     23       height: 100%;
     24       min-height: 100%;
     25       margin: 0;
     26       display: grid;
     27       place-items: center;
     28       overflow: hidden;
     29       background:
     30         radial-gradient(circle at 50% 20%, rgba(219, 182, 109, 0.14), transparent 34rem),
     31         linear-gradient(180deg, #151719 0%, #0d0f10 100%);
     32     }
     33 
     34     main {
     35       width: min(26rem, calc(100vw - 3rem));
     36       text-align: center;
     37     }
     38 
     39     .mark {
     40       width: 4.25rem;
     41       height: 4.25rem;
     42       margin: 0 auto 1.5rem;
     43       border-radius: 1.25rem;
     44       display: grid;
     45       place-items: center;
     46       background: linear-gradient(145deg, #dcb16a, #f4e5bd 48%, #8a5c2f);
     47       color: #151719;
     48       font-size: 2rem;
     49       font-weight: 800;
     50       box-shadow: 0 1.5rem 3rem rgba(0, 0, 0, 0.28);
     51     }
     52 
     53     .mark svg {
     54       width: 2.65rem;
     55       height: 2.65rem;
     56     }
     57 
     58     .mark-loop {
     59       fill: none;
     60       stroke: currentColor;
     61       stroke-width: 4.2;
     62       stroke-linecap: round;
     63       stroke-linejoin: round;
     64     }
     65 
     66     .mark-dot {
     67       fill: currentColor;
     68     }
     69 
     70     h1 {
     71       margin: 0;
     72       font-size: 1.5rem;
     73       font-weight: 750;
     74       letter-spacing: 0;
     75     }
     76 
     77     p {
     78       margin: 0.75rem 0 0;
     79       color: rgba(244, 240, 232, 0.72);
     80       line-height: 1.55;
     81     }
     82 
     83     .status {
     84       margin-top: 1.5rem;
     85       font-size: 0.86rem;
     86       color: rgba(244, 240, 232, 0.58);
     87     }
     88 
     89   </style>
     90 </head>
     91 <body>
     92   <main>
     93     <div class="mark" aria-hidden="true">
     94       <svg viewBox="0 0 32 32" focusable="false">
     95         <circle class="mark-dot" cx="9.4" cy="7.6" r="2.8"></circle>
     96         <path class="mark-loop" d="M9.4 13v7.1c0 3.7 2.9 6.4 6.6 6.4s6.6-2.7 6.6-6.4V13"></path>
     97       </svg>
     98     </div>
     99     <h1>Starting iuna</h1>
    100     <p>The local node is starting. The management UI opens here when it is ready.</p>
    101     <div id="status" class="status">Waiting for http://127.0.0.1:18661</div>
    102   </main>
    103   <script>
    104     const managementUrl = "http://127.0.0.1:18661/";
    105     const statusEl = document.getElementById("status");
    106     let attempts = 0;
    107 
    108     async function waitForNode() {
    109       attempts += 1;
    110       try {
    111         await fetch(managementUrl, { method: "GET", mode: "no-cors", cache: "no-store" });
    112         window.location.replace(managementUrl);
    113       } catch (error) {
    114         statusEl.textContent = `Waiting for ${managementUrl} (${attempts})`;
    115         window.setTimeout(waitForNode, 700);
    116       }
    117     }
    118 
    119     waitForNode();
    120   </script>
    121 </body>
    122 </html>