Packages

novdom_dev_tools

0.2.0
0.4.0 0.3.1 0.3.0 0.2.2 0.2.1 0.2.0 0.1.0

Development Tooling and CLI for the novdom framework.

HexDocs

Current section

Files

Jump to
Readme
7 Versions
20 Dependencies
Dependants
Files
Activity
novdom_dev_tools priv template index.html
Raw

priv/template/index.html 

<!DOCTYPE html>

<html lang="en">

  <head>

    <meta charset="UTF-8" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    

    <title>🚧 {app_name}</title>

    

    <!-- Remove this if you dont use TailwindCSS integration -->

    <link rel="stylesheet" type="text/css" href="./{app_name}.css" />

    <script type="module" src="./{app_name}.mjs"></script>

  </head>



  <body>

    <div id="_unrendered_" hidden></div>

    <div id="_app_"></div>

    <div id="_drag_"></div>

  </body>



  <style>

    html,

    body,

    #_app_,

    #_drag_ {

      height: 100%;

      margin: 0;

      padding: 0;

    }

    #_drag_ {

      position: fixed;

      height: 100%;

      width: 100%;

      top: 0;

      left: 0;

      background: transparent;

      pointer-events: none;



      --mouse-x: 0;

      --mouse-y: 0;

    }

  </style>



  <script>

    const drag = document.getElementById("_drag_")



    const mousemove = (e) => {

      drag.style.setProperty("--mouse-x", e.clientX + "px")

      drag.style.setProperty("--mouse-y", e.clientY + "px")

    }



    document.addEventListener("mousemove", mousemove)

  </script>

</html>