notedeck

One damus client to rule them all
git clone git://jb55.com/notedeck
Log | Files | Refs | README | LICENSE

index.html (4523B)


      1 <!DOCTYPE html>
      2 <html>
      3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      4 
      5 <!-- Disable zooming: -->
      6 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
      7 
      8 <head>
      9     <!-- change this to your project name -->
     10     <title>domus</title>
     11 
     12     <!-- config for our rust wasm binary. go to https://trunkrs.dev/assets/#rust for more customization -->
     13     <link data-trunk rel="rust" data-wasm-opt="2" />
     14     <!-- this is the base url relative to which other urls will be constructed. trunk will insert this from the public-url option -->
     15     <base data-trunk-public-url />
     16 
     17     <link data-trunk rel="icon" href="assets/favicon.ico">
     18 
     19 
     20     <link data-trunk rel="copy-file" href="assets/sw.js" />
     21     <link data-trunk rel="copy-file" href="assets/manifest.json" />
     22     <link data-trunk rel="copy-file" href="assets/icon-1024.png" />
     23     <link data-trunk rel="copy-file" href="assets/icon-256.png" />
     24     <link data-trunk rel="copy-file" href="assets/icon_ios_touch_192.png" />
     25     <link data-trunk rel="copy-file" href="assets/maskable_icon_x512.png" />
     26 
     27 
     28     <link rel="manifest" href="manifest.json">
     29     <link rel="apple-touch-icon" href="icon_ios_touch_192.png">
     30     <meta name="theme-color" media="(prefers-color-scheme: light)" content="white">
     31     <meta name="theme-color" media="(prefers-color-scheme: dark)" content="#404040">
     32 
     33     <style>
     34         html {
     35             /* Remove touch delay: */
     36             touch-action: manipulation;
     37         }
     38 
     39         body {
     40             /* Light mode background color for what is not covered by the egui canvas,
     41             or where the egui canvas is translucent. */
     42             background: #909090;
     43         }
     44 
     45         @media (prefers-color-scheme: dark) {
     46             body {
     47                 /* Dark mode background color for what is not covered by the egui canvas,
     48                 or where the egui canvas is translucent. */
     49                 background: #404040;
     50             }
     51         }
     52 
     53         /* Allow canvas to fill entire web page: */
     54         html,
     55         body {
     56             overflow: hidden;
     57             margin: 0 !important;
     58             padding: 0 !important;
     59             height: 100%;
     60             width: 100%;
     61         }
     62 
     63         /* Position canvas in center-top: */
     64         canvas {
     65             margin-right: auto;
     66             margin-left: auto;
     67             display: block;
     68             position: absolute;
     69             top: 0%;
     70             left: 50%;
     71             transform: translate(-50%, 0%);
     72         }
     73 
     74         .centered {
     75             margin-right: auto;
     76             margin-left: auto;
     77             display: block;
     78             position: absolute;
     79             top: 50%;
     80             left: 50%;
     81             transform: translate(-50%, -50%);
     82             color: #f0f0f0;
     83             font-size: 24px;
     84             font-family: Ubuntu-Light, Helvetica, sans-serif;
     85             text-align: center;
     86         }
     87 
     88         /* ---------------------------------------------- */
     89         /* Loading animation from https://loading.io/css/ */
     90         .lds-dual-ring {
     91             display: inline-block;
     92             width: 24px;
     93             height: 24px;
     94         }
     95 
     96         .lds-dual-ring:after {
     97             content: " ";
     98             display: block;
     99             width: 24px;
    100             height: 24px;
    101             margin: 0px;
    102             border-radius: 50%;
    103             border: 3px solid #fff;
    104             border-color: #fff transparent #fff transparent;
    105             animation: lds-dual-ring 1.2s linear infinite;
    106         }
    107 
    108         @keyframes lds-dual-ring {
    109             0% {
    110                 transform: rotate(0deg);
    111             }
    112 
    113             100% {
    114                 transform: rotate(360deg);
    115             }
    116         }
    117 
    118     </style>
    119 </head>
    120 
    121 <body>
    122     <!-- The WASM code will resize the canvas dynamically -->
    123     <!-- the id is hardcoded in main.rs . so, make sure both match. -->
    124     <canvas id="the_canvas_id"></canvas>
    125 
    126     <!--Register Service Worker. this will cache the wasm / js scripts for offline use (for PWA functionality). -->
    127     <!-- Force refresh (Ctrl + F5) to load the latest files instead of cached files  -->
    128     <script>
    129         // We disable caching during development so that we always view the latest version.
    130         if ('serviceWorker' in navigator && window.location.hash !== "#dev") {
    131             window.addEventListener('load', function () {
    132                 navigator.serviceWorker.register('sw.js');
    133             });
    134         }
    135     </script>
    136 </body>
    137 
    138 </html>
    139 
    140 <!-- Powered by egui: https://github.com/emilk/egui/ -->