xevion/rust-sdl2-emscripten
1
0
Fork 0
mirror of https://github.com/Xevion/rust-sdl2-emscripten.git synced 2025-12-07 20:08:20 -06:00
Code Issues Packages Projects Releases 1 Wiki Activity

Add tailwindcss, revamp index with details

Browse Source
This commit is contained in:
Xevion
2024-04-23 19:45:48 -05:00
parent e4334ece7a
commit b00df74158
9 changed files with 1548 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
assets/index.html
View File

@@ -1,27 +1,52 @@
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<style>
body {
margin: 0;
padding: 0;
background: #000;
}
canvas {
display: block;
margin: 0 auto;
background: #000;
}
</style>
<body>
<canvas id="canvas"></canvas>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="/build.css" />
</head>
<body class="m-0 p-0 bg-black text-white">
<div class="max-w-screen-md mx-auto mt-10">
<h1 class="text-xl lowercase my-1">
<span class="px-1 rounded font-mono bg-zinc-900 border border-zinc-700"
>rust-sdl2-emscripten</span
>
</h1>
<p class="ml-5">
This is a demo of a simple program written in Rust using the SDL2
library and compiled to WebAssembly using Emscripten. The game loop is
implemented directly in Rust and uses Emscripten's Asyncify feature, as
well as hooks to
</p>
<canvas id="canvas" class="rounded border border-white/25 my-4"></canvas>
<div class="mt-2 mx-3">
<div class="mt-2 mx-3">
<h2 class="text-xl font-mono lowercase">Notes</h2>
<p class="ml-5">
This demo uses all four SDL2 extensions; Image, Mixer, TTF, and GFX.
</p>
<h2 class="text-xl font-mono mt-1 lowercase">Controls</h2>
<ul class="ml-5 *:my-1">
<li>
<span class="code">&larr; &uarr; &rarr; &darr;</span>
Move Sprite
</li>
<li>
<span class="code">space</span>
Change Sprite
</li>
<li>
<span class="code">shift + &uarr;&darr;</span>
Change Volume
</li>
</ul>
</div>
</div>
</div>
<script type="text/javascript">
var Module = {
'canvas': document.getElementById('canvas'),
};
var Module = {
canvas: document.getElementById("canvas"),
};
</script>
<script type="text/javascript" src="pacman.js"></script>
</body>
</html>
</body>
</html>

21
assets/styles.scss Normal file
View File

@@ -0,0 +1,21 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
@font-face {
font-family: "Liberation Mono";
src:
url("LiberationMono.woff2") format("woff2"),
url("LiberationMono.woff") format("woff");
font-weight: normal;
font-style: normal;
font-display: swap;
}
canvas {
@apply w-full h-full block mx-auto bg-black;
}
.code {
@apply px-1 rounded font-mono bg-zinc-900 border border-zinc-700
}