loled/static/display/index.html
2023-10-31 19:44:06 +01:00

59 lines
1.3 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>LOLED - Display</title>
<style>
body {
font-family: monospace;
color: white;
background: black;
overflow: hidden;
max-width: 100vw;
max-height: 100vh;
margin: 0;
padding: 0;
}
#display {
position: relative;
}
#display-name {
width: var(--display-height);
transform-origin: 0 0;
transform: rotate(90deg) translateY(-100%);
position: absolute;
top: 0;
left: 0;
font-size: 1.3rem;
text-align: left;
margin: 0;
padding: 5px 15px;
z-index: 1000;
font-weight: bold;
}
#display-video {
width: 100%;
height: 100%;
object-fit: cover;
opacity: 0.75;
}
</style>
</head>
<body>
<main id="display">
<p id="display-name">LOLED<br/>http://10.0.0.28/</p>
<video id="display-video" muted></video>
</main>
<script type="module" src="../js/display.js"></script>
</body>
</html>