<!DOCTYPE html> <html lang="en" class="{{ .cssClass }}"> <head> <link rel="stylesheet" type="text/css" href="css/{{ .cssVersion }}bundle.css"> {{ template "header.html" . }} {{ if .passwordReset }} <title>{{ .strings.passwordReset }}</title> {{ else }} <title>{{ .strings.pageTitle }}</title> {{ end }} </head> <body class="max-w-full overflow-x-hidden section"> <div id="modal-success" class="modal"> <div class="card relative mx-auto my-[10%] w-4/5 lg:w-1/3"> <span class="heading mb-4">{{ if .passwordReset }}{{ .strings.passwordReset }}{{ else }}{{ .strings.successHeader }}{{ end }}</span> <p class="content mb-4">{{ if .passwordReset }}{{ .strings.youCanLoginPassword }}{{ else }}{{ .successMessage }}{{ end }}</p> <a class="button ~urge @low full-width center supra submit" href="{{ .jfLink }}" id="create-success-button">{{ .strings.continue }}</a> </div> </div> <div id="modal-confirmation" class="modal"> <div class="card relative mx-auto my-[10%] w-4/5 lg:w-1/3"> <span class="heading mb-4">{{ .strings.confirmationRequired }}</span> <p class="content mb-4">{{ .strings.confirmationRequiredMessage }}</p> </div> </div> {{ if .telegramEnabled }} <div id="modal-telegram" class="modal"> <div class="card relative mx-auto my-[10%] w-4/5 lg:w-1/3"> <span class="heading mb-4">{{ .strings.linkTelegram }}</span> <p class="content mb-4">{{ .strings.sendPIN }}</p> <p class="text-center text-2xl mb-2">{{ .telegramPIN }}</p> <a class="subheading link-center" href="{{ .telegramURL }}" target="_blank"> <span class="shield ~info mr-4"> <span class="icon"> <i class="ri-telegram-line"></i> </span> </span> @{{ .telegramUsername }} </a> <span class="button ~info @low full-width center mt-4" id="telegram-waiting">{{ .strings.success }}</span> </div> </div> {{ end }} {{ if .discordEnabled }} <div id="modal-discord" class="modal"> <div class="card relative mx-auto my-[10%] w-4/5 lg:w-1/3"> <span class="heading mb-4">{{ .strings.linkDiscord }}</span> <p class="content mb-4"> {{ .discordSendPINMessage }}</p> <h1 class="text-center text-2xl mb-2">{{ .discordPIN }}</h1> <a id="discord-invite"></a> <span class="button ~info @low full-width center mt-4" id="discord-waiting">{{ .strings.success }}</span> </div> </div> {{ end }} {{ if .matrixEnabled }} <div id="modal-matrix" class="modal"> <div class="card relative mx-auto my-[10%] w-4/5 lg:w-1/3"> <span class="heading mb-4">{{ .strings.linkMatrix }}</span> <p class="content mb-4"> {{ .strings.matrixEnterUser }}</p> <input type="text" class="input ~neutral @high" placeholder="@user:riot.im" id="matrix-userid"> <div class="subheading link-center mt-4"> <span class="shield ~info mr-4"> <span class="icon"> <i class="ri-chat-3-line"></i> </span> </span> {{ .matrixUser }} </div> <span class="button ~info @low full-width center mt-4" id="matrix-send">{{ .strings.submit }}</span> </div> </div> {{ end }} <div class="top-4 left-4 absolute"> <span class="dropdown" tabindex="0" id="lang-dropdown"> <span class="button ~urge dropdown-button"> <i class="ri-global-line"></i> <span class="ml-2 chev"></span> </span> <div class="dropdown-display"> <div class="card ~neutral @low" id="lang-list"> </div> </div> </span> </div> <div id="notification-box"></div> <div class="page-container"> <div class="card dark:~d_neutral @low"> <div class="flex flex-col md:flex-row gap-3 baseline"> <span class="heading mr-5"> {{ if .passwordReset }} {{ .strings.passwordReset }} {{ else }} {{ .strings.createAccountHeader }} {{ end }} </span> <span class="subheading"> {{ if .passwordReset }} {{ .strings.enterYourPassword }} {{ else }} {{ .helpMessage }} {{ end }} </span> </div> <div class="flex flex-col md:flex-row gap-3"> <div class="flex-1"> {{ if .userExpiry }} <aside class="col aside sm ~warning" id="user-expiry-message"></aside> {{ end }} <form class="card dark:~d_neutral @low" id="form-create" href=""> {{ if not .passwordReset }} <label class="label supra"> {{ .strings.username }} <input type="text" class="input ~neutral @high mt-2 mb-4" placeholder="{{ .strings.username }}" id="create-username" aria-label="{{ .strings.username }}"> </label> <label class="label supra" for="create-email">{{ .strings.emailAddress }}</label> <input type="email" class="input ~neutral @high mt-2 mb-4" placeholder="{{ .strings.emailAddress }}" id="create-email" aria-label="{{ .strings.emailAddress }}" value="{{ .email }}"> {{ if .telegramEnabled }} <span class="button ~info @low full-width center mb-4" id="link-telegram">{{ .strings.linkTelegram }}</span> {{ end }} {{ if .discordEnabled }} <span class="button ~info @low full-width center mb-4" id="link-discord">{{ .strings.linkDiscord }}</span> {{ end }} {{ if .matrixEnabled }} <span class="button ~info @low full-width center mb-4" id="link-matrix">{{ .strings.linkMatrix }}</span> {{ end }} {{ if or (.telegramEnabled) (or .discordEnabled .matrixEnabled) }} <div id="contact-via" class="unfocused"> <label class="row switch pb-4"> <input type="radio" name="contact-via" value="email" class="mr-2"><span>Contact through Email</span> </label> {{ if .telegramEnabled }} <label class="row switch pb-4"> <input type="radio" name="contact-via" value="telegram" id="contact-via-telegram" class="mr-2"><span>Contact through Telegram</span> </label> {{ end }} {{ if .discordEnabled }} <label class="row switch pb-4"> <input type="radio" name="contact-via" value="discord" id="contact-via-discord" class="mr-2"><span>Contact through Discord</span> </label> {{ end }} {{ if .matrixEnabled }} <label class="row switch pb-4"> <input type="radio" name="contact-via" value="matrix" id="contact-via-matrix" class="mr-2"><span>Contact through Matrix</span> </label> {{ end }} </div> {{ end }} {{ end }} <label class="label supra" for="create-password">{{ .strings.password }}</label> <input type="password" class="input ~neutral @high mt-2 mb-4" placeholder="{{ .strings.password }}" id="create-password" aria-label="{{ .strings.password }}"> <label class="label supra" for="create-reenter-password">{{ .strings.reEnterPassword }}</label> <input type="password" class="input ~neutral @high mt-2 mb-4" placeholder="{{ .strings.password }}" id="create-reenter-password" aria-label="{{ .strings.reEnterPassword }}"> <label> <input type="submit" class="unfocused"> <span class="button ~urge @low full-width center supra submit"> {{ if .passwordReset }} {{ .strings.reset }} {{ else }} {{ .strings.createAccountButton }} {{ end }} </span> </label> </form> </div> <div class="flex-1"> <div class="card ~neutral @low mb-4"> <span class="label supra" for="inv-uses">{{ .strings.passwordRequirementsHeader }}</span> <ul> {{ range $key, $value := .requirements }} <li class="" id="requirement-{{ $key }}" min="{{ $value }}"> <span class="badge lg ~positive requirement-valid"></span> <span class="content requirement-content"></span> </li> {{ end }} </ul> </div> {{ if .captcha }} <div class="card ~neutral @low mb-4"> <span class="label supra mb-2">CAPTCHA <span id="captcha-regen" title="{{ .strings.refresh }}" class="badge lg @low ~info ml-2 float-right"><i class="ri-refresh-line"></i></span><span id="captcha-success" class="badge lg @low ~critical ml-2 float-right"><i class="ri-close-line"></i></span></span> <div id="captcha-img" class="mt-2 mb-2"></div> <input class="field ~neutral @low" id="captcha-input" class="mt-2" placeholder="CAPTCHA"> </div> {{ end }} {{ if .contactMessage }} <aside class="col aside sm ~info mt-4">{{ .contactMessage }}</aside> {{ end }} </div> </div> </div> </div> {{ template "form-base" . }} </body> </html>