Samples navigation

guillaumeblanc · Nov 10, 2023 · 13fdc45 · 13fdc45
1 parent d48902e
commit 13fdc45
Show file tree

Hide file tree

Showing 3 changed files with 50 additions and 4 deletions.
diff --git a/samples/site/index.html b/samples/site/index.html
@@ -1,6 +1,6 @@
 <!DOCTYPE html>
 <html>
-<title>W3.CSS</title>
+<title>Flip samples</title>
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
 <link rel="stylesheet" href="https://www.w3schools.com/lib/w3-theme-indigo.css">

diff --git a/samples/site/index2.html b/samples/site/index2.html
@@ -0,0 +1,46 @@
+<!DOCTYPE html>
+<html>
+<title>Flip samples</title>
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
+<style type="text/css">
+    .nav {
+        position: absolute;
+        bottom: 10px;
+        margin-top: 0px;
+        padding-left: 10px;
+    }
+</style>
+
+<body>
+
+    <div id="sidebar" class="w3-sidebar w3-bar-block w3-animate-left" style="display:none">
+        <button class="w3-bar-item w3-button w3-large" onclick="w3_close()">Close &times;</button>
+        sdfsdfsdc
+    </div>
+
+    <div id="main">
+        <div class="nav" style=" z-index:1;">
+            </span><button id="nav" class="w3-button w3-xlarge w3-text-white" onclick="w3_open()">&#9776;</button>
+        </div>
+        <iframe style="position:fixed; top:0; bottom:0; height:100%; width:100%; overflow:hidden;" class="w3-border-0"
+            src="https://guillaumeblanc.github.io/flip/texture/"></iframe>
+    </div>
+
+    <script>
+        function w3_open() {
+            document.getElementById("main").style.marginLeft = "200px";
+            document.getElementById("sidebar").style.width = "200px";
+            document.getElementById("sidebar").style.display = "block";
+            document.getElementById("nav").style.display = 'none';
+        }
+        function w3_close() {
+            document.getElementById("main").style.marginLeft = "0%";
+            document.getElementById("sidebar").style.display = "none";
+            document.getElementById("nav").style.display = "inline-block";
+        }
+    </script>
+
+</body>
+
+</html>
diff --git a/src/wasm.html b/src/wasm.html
@@ -1,8 +1,8 @@
-<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
-<html>
+<!doctype html>
+<html lang="en">
 
 <head>
-    <meta charset="UTF-8" />
+    <meta charset="utf-8" />
     <title>${FLIP_TARGET_NAME}</title>
     <style type="text/css">
         body {