device.html
·
75 lines
·
3.6 KB
| 1 | {{define "content"}} |
| 2 | <div class="container-narrow"> |
| 3 | <div class="card mb-4" style="margin-top:2.5rem;"> |
| 4 | <div class="card-header"> |
| 5 | <span class="font-semibold flex items-center gap-2">{{icon "key" "size-4"}} {{t .Lang "device.title"}}</span> |
| 6 | <span class="badge badge-outline font-mono">{{t .Lang "device.badge"}}</span> |
| 7 | </div> |
| 8 | <div class="card-body flex flex-col gap-3"> |
| 9 | <p class="text-sm text-muted" style="margin:0;">{{t .Lang "device.desc"}}</p> |
| 10 | |
| 11 | {{if .CodeError}} |
| 12 | <div class="text-sm flex items-center gap-2" style="color:hsl(var(--diff-del-fg));"> |
| 13 | {{icon "alert-circle" "size-4"}} |
| 14 | <span>{{.CodeError}}</span> |
| 15 | </div> |
| 16 | {{end}} |
| 17 | |
| 18 | <form method="get" action="/login/device" class="flex items-center gap-2"> |
| 19 | <input name="user_code" class="input font-mono" style="letter-spacing:0.18em;text-transform:uppercase;max-width:12rem;" placeholder="XXXX-XXXX" value="{{.UserCode}}" maxlength="12" autocomplete="off" autofocus> |
| 20 | <button class="btn btn-outline btn-sm" type="submit"> |
| 21 | {{icon "search" "size-3.5"}} |
| 22 | <span>{{t .Lang "device.check"}}</span> |
| 23 | </button> |
| 24 | </form> |
| 25 | |
| 26 | {{if .CodeApproved}} |
| 27 | <div class="flex items-center gap-2 text-sm" style="color:hsl(var(--diff-add-fg));border-top:1px solid hsl(var(--border));padding-top:0.85rem;"> |
| 28 | {{icon "check" "size-4"}} |
| 29 | <span>{{t .Lang "device.approved_now"}}</span> |
| 30 | </div> |
| 31 | {{else if .CodeDenied}} |
| 32 | <div class="flex items-center gap-2 text-sm" style="color:hsl(var(--diff-del-fg));border-top:1px solid hsl(var(--border));padding-top:0.85rem;"> |
| 33 | {{icon "close" "size-4"}} |
| 34 | <span>{{t .Lang "device.denied_now"}}</span> |
| 35 | </div> |
| 36 | {{else if .SignedIn}} |
| 37 | {{if and .UserCode .CodePending}} |
| 38 | <form method="post" action="/login/device" class="flex flex-col gap-3" style="border-top:1px solid hsl(var(--border));padding-top:0.85rem;"> |
| 39 | <input type="hidden" name="_csrf" value="{{.CSRFToken}}"> |
| 40 | <input type="hidden" name="user_code" value="{{.UserCode}}"> |
| 41 | <div class="text-sm"> |
| 42 | {{t .Lang "device.authorize_for"}} |
| 43 | <span class="font-mono font-semibold">{{.UserCode}}</span> |
| 44 | {{if .ClientName}}· <span class="font-medium">{{.ClientName}}</span>{{end}} |
| 45 | </div> |
| 46 | <div class="text-xs text-muted">{{t .Lang "device.scope_hint"}}</div> |
| 47 | <div class="flex items-center gap-2"> |
| 48 | <button type="submit" name="action" value="approve" class="btn btn-primary btn-sm"> |
| 49 | {{icon "check" "size-3.5"}} |
| 50 | <span>{{t .Lang "device.approve"}}</span> |
| 51 | </button> |
| 52 | <button type="submit" name="action" value="deny" class="btn btn-outline btn-sm"> |
| 53 | {{icon "close" "size-3.5"}} |
| 54 | <span>{{t .Lang "device.deny"}}</span> |
| 55 | </button> |
| 56 | </div> |
| 57 | </form> |
| 58 | {{end}} |
| 59 | {{else}} |
| 60 | <div class="flex items-center gap-2 text-sm" style="border-top:1px solid hsl(var(--border));padding-top:0.85rem;"> |
| 61 | <a class="btn btn-primary btn-sm" href="/login?next=%2Flogin%2Fdevice%3Fuser_code%3D{{.UserCode}}"> |
| 62 | {{icon "user" "size-3.5"}} |
| 63 | <span>{{t .Lang "device.signin_to_approve"}}</span> |
| 64 | </a> |
| 65 | </div> |
| 66 | {{end}} |
| 67 | </div> |
| 68 | </div> |
| 69 | |
| 70 | <div class="text-xs text-muted text-center" style="margin-bottom:2.5rem;"> |
| 71 | {{t .Lang "device.helper_hint"}} |
| 72 | <code class="font-mono">scripts/git-credential-polar</code> |
| 73 | </div> |
| 74 | </div> |
| 75 | {{end}} |