mirror of
https://github.com/hrfee/jfa-go.git
synced 2024-11-13 22:00:10 +00:00
Harvey Tindall
2057823b7a
got rid of a bunch of m[l/r/x/y]-x tailwind classes and used more flex-[row/col] gap-2's. UI should be more consistent in general, and with the admin UI. The page you were on is actually read from the URL on reload, however does not keep settings (implemented just for ease of UI editing, really). `missing-colors.js` preprocessor script now applies dark prefixes for <section>s, but like with cards, does not apply a default ~neutral to those without, so that <section class=""> looks different to <section class="~neutral">. Light/dark selector added to setup too, and the actual mode given to the browser through CSS `color-scheme` is correct, meaning things like textareas, checkboxes and controls are now colored according to the theme.
586 lines
39 KiB
HTML
586 lines
39 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" class="light">
|
|
<head>
|
|
<link rel="stylesheet" type="text/css" href="css/{{ .cssVersion }}bundle.css">
|
|
{{ template "header.html" . }}
|
|
<title>{{ .lang.Strings.pageTitle }}</title>
|
|
</head>
|
|
<body class="max-w-full overflow-x-hidden section">
|
|
<div id="notification-box"></div>
|
|
<div class="page-container m-2 lg:my-20 lg:mx-64 flex flex-col gap-4">
|
|
<div class="top-2 inset-x-2 lg:absolute flex flex-row justify-between">
|
|
<div class="flex flex-row gap-2">
|
|
<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>
|
|
<span class="button ~warning" alt="{{ .strings.theme }}" id="button-theme"><i class="ri-sun-line"></i></span>
|
|
</div>
|
|
<div class="card sectioned ~neutral @low flex flex-col gap-4 justify-between items-center">
|
|
<img class="w-[105%] max-w-none" src="banner.svg" alt="jfa-go" />
|
|
<span class="heading welcome">{{ .lang.StartPage.welcome }}</span>
|
|
<p class="content text-center">{{ .lang.StartPage.pressStart }}</p>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-between items-center">
|
|
<span class="support">{{ .lang.StartPage.httpsNotice }}</span>
|
|
<span class="button ~urge @low next">{{ .lang.StartPage.start }}</span>
|
|
</section>
|
|
</div>
|
|
<div class="card sectioned ~neutral @low unfocused">
|
|
<section class="section flex flex-col gap-2 justify-between">
|
|
<span class="heading">{{ .lang.Language.title }}</span>
|
|
<p class="content" id="language-description"></p>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Language.defaultAdminLang }}</span>
|
|
<div class="select ~neutral @low">
|
|
<select id="ui-language-admin">
|
|
</select>
|
|
</div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Language.defaultFormLang }}</span>
|
|
<div class="select ~neutral @low">
|
|
<select id="ui-language-form">
|
|
</select>
|
|
</div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Language.defaultEmailLang }}</span>
|
|
<div class="select ~neutral @low">
|
|
<select id="email-language">
|
|
</select>
|
|
</div>
|
|
</label>
|
|
</section>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-between items-center">
|
|
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
|
|
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
|
|
</section>
|
|
</div>
|
|
<div class="card sectioned ~neutral @low unfocused">
|
|
<section class="section flex flex-col gap-2 justify-between">
|
|
<span class="heading">{{ .lang.General.title }}</span>
|
|
<div class="flex flex-row gap-2 justify-between">
|
|
<div class="flex flex-col gap-2">
|
|
<div class="flex flex-row gap-2 justify-between">
|
|
<label class="label flex flex-col gap-2 grow">
|
|
<span>{{ .lang.General.listenAddress }}</span>
|
|
<input type="url" class="input ~neutral @low" id="ui-host" value="0.0.0.0">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.port }}</span>
|
|
<input type="number" class="input ~neutral @low" id="ui-port" value="8056">
|
|
</label>
|
|
</div>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="advanced-tls"><span>{{ .lang.General.useHTTPS }}</span></div>
|
|
<p class="support">{{ .lang.General.useHTTPSNotice }}</p>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.General.pathToCertificate }}</span>
|
|
<input type="text" class="input ~neutral @low" id="advanced-tls_cert">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.General.pathToKeyFile }}</span>
|
|
<input type="text" class="input ~neutral @low" id="advanced-tls_key">
|
|
</label>
|
|
<span class="heading">{{ .lang.Updates.title }}</span>
|
|
<p class="content" id="updates-description"></p>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="updates-enabled" checked><span>{{ .lang.Strings.enabled }}</span></div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Updates.updateChannel }}</span>
|
|
<div class="select ~neutral @low">
|
|
<select id="updates-channel">
|
|
<option value="stable">{{ .lang.Updates.stable }}</option>
|
|
<option value="unstable">{{ .lang.Updates.unstable }}</option>
|
|
</select>
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div class="flex flex-col gap-2">
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.General.httpsPort }}</span>
|
|
<input type="number" class="input ~neutral @low" id="advanced-tls_port" value="8057">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.General.urlBase }} ({{ .lang.Strings.optional }})</span>
|
|
<input type="text" class="input ~neutral @low" id="ui-url_base" placeholder="/mysubfolder">
|
|
<p class="support">{{ .lang.General.urlBaseNotice }}</p>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.General.externalURL }}</span>
|
|
<input type="text" class="input ~neutral @low" id="ui-jfa_url" placeholder="https://jellyf.in/mysubfolder">
|
|
<p class="support">{{ .lang.General.externalURLNotice }}</p>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.theme }}</span>
|
|
<div class="select ~neutral @low">
|
|
<select id="ui-theme">
|
|
<option value="Jellyfin (Dark)">{{ .lang.General.darkTheme }}</option>
|
|
<option value="Default (Light)">{{ .lang.General.lightTheme }}</option>
|
|
</select>
|
|
</div>
|
|
</label>
|
|
<span class="heading">{{ .lang.Proxy.title }}</span>
|
|
<p class="content" id="proxy-description">{{ .lang.Proxy.description }}</p>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="advanced-proxy"><span>{{ .lang.Strings.enabled }}</span></div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Proxy.protocol }}</span>
|
|
<div class="select ~neutral @low">
|
|
<select id="advanced-proxy_protocol">
|
|
<option value="http">HTTP</option>
|
|
<option value="socks">SOCKS5</option>
|
|
</select>
|
|
</div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Proxy.address }}</span>
|
|
<input type="text" class="input ~neutral @low" id="advanced-proxy_address">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.username }}</span>
|
|
<input type="text" class="input ~neutral @low" id="advanced-proxy_user">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.password }}</span>
|
|
<input type="text" class="input ~neutral @low" id="advanced-proxy_password">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-between items-center">
|
|
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
|
|
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
|
|
</section>
|
|
</div>
|
|
<div class="card sectioned ~neutral @low unfocused">
|
|
<section class="section flex flex-col gap-2 justify-between">
|
|
<span class="heading">{{ .lang.Login.title }}</span>
|
|
<p class="content">{{ .lang.Login.description }}</p>
|
|
<div class="flex flex-col gap-2">
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="radio" name="ui-jellyfin_login" value="true" checked><span>{{ .lang.Login.authorizeWithJellyfin }}</span></div>
|
|
</label>
|
|
<div class="pl-4 flex flex-col gap-2">
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="ui-admin_only" checked><span>{{ .lang.Login.adminOnly }}</span></div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="ui-allow_all"><span>{{ .lang.Login.allowAll }}</span></div>
|
|
<p class="support" id="description-ui-allow_all">{{ .lang.Login.allowAllDescription }}</p>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-col gap-2">
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="radio" name="ui-jellyfin_login" value="false"><span>{{ .lang.Login.authorizeManual }}</span></div>
|
|
</label>
|
|
<p class="support">{{ .lang.Login.authorizeManualUserPageNotice }}</p>
|
|
</div>
|
|
<div class ="flex flex-col gap-2" id="login-manual">
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.username }}</span>
|
|
<input type="text" id="ui-username" class="input ~neutral @low" placeholder="{{ .lang.Strings.username }}">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.password }}</span>
|
|
<input type="password" id="ui-password" class="input ~neutral @low" placeholder="{{ .lang.Strings.password }}">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.emailAddress }} ({{ .lang.Strings.optional }})</span>
|
|
<input type="email" id="ui-email" class="input ~neutral @low" placeholder="email@address">
|
|
<span class="support">{{ .lang.Login.emailNotice }}</span>
|
|
</label>
|
|
</div>
|
|
</section>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-between items-center">
|
|
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
|
|
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
|
|
</section>
|
|
</div>
|
|
<div class="card sectioned ~neutral @low unfocused">
|
|
<section class="section flex flex-col gap-2 justify-between">
|
|
<span class="heading">{{ .lang.JellyfinEmby.title }}</span>
|
|
<p class="content">{{ .lang.JellyfinEmby.description }}</p>
|
|
<div class="flex flex-row gap-2 justify-between">
|
|
<div class="flex flex-col gap-2 grow">
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.serverType }}</span>
|
|
<div class="select ~neutral @low">
|
|
<select id="jellyfin-type">
|
|
<option value="jellyfin">Jellyfin</option>
|
|
<option value="emby">Emby</option>
|
|
</select>
|
|
</div>
|
|
<p class="support">{{ .lang.JellyfinEmby.embyNotice }}</p>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.JellyfinEmby.replaceJellyfin }} ({{ .lang.Strings.optional }})</span>
|
|
<input type="text" class="input ~neutral @low" id="jellyfin-substitute_jellyfin_strings">
|
|
<p class="support">{{ .lang.JellyfinEmby.replaceJellyfinNotice }}</p>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.username }}</span>
|
|
<input type="text" id="jellyfin-username" class="input ~neutral @low" placeholder="{{ .lang.Strings.username }}">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.password }}</span>
|
|
<input type="password" id="jellyfin-password" class="input ~neutral @low" placeholder="{{ .lang.Strings.password }}">
|
|
</label>
|
|
</div>
|
|
<div class="flex flex-col gap-2 grow ">
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.serverAddress }} ({{ .lang.JellyfinEmby.internal }})</span>
|
|
<input type="url" class="input ~neutral @low" id="jellyfin-server" placeholder="http://jellyf.in:80">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.serverAddress }} ({{ .lang.JellyfinEmby.external }})</span>
|
|
<input type="url" class="input ~neutral @low" id="jellyfin-public_server" placeholder="https://jellyf.in">
|
|
<p class="support">{{ .lang.JellyfinEmby.addressExternalNotice }}</p>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-between items-center">
|
|
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
|
|
<div class="flex flex-row gap-2">
|
|
<span class="button ~urge @low" id="jellyfin-test-connection">{{ .lang.JellyfinEmby.testConnection }}</span>
|
|
<span class="button ~urge @low next" disabled>{{ .lang.Strings.next }}</span>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="card sectioned ~neutral @low unfocused">
|
|
<section class="section flex flex-col gap-2 justify-between">
|
|
<span class="heading">{{ .lang.Ombi.title }}</span>
|
|
<p class="content">{{ .lang.Ombi.description }}</p>
|
|
<aside class="aside ~warning" id="ombi-stability-warning">{{ .lang.Ombi.stabilityWarning }}</aside>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="ombi-enabled"><span>{{ .lang.Strings.enabled }}</span></div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.serverAddress }}</span>
|
|
<input type="url" class="input ~neutral @low" id="ombi-server" placeholder="ombi.jellyf.in">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.apiKey }}</span>
|
|
<input type="text" class="input ~neutral @low" id="ombi-api_key">
|
|
<p class="support">{{ .lang.Ombi.apiKeyNotice }}</p>
|
|
</label>
|
|
<span class="heading">{{ .lang.Jellyseerr.title }}</span>
|
|
<p class="content">{{ .lang.Jellyseerr.description }}</p>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="jellyseerr-enabled"><span>{{ .lang.Strings.enabled }}</span></div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.serverAddress }}</span>
|
|
<input type="url" class="input ~neutral @low" id="jellyseerr-server" placeholder="https://jellyseerr.jellyf.in:5055">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.apiKey }}</span>
|
|
<input type="text" class="input ~neutral @low" id="jellyseerr-api_key">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="jellyseerr-import_existing" checked><span>{{ .lang.Jellyseerr.importExisting }}</span></div>
|
|
<p class="support">{{ .lang.Jellyseerr.importExistingDescription }}</p>
|
|
</label>
|
|
</section>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-between items-center">
|
|
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
|
|
<div>
|
|
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="card sectioned ~neutral @low unfocused">
|
|
<section class="section flex flex-col gap-2 justify-between">
|
|
<span class="heading">{{ .lang.UserPage.title }}</span>
|
|
<p class="content">{{ .lang.UserPage.description }}</p>
|
|
<p class="content">{{ .lang.UserPage.customizeMessages }}</p>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="userpage-enabled"><span>{{ .lang.Strings.enabled }}</span></div>
|
|
<p class="support">{{ .lang.UserPage.requiredSettings }}</p>
|
|
</label>
|
|
</section>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-between items-center">
|
|
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
|
|
<div>
|
|
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="card sectioned ~neutral @low unfocused">
|
|
<section class="section flex flex-col gap-2 justify-between">
|
|
<span class="heading">{{ .lang.Messages.title }}</span>
|
|
<p class="content" id="messages-description"></p>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="messages-enabled" checked><span>{{ .lang.Strings.enabled }}</span></div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Email.dateFormat }}</span>
|
|
<input type="text" class="input ~neutral @low" id="email-date_format" value="%d/%m/%y">
|
|
<p class="support" id="email-dateformat-notice"></p>
|
|
</label>
|
|
<div class="flex flex-col gap-2">
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="radio" class="mr-2" name="email-24h" value="true" checked><span>{{ .lang.Strings.time24h }}</span></div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="radio" class="mr-2" name="email-24h" value="false"><span>{{ .lang.Strings.time12h }}</span></div>
|
|
</label>
|
|
</div>
|
|
<div id="email-sect" class="flex flex-row gap-2 justify-between">
|
|
<div class="flex flex-col gap-2">
|
|
<span class="heading">{{ .lang.Email.title }}</span>
|
|
<p class="content" id="email-description"></p>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Email.method }}</span>
|
|
<div class="select ~neutral @low">
|
|
<select id="email-method">
|
|
<option value="">{{ .lang.Strings.disabled }}</option>
|
|
<option value="smtp">SMTP</option>
|
|
<option value="mailgun">Mailgun</option>
|
|
</select>
|
|
</div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="email-no_username"><span>{{ .lang.Email.useEmailAsUsername }}</span></div>
|
|
<p class="support">{{ .lang.Email.useEmailAsUsernameNotice }}</p>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Email.fromAddress }}</span>
|
|
<input type="email" class="input ~neutral @low" id="email-address" placeholder="mail@jellyf.in">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Email.senderName }}</span>
|
|
<input type="text" class="input ~neutral @low" id="email-from" value="Jellyfin">
|
|
</label>
|
|
</div>
|
|
<div id="email-smtp" class="flex flex-col gap-2 min-w-[40%]">
|
|
<p class="text-2xl font-semibold">SMTP</p>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Email.encryption }}</span>
|
|
<div class="select ~neutral @low">
|
|
<select id="smtp-encryption">
|
|
<option value="starttls">STARTTLS ({{ .lang.Strings.port }} 587)</option>
|
|
<option value="ssl_tls">SSL/TLS ({{ .lang.Strings.port }} 465)</option>
|
|
</select>
|
|
</div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.serverAddress }}</span>
|
|
<input type="url" class="input ~neutral @low" id="smtp-server" placeholder="smtp.jellyf.in">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.port }}</span>
|
|
<input type="number" class="input ~neutral @low" id="smtp-port" placeholder="587">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.username }}</span>
|
|
<input type="text" class="input ~neutral @low" id="smtp-username">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.password }}</span>
|
|
<input type="password" class="input ~neutral @low" id="smtp-password">
|
|
</label>
|
|
</div>
|
|
<div id="email-mailgun" class="flex flex-col gap-2 min-w-[40%]">
|
|
<p class="text-2xl font-semibold">Mailgun</p>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Email.mailgunApiURL }}</span>
|
|
<input type="url" class="input ~neutral @low" id="mailgun-api_url" placeholder="https://api.eu.mailgun.net/v3/mail.jellyf.in/messages">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.apiKey }}</span>
|
|
<input type="text" class="input ~neutral @low" id="mailgun-api_key">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-between items-center">
|
|
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
|
|
<div>
|
|
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="card sectioned ~neutral @low unfocused related-to-email">
|
|
<section class="section flex flex-col gap-2 justify-between">
|
|
<span class="heading">{{ .lang.Notifications.title }}</span>
|
|
<p class="content">{{ .lang.Notifications.description }}</p>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="notifications-enabled"><span>{{ .lang.Strings.enabled }}</span></div>
|
|
</label>
|
|
<span class="heading">{{ .lang.WelcomeEmails.title }}</span>
|
|
<p class="content">{{ .lang.WelcomeEmails.description }}</p>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="welcome_email-enabled"><span>{{ .lang.Strings.enabled }}</span></div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.emailSubject }}</span>
|
|
<input type="text" class="input ~neutral @low" id="welcome_email-subject" placeholder="{{ .emailLang.WelcomeEmail.title }}">
|
|
</label>
|
|
</section>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-between items-center">
|
|
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
|
|
<div>
|
|
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="card sectioned ~neutral @low unfocused related-to-email">
|
|
<section class="section flex flex-col gap-2 justify-between">
|
|
<span class="heading">{{ .lang.InviteEmails.title }}</span>
|
|
<p class="content">{{ .lang.InviteEmails.description }}</p>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="invite_emails-enabled"><span>{{ .lang.Strings.enabled }}</span></div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.emailSubject }}</span>
|
|
<input type="text" class="input ~neutral @low" id="invite_emails-subject" placeholder="{{ .emailLang.InviteEmail.title }}">
|
|
</label>
|
|
</section>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-between items-center">
|
|
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
|
|
<div>
|
|
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div id="password-resets" class="card sectioned ~neutral @low unfocused related-to-email">
|
|
<section class="section flex flex-col gap-2 justify-between">
|
|
<span class="heading">{{ .lang.PasswordResets.title }}</span>
|
|
<p class="content">{{ .lang.PasswordResets.description }}</p>
|
|
<p class="content" id="password_resets-more-info">{{ .lang.PasswordResets.moreInfo }}</p>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="password_resets-enabled"><span>{{ .lang.Strings.enabled }}</span></div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.PasswordResets.pathToJellyfin }}</span>
|
|
<input type="text" class="input ~neutral @low" id="password_resets-watch_directory" placeholder="/config/jellyfin">
|
|
<p class="support">{{ .lang.PasswordResets.pathToJellyfinNotice }}</p>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="password_resets-link_reset"><span>{{ .lang.PasswordResets.resetLinks }}</span></div>
|
|
<p class="support">{{ .lang.PasswordResets.resetLinksNotice }} {{ .lang.PasswordResets.resetLinksRequiredForUserPage }}</p>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="password_resets-set_password"><span>{{ .lang.PasswordResets.setPassword }}</span></div>
|
|
<p class="support">{{ .lang.PasswordResets.setPasswordNotice }}</p>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.PasswordResets.resetLinksLanguage }}</span>
|
|
<div class="select ~neutral @low">
|
|
<select id="password_resets-language">
|
|
</select>
|
|
</div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.Strings.emailSubject }}</span>
|
|
<input type="text" class="input ~neutral @low" id="password_resets-subject" placeholder="{{ .emailLang.PasswordReset.title }}">
|
|
</label>
|
|
</section>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-between items-center">
|
|
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
|
|
<div>
|
|
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="card sectioned ~neutral @low unfocused">
|
|
<section class="section flex flex-col gap-2 justify-between">
|
|
<span class="heading">{{ .lang.PasswordValidation.title }}</span>
|
|
<p class="content">{{ .lang.PasswordValidation.description }}</p>
|
|
<label class="label flex flex-col gap-2">
|
|
<div class="switch"><input type="checkbox" id="password_validation-enabled" checked><span>{{ .lang.Strings.enabled }}</span></div>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.PasswordValidation.length }}</span>
|
|
<input type="number" class="input ~neutral @low" id="password_validation-min_length" value="8">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.PasswordValidation.uppercase }}</span>
|
|
<input type="number" class="input ~neutral @low" id="password_validation-upper" value="1">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.PasswordValidation.lowercase }}</span>
|
|
<input type="number" class="input ~neutral @low" id="password_validation-lower" value="0">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.PasswordValidation.numbers }}</span>
|
|
<input type="number" class="input ~neutral @low" id="password_validation-number" value="0">
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.PasswordValidation.special }}</span>
|
|
<input type="number" class="input ~neutral @low" id="password_validation-special" value="0">
|
|
</label>
|
|
</section>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-between items-center">
|
|
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
|
|
<div>
|
|
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="card sectioned ~neutral @low unfocused">
|
|
<section class="section flex flex-col gap-2 justify-between">
|
|
<span class="heading">{{ .lang.HelpMessages.title }}</span>
|
|
<p class="content">{{ .lang.HelpMessages.description }}</p>
|
|
<p class="content">{{ .lang.HelpMessages.markdownMessageNotice }}</p>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.HelpMessages.contactMessage }}</span>
|
|
<input type="text" class="input ~neutral @low" id="ui-contact_message">
|
|
<p class="support">{{ .lang.HelpMessages.contactMessageNotice }}</p>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.HelpMessages.helpMessage }}</span>
|
|
<input type="text" class="input ~neutral @low" id="ui-help_message">
|
|
<p class="support">{{ .lang.HelpMessages.helpMessageNotice }}</p>
|
|
</label>
|
|
<label class="label flex flex-col gap-2">
|
|
<span>{{ .lang.HelpMessages.successMessage }}</span>
|
|
<input type="text" class="input ~neutral @low" id="ui-success_message">
|
|
<p class="support">{{ .lang.HelpMessages.successMessageNotice }}</p>
|
|
</label>
|
|
<label class="label related-to-email">
|
|
<span>{{ .lang.HelpMessages.emailMessage }}</span>
|
|
<input type="text" class="input ~neutral @low" id="email-message">
|
|
<p class="support">{{ .lang.HelpMessages.emailMessageNotice }}</p>
|
|
</label>
|
|
</section>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-between items-center">
|
|
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
|
|
<div>
|
|
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
|
|
</div>
|
|
</section>
|
|
</div>
|
|
<div class="card sectioned ~neutral @low unfocused">
|
|
<section class="section flex flex-col gap-2 justify-center items-center">
|
|
<span class="heading">{{ .lang.EndPage.finished }}</span>
|
|
<p class="content">{{ .lang.EndPage.restartMessage }}</p>
|
|
</section>
|
|
<section class="section w-full ~neutral footer flex flex-row justify-center items-center gap-2">
|
|
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
|
|
<span class="button ~urge @low" id="restart">{{ .lang.Strings.submit }}</span>
|
|
<span class="button ~urge @low unfocused" id="refresh">{{ .lang.EndPage.refreshPage }}</span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<script>
|
|
window.langFile = JSON.parse({{ .language }});
|
|
window.messages = JSON.parse({{ .messages }});
|
|
</script>
|
|
<script src="js/setup.js" type="module"></script>
|
|
</body>
|
|
</html>
|