Files
nix-files/hosts/by-name/servo/services/nginx/waka.laka.osaka/index.html

47 lines
1.2 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width initial-scale=1" />
<meta name="description" content="Waka Laka (for Osaka)" />
<title>Waka Laka (for Osaka)</title>
<style>
html,body {
width: 100%;
height: 100%;
max-width: 100%;
max-height: 100%;
}
* {
margin: 0px;
padding: 0px;
border: 0px;
}
.bg-image {
width: 100%;
height: 100%;
min-width: 100%;
min-height: 100%;
position: fixed;
background-repeat: no-repeat;
background-position: 50% 50%;
background-size: contain;
}
body {
background-color: #000000;
}
</style>
</head>
<body>
<!-- TODO: how to autoplay video _without_ it being muted? -->
<video class="bg-image" id="waka-video" width="1440" height="1080"
autoplay loop muted
onclick="document.getElementById('waka-video').muted = !document.getElementById('waka-video').muted;"
>
<!-- from https://www.youtube.com/watch?v=ehB_7bBKprY -->
<!-- original and more info at https://www.aquilinestudios.org/wakalaka.html -->
<source src="waka.laka.for.osaka.mp4" type="video/mp4">
</video>
</body>
</html>