187 lines
5.7 KiB
Cheetah
187 lines
5.7 KiB
Cheetah
{{ define "consent.tmpl" }}
|
|
<html lang="zh">
|
|
<head>
|
|
<title>Confirm authorization</title>
|
|
{{ template "head.tmpl" }}
|
|
<style>
|
|
ul.scopes,
|
|
ul.app-terms {
|
|
list-style: none;
|
|
padding-left: 0;
|
|
}
|
|
|
|
ul.scopes {
|
|
text-align: left;
|
|
width: 100%;
|
|
max-height: 30vh;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
ul.scopes > li {
|
|
padding: 6px 12px;
|
|
margin: 6px 0;
|
|
border-radius: 6px;
|
|
background-color: #282c34;
|
|
}
|
|
|
|
ul.scopes > li > * {
|
|
cursor: pointer;
|
|
}
|
|
|
|
ul.app-terms {
|
|
display: inline-flex;
|
|
gap: 0;
|
|
}
|
|
|
|
ul.app-terms > li {
|
|
padding: 0 6px;
|
|
margin: 0;
|
|
}
|
|
|
|
ul.app-terms > li:not(:last-child) {
|
|
border-right: 1px solid white;
|
|
}
|
|
|
|
ul.app-terms > li > a {
|
|
color: #62b6e7;
|
|
}
|
|
|
|
.consent-notice {
|
|
width: 100%;
|
|
border-radius: 6px;
|
|
background-color: #282c34;
|
|
}
|
|
|
|
p.remember {
|
|
display: flex;
|
|
justify-content: center;
|
|
}
|
|
p.remember, p.remember > * {
|
|
cursor: pointer;
|
|
}
|
|
|
|
input#remember {
|
|
height: 16px;
|
|
width: 16px;
|
|
color: #62b6e7;
|
|
border-radius: 6px;
|
|
}
|
|
|
|
p.buttons {
|
|
width: 100%;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: .5rem
|
|
}
|
|
|
|
@media (min-width: 640px) {
|
|
p.buttons {
|
|
flex-direction: row;
|
|
gap: 2rem;
|
|
}
|
|
}
|
|
|
|
button {
|
|
display: flex;
|
|
flex-grow: 1;
|
|
padding: 8px 24px;
|
|
cursor: pointer;
|
|
border-radius: 8px;
|
|
border: none;
|
|
font-size: 1.2rem;
|
|
color: white;
|
|
justify-content: center;
|
|
transition: background-color .2s;
|
|
}
|
|
|
|
button.reject {
|
|
background: #dc2626;
|
|
}
|
|
button.reject:hover {
|
|
background: #b91c1c;
|
|
}
|
|
|
|
button.accept {
|
|
background: #16a34a;
|
|
}
|
|
button.accept:hover {
|
|
background: #15803d;
|
|
}
|
|
|
|
.app-name, .user-name {
|
|
color: #62b6e7;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<form id="main" action="/consent" method="POST">
|
|
<input type="hidden" name="_csrf" value="{{ .csrf }}" />
|
|
<input type="hidden" name="challenge" value="{{ .challenge }}" />
|
|
|
|
<div class="logo">
|
|
{{ if .logo }}
|
|
<img src="{{ .logo }}" alt="{{ .clientName }}" width="120" height="120" />
|
|
{{ else }}
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="120" height="120" viewBox="0 0 48 48">
|
|
<g>
|
|
<circle fill="#EFD358" cx="24" cy="24" r="24"></circle>
|
|
<path fill="#FFFFFF" d="M24,28c0.55225,0,1-0.44775,1-1V14c0-0.55225-0.44775-1-1-1s-1,0.44775-1,1v13 C23,27.55225,23.44775,28,24,28z"></path>
|
|
<circle fill="#FFFFFF" cx="24" cy="33" r="2"></circle>
|
|
</g>
|
|
</svg>
|
|
{{ end }}
|
|
</div>
|
|
|
|
<div>
|
|
<p>
|
|
Application
|
|
<span class="app-name">{{ .clientName }}</span>
|
|
is requesting
|
|
<br />
|
|
access to account
|
|
<span class="user-name">{{ .user.name }}</span>
|
|
with the following scopes:
|
|
</p>
|
|
|
|
<ul class="scopes">
|
|
{{ $user := .user }}
|
|
{{ range $scope := .scopes }}
|
|
<li>
|
|
<details>
|
|
<summary>{{ $scope }}</summary>
|
|
<pre>{{ index $user $scope }}</pre>
|
|
</details>
|
|
</li>
|
|
{{ end }}
|
|
</ul>
|
|
|
|
{{ if or .clientPolicy .clientTos }}
|
|
<ul class="app-terms">
|
|
{{ if .clientPolicy }}
|
|
<li><a href="{{ .clientPolicy }}" target="_blank" referrerpolicy="no-referrer">Client Usage Policy</a></li>
|
|
{{ end }}
|
|
{{ if .clientTos }}
|
|
<li><a href="{{ .clientTos }}" target="_blank" referrerpolicy="no-referrer">Terms of Service</a></li>
|
|
{{ end }}
|
|
</ul>
|
|
{{ end }}
|
|
</div>
|
|
|
|
<div class="consent-notice">
|
|
<p>Accept the request?</p>
|
|
|
|
<p class="remember">
|
|
<input type="checkbox" id="remember" name="remember" value="true" />
|
|
<label for="remember">Remember my choice</label>
|
|
</p>
|
|
</div>
|
|
|
|
<p class="buttons">
|
|
<button type="submit" name="action" value="reject" class="reject">Reject</button>
|
|
<button type="submit" name="action" value="accept" class="accept">Accept</button>
|
|
</p>
|
|
</form>
|
|
</body>
|
|
</html>
|
|
{{ end }}
|