commit: 7c0ebbd0a2a9306b7b1ca1cac145054a14f518b7 parent 4001eb21012025bee8b9b37f812fad62b92cca31 Author: Haelwenn (lanodan) Monnier <contact@hacktivis.me> Date: Mon, 25 Apr 2022 21:03:44 +0200 ibniz.css: Add stylesheetDiffstat:
| A | ibniz.css | 37 | +++++++++++++++++++++++++++++++++++++ |
| M | ibniz.html | 72 | ++++++++++++++++++++++++++++++++++++++---------------------------------- |
2 files changed, 75 insertions(+), 34 deletions(-)
diff --git a/ibniz.css b/ibniz.css @@ -0,0 +1,37 @@ +:root { + color-scheme: black; + color: #FFF; + background-color: #000; +} +/* <https://github.com/whatwg/html/issues/5426#issuecomment-607286557> */ +@supports (color-scheme: black) { + a { color: violet; } +} +html, body, main { + margin: 0; + padding: 0; +} +main { + width: 100vw; + height: 100vh; + display: flex; +} +@media (max-aspect-ratio: 1/1) { + main { + flex-direction: column; + } +} +textarea { + border: none; + color: #FFF; + background-color: #111; + width: 100%; + height: 100%; + font-family: monospace; +} +#ibniz { + width: 100%; + height: 100%; + object-fit: contain; + image-rendering: optimizeQuality; +} diff --git a/ibniz.html b/ibniz.html @@ -1,40 +1,44 @@ +<!DOCTYPE html> <html> <head> -<title>IBNIZ-js</title> + <title>IBNIZ-js</title> + <meta charset="utf-8"/> + <link rel="stylesheet" href="./ibniz.css"/> </head> <body> -<canvas id="ibniz" width="256" height="256"> -Why u no canvas -</canvas><br> -<form> - <input type="text" id="code" style="width: 256px"><br> -<input type="checkbox" id="pause">Pause <input type="checkbox" id="simpleGetPut">Simple memory access<br> -<input type="checkbox" id="halfRes">Half resolution<br> -<input type="checkbox" id="useAudio">Audio (experimental, firefox/chrome/safari)<br> -<input type="checkbox" id="recalcAudio">More accurate audio (slightly slower)<br> -Load: <select id="example_apps"> -<option value=""></option> -<option value="^x7r+Md8r&">Munching squares</option> -<option value="sv5rvs--">Plasma</option> -<option value="v8rsdv*vv*^">XOR texture zoomer</option> -<option value="8rw10r%w18r%">FreeFull - opening gate</option> -<option value="sxsaxAr+waxBr+^">FreeFull - spinny</option> -<option value="axp wvvx3r40/&^^ wd*xd*+qq1x/sx8r++ 30FF|">FreeFull - rose</option> -<option value="8rw10raw8r+w18r^">FreeFull - xorwiggle</option> -<option value="v8rsdv*vv*^wpp8r-">Munching zoomer</option> -<option value="ax8r+3lwd*xd*+q1x/x5r+^">Texture tunnel</option> -<option value="v8rds4X3)Lx~2Xv*vv*+i!L1@2@^">Rotozoomer</option> -<option value="sa*">bubsy - looks funny after a while</option> -<option value="d4rr">asiekierka - 4-char demo</option> -<option value="w8r-sqwqd*&w1~&+">asiekierka - glass</option> -<option value="6{^^ddd***1%}5{v8rsdv*vv*^wpp8r-}4{v8rdsx.6+s4X3)Lx~2Xv*vv*+i!L1@2@^}3{ax8r+3lwd*xd*+q1x/x6r+^}2)6r3&3+V55A9^Md6r|5*wdAr&+">viznut - ibnizdemo.ib</option> -<option value="axCr3ls3r+43lwd*xd*+q1x/x7r+^1%w^x20r8l+^M3*w5r&w5*w9r&w2*w6r&||">FreeFull - christmas demo</option> -</select> -</form> -<div id="fps"><b>FPS:</b> [loading...]</div> -<b>IBNIZ-js 0.C</b><br> -<a href="https://github.com/asiekierka/ibnjs">Github repository</a><br> -<a href="mailto:asiekierka@gmail.com">Contact</a><br> -<script type="text/javascript" src="./ibniz.js"></script> + <main> + <canvas id="ibniz" width="256" height="256">Your browser lacks support for the canvas element</canvas> + <textarea id="code"></textarea> + </main> + <form> + <label><input type="checkbox" id="pause">Pause</label><br /> + <label><input type="checkbox" id="simpleGetPut">Simple memory access</label><br /> + <label><input type="checkbox" id="halfRes">Half resolution</label><br /> + <label><input type="checkbox" id="useAudio">Audio (experimental, requires WebAudio)</label><br /> + <label><input type="checkbox" id="recalcAudio">More accurate audio (slightly slower)</label><br /> + Load: <select id="example_apps"> + <option value=""></option> + <option value="^x7r+Md8r&">Munching squares</option> + <option value="sv5rvs--">Plasma</option> + <option value="v8rsdv*vv*^">XOR texture zoomer</option> + <option value="8rw10r%w18r%">FreeFull - opening gate</option> + <option value="sxsaxAr+waxBr+^">FreeFull - spinny</option> + <option value="axp wvvx3r40/&^^ wd*xd*+qq1x/sx8r++ 30FF|">FreeFull - rose</option> + <option value="8rw10raw8r+w18r^">FreeFull - xorwiggle</option> + <option value="v8rsdv*vv*^wpp8r-">Munching zoomer</option> + <option value="ax8r+3lwd*xd*+q1x/x5r+^">Texture tunnel</option> + <option value="v8rds4X3)Lx~2Xv*vv*+i!L1@2@^">Rotozoomer</option> + <option value="sa*">bubsy - looks funny after a while</option> + <option value="d4rr">asiekierka - 4-char demo</option> + <option value="w8r-sqwqd*&w1~&+">asiekierka - glass</option> + <option value="6{^^ddd***1%}5{v8rsdv*vv*^wpp8r-}4{v8rdsx.6+s4X3)Lx~2Xv*vv*+i!L1@2@^}3{ax8r+3lwd*xd*+q1x/x6r+^}2)6r3&3+V55A9^Md6r|5*wdAr&+">viznut - ibnizdemo.ib</option> + <option value="axCr3ls3r+43lwd*xd*+q1x/x7r+^1%w^x20r8l+^M3*w5r&w5*w9r&w2*w6r&||">FreeFull - christmas demo</option> + </select> + </form> + <div id="fps"><b>FPS:</b> [loading...]</div> + <b>IBNIZ-js 0.C</b><br> + <a href="https://github.com/asiekierka/ibnjs">Github repository</a><br> + <a href="mailto:asiekierka@gmail.com">Contact</a><br> + <script type="text/javascript" src="./ibniz.js"></script> </body> </html>