tmpl(manage/api-keys): update layout [skip ci]
This commit is contained in:
parent
81ca7d8ec1
commit
9dd5f05eb6
SSH Key Fingerprint:
SHA256:MdCZyJ2sHLltrLBp0xQO0O1qTW9BT/xl5nXkDvhlMCI
|
|
@ -2,47 +2,58 @@
|
|||
<body class="h-screen bg-white dark:bg-gray-900">
|
||||
{{ template "navbar.tmpl" . }}
|
||||
<main class="grow">
|
||||
<div class="px-2 md:px-0 md:mx-12 place-items-center text-center">
|
||||
<h1 class="mt-20 text-2xl text-pink-500 font-bold">
|
||||
Manage Your API keys
|
||||
</h1>
|
||||
<div class="container mx-auto place-items-center px-8 md:px-12 lg:px-14">
|
||||
{{ if and .Data .Data.flash }}
|
||||
<h1 class="text-xl text-pink-600 dark:text-pink-500 py-2">
|
||||
{{ .Data.flash }}
|
||||
</h1>
|
||||
<hr class="md:px-14 md:mx-24">
|
||||
<div class="relative flex items-center mb-4">
|
||||
<p class="mt-2 text-md text-rose-800 dark:text-rose-500"><span class="font-medium">Error:</span> {{.Data.flash}}</p>
|
||||
</div>
|
||||
{{- else -}}{{end}}
|
||||
|
||||
<div class="mt-4 md:px-12 md:mx-12">
|
||||
<!-- hibp form -->
|
||||
<div class="mt-8 lg:max-w-xl lg:mt-0 block md:flex">
|
||||
<h2 class="pr-8 text-purple-500 font-bold">
|
||||
Have I Been Pwned? key
|
||||
</h2>
|
||||
<form method="post" class="w-full lg:max-w-xl md:mx-12">
|
||||
<input type="hidden" name="csrf" value="{{- .CSRF -}}">
|
||||
<div class="relative flex items-center place-items-center">
|
||||
<input name="hibp-api-key" type="text" placeholder="Have I Been Pwned? API key" {{if and .Data.form .Data.form.HibpAPIKey}}value="{{.Data.form.HibpAPIKey}}"{{end}} autofocus class="block w-full py-3 px-11 valid:border text-gray-700 bg-white border rounded-lg dark:bg-gray-900 dark:text-gray-300 dark:valid:border-gray-600 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-blue-300 focus:outline-none focus:ring focus:ring-opacity-40">
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<h1 class="text-xl text-fuchsia-600 dark:text-fuchsia-400 capitalize py-2">
|
||||
Manage Your API keys
|
||||
</h1>
|
||||
|
||||
<hr class="mt-4 md:px-14 md:mx-24">
|
||||
|
||||
<div class="mt-4 md:px-12 md:mx-12">
|
||||
<!-- desec form -->
|
||||
<div class="mt-8 lg:max-w-xl lg:mt-0 block md:flex">
|
||||
<h2 class="md:pr-8 text-purple-500 font-bold">
|
||||
Desec.io key
|
||||
</h2>
|
||||
<form method="post" class="w-full lg:max-w-xl md:mx-12">
|
||||
<input type="hidden" name="csrf" value="{{- .CSRF -}}">
|
||||
<div class="relative flex items-center place-items-center">
|
||||
<input name="desec-api-key" type="text" placeholder="desec.io API Key" {{if and .Data.form .Data.form.DesecioAPIKey}}value="{{.Data.form.DesecioAPIKey}}"{{end}} autofocus class="block w-full py-3 px-11 valid:border text-gray-700 bg-white border rounded-lg dark:bg-gray-900 dark:text-gray-300 dark:valid:border-gray-600 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-blue-300 focus:outline-none focus:ring focus:ring-opacity-40">
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<!-- hibp form -->
|
||||
<div class="p-2 mx-auto mt-8 lg:max-w-5xl lg:mt-0 block">
|
||||
<form method="post" class="w-full lg:max-w-7xl px-2">
|
||||
<input type="hidden" name="csrf" value="{{- .CSRF -}}">
|
||||
<div class="items-center">
|
||||
<label for="hibp-api-key" class="text-purple-500 font-bold">
|
||||
Have I Been Pwned?
|
||||
</label>
|
||||
<input name="hibp-api-key" type="text" placeholder="HIBP API key" {{if and .Data.form .Data.form.HibpAPIKey}}value="{{.Data.form.HibpAPIKey}}"{{end}} autofocus class="py-3 px-8 mt-2 w-full valid:border text-gray-700 bg-white border rounded-lg dark:bg-gray-900 dark:text-gray-300 dark:valid:border-gray-600 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-blue-300 focus:outline-none focus:ring focus:ring-opacity-40">
|
||||
<p id="hibp-expl" class="mt-2 text-sm text-gray-500 dark:text-gray-400">Adds support for querying Troy Hunt's <a href="https://haveibeenpwned.com/API/v3" class="font-medium text-blue-600 hover:underline dark:text-blue-500">Have I Been Pwned? API</a>.</p>
|
||||
</div>
|
||||
<div class="mt-4 block md:flex md:items-center place-items-end space-x-0 md:space-x-2">
|
||||
<button class="px-2 py-3 w-full md:w-auto text-sm font-medium tracking-wide text-white transition-colors duration-300 transform bg-blue-500 rounded-lg hover:bg-blue-400 focus:outline-none focus:ring focus:ring-blue-300 focus:ring-opacity-50">
|
||||
Submit
|
||||
</button>
|
||||
<button class="px-2 py-3 mt-2 md:mt-0 w-full md:w-auto text-sm font-medium tracking-wide text-white transition-colors duration-300 transform bg-gray-500 rounded-lg hover:bg-gray-400 focus:outline-none focus:ring focus:ring-gray-300 focus:ring-opacity-50">
|
||||
Test key
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
<hr class="py-2 md:px-14 mt-4 lg:mx-22 sm:max-w-1/2">
|
||||
<!-- dehashed.com form -->
|
||||
<form method="post" class="w-full lg:max-w-7xl px-2">
|
||||
<input type="hidden" name="csrf" value="{{- .CSRF -}}">
|
||||
<div class="items-center">
|
||||
<label for="dehashed-api-key" class="text-purple-500 font-bold">
|
||||
DeHashed.com
|
||||
</label>
|
||||
<input name="dehashed-api-key" type="text" placeholder="DeHashed.com API key" {{if and .Data.form .Data.form.DehashedAPIKey}}value="{{.Data.form.DehashedAPIKey}}"{{end}} autofocus class="py-3 px-8 mt-2 w-full valid:border text-gray-700 bg-white border rounded-lg dark:bg-gray-900 dark:text-gray-300 dark:valid:border-gray-600 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-blue-300 focus:outline-none focus:ring focus:ring-opacity-40" aria-described-by="dehashed-expl">
|
||||
<p id="dehashed-expl" class="mt-2 text-sm text-gray-500 dark:text-gray-400">Adds support for querying <a href="https://dehashed.com/" class="font-medium text-blue-600 hover:underline dark:text-blue-500">DeHashed API</a>.</p>
|
||||
</div>
|
||||
<div class="mt-4 block md:flex md:items-center place-items-end space-x-0 md:space-x-2">
|
||||
<button class="px-2 py-3 w-full md:w-auto text-sm font-medium tracking-wide text-white transition-colors duration-300 transform bg-blue-500 rounded-lg hover:bg-blue-400 focus:outline-none focus:ring focus:ring-blue-300 focus:ring-opacity-50">
|
||||
Submit
|
||||
</button>
|
||||
<button class="px-2 py-3 mt-2 md:mt-0 w-full md:w-auto text-sm font-medium tracking-wide text-white transition-colors duration-300 transform bg-gray-500 rounded-lg hover:bg-gray-400 focus:outline-none focus:ring focus:ring-gray-300 focus:ring-opacity-50">
|
||||
Test key
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
|
|
|||
Loading…
Reference in New Issue