public/hass-oidc-auth
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Reimplement UI injection (#236)

Browse Source
This commit is contained in:
Christiaan Goossens
2026-04-13 22:51:31 +02:00
committed by GitHub
parent fdc93e2719
commit fd3643685d
36 changed files with 3772 additions and 1114 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
custom_components/auth_oidc/views/templates/finish.html
View File

@@ -4,28 +4,63 @@
{{ super() }}
{% endblock %}
{% block content %}
<div class="text-center">
<div class="my-6">
<h2 class="text-xl font-semibold mb-6 text-gray-800">I want to login to this browser</h2>
<div>
<h1 class="text-2xl font-bold mb-4 text-center">Logged in!</h1>
<div class="mb-4 rounded-lg border border-gray-300 bg-gray-50 p-6 text-left">
<h2 class="mb-2 text-lg font-semibold text-gray-800">Continue on this device</h2>
<p class="mb-4 text-sm text-gray-600">Tap Continue to login to Home Assistant on this device.</p>
<form method="post">
<input type="hidden" name="code" value="{{ code }}">
<button type="submit"
class="w-full py-2 px-4 bg-blue-500 text-white font-semibold rounded-lg shadow-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-400 focus:ring-opacity-75">
Login to Home Assistant in this browser
<button
id="continue-on-this-device"
type="submit"
class="w-full py-2 px-4 bg-blue-500 text-white font-semibold rounded-lg
shadow-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-400
focus:ring-opacity-75 hover:cursor-pointer"
>
Continue on this device
</button>
</form>
</div>
<hr class="my-12">
<div class="my-6">
<h2 class="text-xl font-semibold mb-4 text-gray-800">I am on a mobile device</h2>
<p class="mb-4">Your one-time code is: <b class="text-blue-600 text-xl">{{ code }}</b></p>
<p class="mb-4 text-sm">You have 5 minutes to use this code on any device.<br />The code can only
be used once.</p>
<p class="mb-4 text-sm">Please type the code into your app manually. If you don't see a code input, select
'Login with
OpenID Connect (SSO)' first.</p>
<div class="rounded-lg border border-gray-300 bg-white p-6 text-left">
<div class="mb-4 flex items-center justify-between text-gray-700">
<span class="text-lg font-semibold">Use a code from another device</span>
</div>
<div class="border-t border-gray-200 pt-4">
<p class="mb-2 text-sm text-gray-600">On your other device, open the Home Assistant app. You will see a
6-digit code.</p>
<p class="mb-4 text-sm text-gray-600">Input that code here and click Approve to login on the other device.
</p>
<form method="post">
<div>
<input
type="tel"
id="device-code-input"
name="device_code"
required
minlength="6"
maxlength="6"
pattern="[0-9]{6}"
inputmode="numeric"
placeholder="123456"
class="mb-2 w-full rounded-md border border-gray-300 px-5 py-3 text-center text-base
tracking-[0.15em] text-gray-800 focus:outline-none focus:ring-2 focus:ring-blue-400
focus:ring-opacity-75"
>
</div>
<button
id="approve-login-button"
type="submit"
class="w-full py-2 px-4 bg-white text-blue-600
font-semibold rounded-lg border border-blue-500 shadow-md hover:bg-gray-100
hover:text-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-400
focus:ring-opacity-75 hover:cursor-pointer"
>
Approve login on the other device
</button>
</form>
</div>
</div>
</div>
{% endblock %}