vueify OIDC device views

This commit is contained in:
Johannes Zellner
2026-03-18 10:58:00 +01:00
parent e3d76ea9f4
commit 9633036887
10 changed files with 224 additions and 82 deletions

View File

@@ -1,27 +1,16 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Sign-in</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<style>
body { font-family: system-ui, sans-serif; margin-top: 25px; margin-bottom: 25px; }
h1, h1+p { font-weight: 100; text-align: center; }
.container { padding: 0 40px 10px; width: 274px; background-color: #f7f7f7; margin: 0 auto 10px; border-radius: 2px; box-shadow: 0 2px 2px rgba(0,0,0,.3); overflow: hidden; }
h1 { font-size: 2.3em; }
p.red { color: #d50000; }
input[type=text] { height: 44px; font-size: 16px; width: 100%; margin-bottom: 10px; background: #fff; border: 1px solid #d9d9d9; border-top: 1px solid silver; padding: 0 8px; box-sizing: border-box; text-transform: uppercase; text-align: center; }
input[type=text]::placeholder { text-transform: none; }
[type=submit] { width: 100%; display: block; margin-bottom: 10px; text-align: center; font-size: 14px; font-weight: 700; height: 36px; padding: 0 8px; border: 0; color: #fff; background-color: #4d90fe; cursor: pointer; }
[type=submit]:hover { background-color: #357ae8; }
</style>
</head>
<body>
<div class="container">
<h1>Sign-in</h1>
<%- message %>
<%- form %>
<button type="submit" form="op.deviceInputForm">Continue</button>
</div>
</body>
<head>
<title><%= name %> OpenID Device Sign-in</title>
<script>
window.cloudron = <%- JSON.stringify({ message, form }) %>;
</script>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/oidcdeviceinput.js"></script>
</body>
</html>