folk-canvas/website/canvas/radial-space.html

45 lines
1.2 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Shapes</title>
<style>
html {
width: 100%;
height: 100%;
position: fixed;
overflow: hidden;
}
body {
min-height: 100%;
position: relative;
margin: 0;
}
folk-shape {
background: rgb(189, 184, 181);
}
folk-space-radial {
width: 700px;
height: 700px;
}
</style>
</head>
<body>
<folk-shape id="0" x="0" y="100" width="50" height="50"></folk-shape>
<folk-shape id="1" x="0" y="200" width="50" height="50"></folk-shape>
<folk-shape id="2" x="20" y="300" width="50" height="50" rotation="45"></folk-shape>
<folk-shape id="3" x="20" y="400" width="50" height="50" rotation="45"></folk-shape>
<folk-shape id="4" x="20" y="500" width="50" height="50" rotation="45"></folk-shape>
<folk-space-radial sources="folk-shape"> </folk-space-radial>
<script type="module">
import '@labs/standalone/folk-shape.ts';
import '@labs/standalone/folk-space-radial.ts';
</script>
</body>
</html>