hrfee/jfa-go
1
0
Fork 0
mirror of https://github.com/hrfee/jfa-go.git synced 2024-12-22 09:00:10 +00:00
Code Issues Projects Releases Wiki Activity

fix some padding issues

Browse Source
This commit is contained in:
Harvey Tindall 2021-12-31 00:22:28 +00:00
parent 62be8adc65
commit e73ecb7a52
Signed by: hrfee
GPG Key ID: BBC65952848FB1A2
13 changed files with 306 additions and 306 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

208
html/admin.html
View File

@ -22,8 +22,8 @@
<div id="modal-login" class="modal"> <div id="modal-login" class="modal">
<form class="modal-content card" id="form-login" href=""> <form class="modal-content card" id="form-login" href="">
<span class="heading">{{ .strings.login }}</span> <span class="heading">{{ .strings.login }}</span>
<input type="text" class="field input ~neutral @high mt-0.5 mb-1" placeholder="{{ .strings.username }}" id="login-user"> <input type="text" class="field input ~neutral @high mt-8 mb-4" placeholder="{{ .strings.username }}" id="login-user">
<input type="password" class="field input ~neutral @high mb-1" placeholder="{{ .strings.password }}" id="login-password"> <input type="password" class="field input ~neutral @high mb-4" placeholder="{{ .strings.password }}" id="login-password">
<label> <label>
<input type="submit" class="unfocused"> <input type="submit" class="unfocused">
<span class="button ~urge @low full-width center supra submit">{{ .strings.login }}</span> <span class="button ~urge @low full-width center supra submit">{{ .strings.login }}</span>
@ -33,9 +33,9 @@
<div id="modal-add-user" class="modal"> <div id="modal-add-user" class="modal">
<form class="modal-content card" id="form-add-user" href=""> <form class="modal-content card" id="form-add-user" href="">
<span class="heading">{{ .strings.newUser }} <span class="modal-close">&times;</span></span> <span class="heading">{{ .strings.newUser }} <span class="modal-close">&times;</span></span>
<input type="text" class="field input ~neutral @high mt-0.5 mb-1" placeholder="{{ .strings.username }}" id="add-user-user"> <input type="text" class="field input ~neutral @high mt-8 mb-4" placeholder="{{ .strings.username }}" id="add-user-user">
<input type="email" class="field input ~neutral @high mt-0.5 mb-1" placeholder="{{ .strings.emailAddress }}"> <input type="email" class="field input ~neutral @high mt-8 mb-4" placeholder="{{ .strings.emailAddress }}">
<input type="password" class="field input ~neutral @high mb-1" placeholder="{{ .strings.password }}" id="add-user-password"> <input type="password" class="field input ~neutral @high mb-4" placeholder="{{ .strings.password }}" id="add-user-password">
<label> <label>
<input type="submit" class="unfocused"> <input type="submit" class="unfocused">
<span class="button ~urge @low full-width center supra submit">{{ .strings.create }}</span> <span class="button ~urge @low full-width center supra submit">{{ .strings.create }}</span>
@ -49,23 +49,23 @@
<p>{{ .strings.version }} <span class="code monospace">{{ .version }}</span></p> <p>{{ .strings.version }} <span class="code monospace">{{ .version }}</span></p>
<p>{{ .strings.commitNoun }} <span class="code monospace">{{ .commit }}</span></p> <p>{{ .strings.commitNoun }} <span class="code monospace">{{ .commit }}</span></p>
<div class="row col flex"> <div class="row col flex">
<a class="button ~neutral mr-0.5 mt-1 mb-1 lang-link" href="https://github.com/hrfee/jfa-go"><i class="ri-github-line mr-0.5"></i>github</a> <a class="button ~neutral mr-4 mt-4 mb-4 lang-link" href="https://github.com/hrfee/jfa-go"><i class="ri-github-line mr-4"></i>github</a>
<a class="button ~urge mt-1 mb-1 mr-0.5 lang-link" href="https://wiki.jfa-go.com">wiki/docs</a> <a class="button ~urge mt-4 mb-4 mr-4 lang-link" href="https://wiki.jfa-go.com">wiki/docs</a>
<a class="button ~positive mt-1 mb-1 mr-0.5 lang-link" href="https://weblate.jfa-go.com">translation</a> <a class="button ~positive mt-4 mb-4 mr-4 lang-link" href="https://weblate.jfa-go.com">translation</a>
<div class="dropdown mr-0.5" tabindex="0"> <div class="dropdown mr-4" tabindex="0">
<a href="https://github.com/sponsors/hrfee" target="_blank" class="button ~info mt-1 mb-1 dropdown-button lang-link"> <a href="https://github.com/sponsors/hrfee" target="_blank" class="button ~info mt-4 mb-4 dropdown-button lang-link">
<i class="ri-hand-heart-line mr-0.5"></i> <i class="ri-hand-heart-line mr-4"></i>
donate donate
<span class="ml-1 chev"></span> <span class="ml-2 chev"></span>
</a> </a>
<div class="dropdown-display"> <div class="dropdown-display">
<div class="card ~info @low"> <div class="card ~info @low">
<a href="https://github.com/sponsors/hrfee" target="_blank" class="button input ~neutral field mb-0.5 lang-link">GitHub</a> <a href="https://github.com/sponsors/hrfee" target="_blank" class="button input ~neutral field mb-2 lang-link">GitHub</a>
<a href="https://ko-fi.com/hrfee" target="_blank" class="button input ~neutral field mb-0.5 lang-link">Ko-fi</a> <a href="https://ko-fi.com/hrfee" target="_blank" class="button input ~neutral field mb-2 lang-link">Ko-fi</a>
</div> </div>
</div> </div>
</div> </div>
<a class="button ~urge mt-1 mb-1 @low discord lang-link" href="https://discord.com/invite/MrtvuQmyhP" target="_blank"><i class="ri-discord-line mr-0.5"></i>discord</a> <a class="button ~urge mt-4 mb-4 @low discord lang-link" href="https://discord.com/invite/MrtvuQmyhP" target="_blank"><i class="ri-discord-line mr-4"></i>discord</a>
</div> </div>
<p><a href="https://github.com/hrfee/jfa-go/blob/main/LICENSE">Available under the MIT License.</a></p> <p><a href="https://github.com/hrfee/jfa-go/blob/main/LICENSE">Available under the MIT License.</a></p>
<pre class="monospace">{{ .license }}</pre> <pre class="monospace">{{ .license }}</pre>
@ -75,23 +75,23 @@
<form class="modal-content card" id="form-modify-user" href=""> <form class="modal-content card" id="form-modify-user" href="">
<span class="heading"><span id="header-modify-user"></span> <span class="modal-close">&times;</span></span> <span class="heading"><span id="header-modify-user"></span> <span class="modal-close">&times;</span></span>
<p class="content">{{ .strings.modifySettingsDescription }}</p> <p class="content">{{ .strings.modifySettingsDescription }}</p>
<div class="flex-row mb-1"> <div class="flex-row mb-4">
<label class="flex-row-group mr-1"> <label class="flex-row-group mr-2">
<input type="radio" name="modify-user-source" class="unfocused" id="radio-use-profile" checked> <input type="radio" name="modify-user-source" class="unfocused" id="radio-use-profile" checked>
<span class="button ~neutral @high supra full-width center">{{ .strings.profile }}</span> <span class="button ~neutral @high supra full-width center">{{ .strings.profile }}</span>
</label> </label>
<label class="flex-row-group ml-1"> <label class="flex-row-group ml-2">
<input type="radio" name="modify-user-source" class="unfocused" id="radio-use-user"> <input type="radio" name="modify-user-source" class="unfocused" id="radio-use-user">
<span class="button ~neutral @low supra full-width center">{{ .strings.user }}</span> <span class="button ~neutral @low supra full-width center">{{ .strings.user }}</span>
</label> </label>
</div> </div>
<div class="select ~neutral @low mb-1"> <div class="select ~neutral @low mb-4">
<select id="modify-user-profiles"></select> <select id="modify-user-profiles"></select>
</div> </div>
<div class="select ~neutral @low mb-1 unfocused"> <div class="select ~neutral @low mb-4 unfocused">
<select id="modify-user-users"></select> <select id="modify-user-users"></select>
</div> </div>
<label class="switch mb-1"> <label class="switch mb-4">
<input type="checkbox" id="modify-user-homescreen" checked> <input type="checkbox" id="modify-user-homescreen" checked>
<span>{{ .strings.applyHomescreenLayout }}</span> <span>{{ .strings.applyHomescreenLayout }}</span>
</label> </label>
@ -104,12 +104,12 @@
<div id="modal-delete-user" class="modal"> <div id="modal-delete-user" class="modal">
<form class="modal-content card" id="form-delete-user" href=""> <form class="modal-content card" id="form-delete-user" href="">
<span class="heading"><span id="header-delete-user"></span> <span class="modal-close">&times;</span></span> <span class="heading"><span id="header-delete-user"></span> <span class="modal-close">&times;</span></span>
<div class="content mt-0.5"> <div class="content mt-8">
<label class="switch mb-1"> <label class="switch mb-4">
<input type="checkbox" id="delete-user-notify" checked> <input type="checkbox" id="delete-user-notify" checked>
<span>{{ .strings.sendDeleteNotificationEmail }}</span> <span>{{ .strings.sendDeleteNotificationEmail }}</span>
</label> </label>
<textarea id="textarea-delete-user" class="textarea full-width ~neutral @low mb-1" placeholder="{{ .strings.sendDeleteNotificationExample }}"></textarea> <textarea id="textarea-delete-user" class="textarea full-width ~neutral @low mb-4" placeholder="{{ .strings.sendDeleteNotificationExample }}"></textarea>
<label> <label>
<input type="submit" class="unfocused"> <input type="submit" class="unfocused">
<span class="button ~critical @low full-width center supra submit">{{ .strings.delete }}</span> <span class="button ~critical @low full-width center supra submit">{{ .strings.delete }}</span>
@ -120,11 +120,11 @@
<div id="modal-extend-expiry" class="modal"> <div id="modal-extend-expiry" class="modal">
<form class="modal-content card" id="form-extend-expiry" href=""> <form class="modal-content card" id="form-extend-expiry" href="">
<span class="heading"><span id="header-extend-expiry"></span> <span class="modal-close">&times;</span></span> <span class="heading"><span id="header-extend-expiry"></span> <span class="modal-close">&times;</span></span>
<div class="content mt-0.5"> <div class="content mt-8">
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<label class="label supra" for="extend-expiry-months">{{ .strings.inviteMonths }}</label> <label class="label supra" for="extend-expiry-months">{{ .strings.inviteMonths }}</label>
<div class="select ~neutral @low mb-1 mt-0.5"> <div class="select ~neutral @low mb-2 mt-4">
<select id="extend-expiry-months"> <select id="extend-expiry-months">
<option>0</option> <option>0</option>
</select> </select>
@ -132,7 +132,7 @@
</div> </div>
<div class="col"> <div class="col">
<label class="label supra" for="extend-expiry-days">{{ .strings.inviteDays }}</label> <label class="label supra" for="extend-expiry-days">{{ .strings.inviteDays }}</label>
<div class="select ~neutral @low mb-1 mt-0.5"> <div class="select ~neutral @low mb-2 mt-4">
<select id="extend-expiry-days"> <select id="extend-expiry-days">
<option>0</option> <option>0</option>
</select> </select>
@ -142,7 +142,7 @@
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<label class="label supra" for="extend-expiry-hours">{{ .strings.inviteHours }}</label> <label class="label supra" for="extend-expiry-hours">{{ .strings.inviteHours }}</label>
<div class="select ~neutral @low mb-1 mt-0.5"> <div class="select ~neutral @low mb-2 mt-4">
<select id="extend-expiry-hours"> <select id="extend-expiry-hours">
<option>0</option> <option>0</option>
</select> </select>
@ -150,18 +150,18 @@
</div> </div>
<div class="col"> <div class="col">
<label class="label supra" for="extend-expiry-minutes">{{ .strings.inviteMinutes }}</label> <label class="label supra" for="extend-expiry-minutes">{{ .strings.inviteMinutes }}</label>
<div class="select ~neutral @low mb-1 mt-0.5"> <div class="select ~neutral @low mb-2 mt-4">
<select id="extend-expiry-minutes"> <select id="extend-expiry-minutes">
<option>0</option> <option>0</option>
</select> </select>
</div> </div>
</div> </div>
</div> </div>
<label class="switch mb-1"> <label class="switch mb-4">
<input type="checkbox" id="expiry-extend-enable" checked> <input type="checkbox" id="expiry-extend-enable" checked>
<span>{{ .strings.sendDeleteNotificationEmail }}</span> <span>{{ .strings.sendDeleteNotificationEmail }}</span>
</label> </label>
<textarea id="textarea-extend-enable" class="textarea full-width ~neutral @low mb-1" placeholder="{{ .strings.sendDeleteNotificationExample }}"></textarea> <textarea id="textarea-extend-enable" class="textarea full-width ~neutral @low mb-4" placeholder="{{ .strings.sendDeleteNotificationExample }}"></textarea>
<label> <label>
<input type="submit" class="unfocused"> <input type="submit" class="unfocused">
<span class="button ~critical @low full-width center supra submit">{{ .strings.submit }}</span> <span class="button ~critical @low full-width center supra submit">{{ .strings.submit }}</span>
@ -173,20 +173,20 @@
<form class="modal-content wide card" id="form-announce" href=""> <form class="modal-content wide card" id="form-announce" href="">
<span class="heading"><span id="header-announce"></span> <span class="modal-close">&times;</span></span> <span class="heading"><span id="header-announce"></span> <span class="modal-close">&times;</span></span>
<div class="row"> <div class="row">
<div class="col flex-col content mt-0.5"> <div class="col flex-col content mt-8">
<div id="announce-details"> <div id="announce-details">
<span class="label supra" for="editor-variables" id="label-editor-variables">{{ .strings.variables }}</span> <span class="label supra" for="editor-variables" id="label-editor-variables">{{ .strings.variables }}</span>
<div id="announce-variables"> <div id="announce-variables">
<span class="button ~urge @low mb-1 mt-0.5" id="announce-variables-username" style="margin-left: 0.25rem; margin-right: 0.25rem;"><span class="monospace">{username}</span></span> <span class="button ~urge @low mb-2 mt-4" id="announce-variables-username" style="margin-left: 0.25rem; margin-right: 0.25rem;"><span class="monospace">{username}</span></span>
</div> </div>
<label class="label supra" for="announce-subject"> {{ .strings.subject }}</label> <label class="label supra" for="announce-subject"> {{ .strings.subject }}</label>
<input type="text" id="announce-subject" class="input ~neutral @low mb-1 mt-0.5"> <input type="text" id="announce-subject" class="input ~neutral @low mb-2 mt-4">
<label class="label supra" for="textarea-announce">{{ .strings.message }}</label> <label class="label supra" for="textarea-announce">{{ .strings.message }}</label>
<textarea id="textarea-announce" class="textarea full-width ~neutral @low mt-0.5 monospace"></textarea> <textarea id="textarea-announce" class="textarea full-width ~neutral @low mt-8 monospace"></textarea>
<p class="support mt-0.5 mb-1">{{ .strings.markdownSupported }}</p> <p class="support mt-8 mb-4">{{ .strings.markdownSupported }}</p>
</div> </div>
<label class="label unfocused" id="announce-name"><p class="supra">{{ .strings.name }}</p> <label class="label unfocused" id="announce-name"><p class="supra">{{ .strings.name }}</p>
<input type="text" class="input ~neutral @low mb-1 mt-0.5"> <input type="text" class="input ~neutral @low mb-2 mt-4">
<p class="support">{{ .strings.templateEnterName }}</p> <p class="support">{{ .strings.templateEnterName }}</p>
</label> </label>
<div class="row flex-expand"> <div class="row flex-expand">
@ -199,7 +199,7 @@
</div> </div>
<div class="col card ~neutral @low"> <div class="col card ~neutral @low">
<span class="subheading supra">{{ .strings.preview }}</span> <span class="subheading supra">{{ .strings.preview }}</span>
<div class="mt-0.5" id="announce-preview"></div> <div class="mt-8" id="announce-preview"></div>
</div> </div>
</div> </div>
</form> </form>
@ -226,16 +226,16 @@
<form class="modal-content wide card" id="form-editor" href=""> <form class="modal-content wide card" id="form-editor" href="">
<span class="heading"><span id="header-editor"></span> <span class="modal-close">&times;</span></span> <span class="heading"><span id="header-editor"></span> <span class="modal-close">&times;</span></span>
<div class="row"> <div class="row">
<div class="col flex-col content mt-0.5"> <div class="col flex-col content mt-8">
<span class="label supra" for="editor-variables" id="label-editor-variables">{{ .strings.variables }}</span> <span class="label supra" for="editor-variables" id="label-editor-variables">{{ .strings.variables }}</span>
<div id="editor-variables"></div> <div id="editor-variables"></div>
<span class="label supra" for="editor-conditionals" id="label-editor-conditionals">{{ .strings.conditionals }}</span> <span class="label supra" for="editor-conditionals" id="label-editor-conditionals">{{ .strings.conditionals }}</span>
<div id="editor-conditionals"></div> <div id="editor-conditionals"></div>
<label class="label supra" for="textarea-editor">{{ .strings.message }}</label> <label class="label supra" for="textarea-editor">{{ .strings.message }}</label>
<textarea id="textarea-editor" class="textarea full-width flex-auto ~neutral @low mt-0.5 monospace"></textarea> <textarea id="textarea-editor" class="textarea full-width flex-auto ~neutral @low mt-8 monospace"></textarea>
<p class="support mt-0.5 mb-1">{{ .strings.markdownSupported }}</p> <p class="support mt-8 mb-4">{{ .strings.markdownSupported }}</p>
<div class="flex-row"> <div class="flex-row">
<label class="full-width ml-0.5"> <label class="full-width ml-2">
<input type="submit" class="unfocused"> <input type="submit" class="unfocused">
<span class="button ~urge @low full-width center supra submit">{{ .strings.submit }}</span> <span class="button ~urge @low full-width center supra submit">{{ .strings.submit }}</span>
</label> </label>
@ -243,7 +243,7 @@
</div> </div>
<div class="col card ~neutral @low"> <div class="col card ~neutral @low">
<span class="subheading supra">{{ .strings.preview }}</span> <span class="subheading supra">{{ .strings.preview }}</span>
<div class="mt-0.5" id="editor-preview"></div> <div class="mt-8" id="editor-preview"></div>
</div> </div>
</div> </div>
</form> </form>
@ -251,9 +251,9 @@
<div id="modal-restart" class="modal"> <div id="modal-restart" class="modal">
<div class="modal-content card ~critical @low"> <div class="modal-content card ~critical @low">
<span class="heading">{{ .strings.settingsRestartRequired }} <span class="modal-close">&times;</span></span> <span class="heading">{{ .strings.settingsRestartRequired }} <span class="modal-close">&times;</span></span>
<p class="content pb-1">{{ .strings.settingsRestartRequiredDescription }}</p> <p class="content pb-4">{{ .strings.settingsRestartRequiredDescription }}</p>
<div class="fr"> <div class="fr">
<span class="button ~info @low mb-0.5" id="settings-apply-no-restart">{{ .strings.settingsApplyRestartLater }}</span> <span class="button ~info @low mb-2" id="settings-apply-no-restart">{{ .strings.settingsApplyRestartLater }}</span>
<span class="button ~critical @low" id="settings-apply-restart">{{ .strings.settingsApplyRestartNow }}</span> <span class="button ~critical @low" id="settings-apply-restart">{{ .strings.settingsApplyRestartNow }}</span>
</div> </div>
</div> </div>
@ -268,14 +268,14 @@
<div class="modal-content card ~neutral @low"> <div class="modal-content card ~neutral @low">
<span class="heading">{{ .strings.sendPWR }}</span> <span class="heading">{{ .strings.sendPWR }}</span>
<p class="content" id="send-pwr-note"></p> <p class="content" id="send-pwr-note"></p>
<span class="button ~urge @low mt-0.5" id="send-pwr-link">{{ .strings.copy }}</span> <span class="button ~urge @low mt-8" id="send-pwr-link">{{ .strings.copy }}</span>
</div> </div>
</div> </div>
<div id="modal-ombi-profile" class="modal"> <div id="modal-ombi-profile" class="modal">
<form class="modal-content card" id="form-ombi-defaults" href=""> <form class="modal-content card" id="form-ombi-defaults" href="">
<span class="heading">{{ .strings.ombiProfile }} <span class="modal-close">&times;</span></span> <span class="heading">{{ .strings.ombiProfile }} <span class="modal-close">&times;</span></span>
<p class="content">{{ .strings.ombiUserDefaultsDescription }}</p> <p class="content">{{ .strings.ombiUserDefaultsDescription }}</p>
<div class="select ~neutral @low mb-1"> <div class="select ~neutral @low mb-4">
<select></select> <select></select>
</div> </div>
<label> <label>
@ -313,14 +313,14 @@
<p class="content">{{ .strings.addProfileDescription }}</p> <p class="content">{{ .strings.addProfileDescription }}</p>
<label> <label>
<span class="supra">{{ .strings.addProfileNameOf }} </span> <span class="supra">{{ .strings.addProfileNameOf }} </span>
<input type="text" class="field input ~neutral @high mt-0.5 mb-1" placeholder="{{ .strings.name }}" id="add-profile-name"> <input type="text" class="field input ~neutral @high mt-8 mb-4" placeholder="{{ .strings.name }}" id="add-profile-name">
<label> <label>
<span class="supra">{{ .strings.user }}</span> <span class="supra">{{ .strings.user }}</span>
<div class="select ~neutral @low mt-0.5 mb-1"> <div class="select ~neutral @low mt-8 mb-4">
<select id="add-profile-user"></select> <select id="add-profile-user"></select>
</div> </div>
</label> </label>
<label class="switch mb-1"> <label class="switch mb-4">
<input type="checkbox" id="add-profile-homescreen" checked> <input type="checkbox" id="add-profile-homescreen" checked>
<span>{{ .strings.addProfileStoreHomescreenLayout }}</span> <span>{{ .strings.addProfileStoreHomescreenLayout }}</span>
</label> </label>
@ -348,26 +348,26 @@
{{ if .telegramEnabled }} {{ if .telegramEnabled }}
<div id="modal-telegram" class="modal"> <div id="modal-telegram" class="modal">
<div class="modal-content card"> <div class="modal-content card">
<span class="heading mb-1">{{ .strings.linkTelegram }}</span> <span class="heading mb-4">{{ .strings.linkTelegram }}</span>
<p class="content mb-1">{{ .strings.sendPIN }}</p> <p class="content mb-4">{{ .strings.sendPIN }}</p>
<h1 class="ac" id="telegram-pin"></h1> <h1 class="ac" id="telegram-pin"></h1>
<a class="subheading link-center" id="telegram-link" target="_blank"> <a class="subheading link-center" id="telegram-link" target="_blank">
<span class="shield ~info mr-1"> <span class="shield ~info mr-2">
<span class="icon"> <span class="icon">
<i class="ri-telegram-line"></i> <i class="ri-telegram-line"></i>
</span> </span>
</span> </span>
&#64;<span id="telegram-username"> &#64;<span id="telegram-username">
</a> </a>
<span class="button ~info @low full-width center mt-1" id="telegram-waiting">{{ .strings.success }}</span> <span class="button ~info @low full-width center mt-4" id="telegram-waiting">{{ .strings.success }}</span>
</div> </div>
</div> </div>
{{ end }} {{ end }}
{{ if .discordEnabled }} {{ if .discordEnabled }}
<div id="modal-discord" class="modal"> <div id="modal-discord" class="modal">
<div class="modal-content card"> <div class="modal-content card">
<span class="heading mb-1"><span id="discord-header"></span><span class="modal-close">&times;</span></span> <span class="heading mb-4"><span id="discord-header"></span><span class="modal-close">&times;</span></span>
<p class="content mb-1" id="discord-description"></p> <p class="content mb-4" id="discord-description"></p>
<div class="row"> <div class="row">
<input type="search" class="col sm field ~neutral @low input" id="discord-search" placeholder="user#1234"> <input type="search" class="col sm field ~neutral @low input" id="discord-search" placeholder="user#1234">
</div> </div>
@ -379,9 +379,9 @@
<form class="modal-content card" id="form-matrix" href=""> <form class="modal-content card" id="form-matrix" href="">
<span class="heading">{{ .strings.linkMatrix }}</span> <span class="heading">{{ .strings.linkMatrix }}</span>
<p class="content">{{ .strings.linkMatrixDescription }}</p> <p class="content">{{ .strings.linkMatrixDescription }}</p>
<input type="text" class="field input ~neutral @high mt-0.5 mb-1" placeholder="{{ .strings.matrixHomeServer }}" id="matrix-homeserver"> <input type="text" class="field input ~neutral @high mt-8 mb-4" placeholder="{{ .strings.matrixHomeServer }}" id="matrix-homeserver">
<input type="text" class="field input ~neutral @high mt-0.5 mb-1" placeholder="{{ .strings.username }}" id="matrix-user"> <input type="text" class="field input ~neutral @high mt-8 mb-4" placeholder="{{ .strings.username }}" id="matrix-user">
<input type="password" class="field input ~neutral @high mt-0.5 mb-1" placeholder="{{ .strings.password }}" id="matrix-password"> <input type="password" class="field input ~neutral @high mt-8 mb-4" placeholder="{{ .strings.password }}" id="matrix-password">
<label> <label>
<input type="submit" class="unfocused"> <input type="submit" class="unfocused">
<span class="button ~urge @low full-width center supra submit">{{ .strings.submit }}</span> <span class="button ~urge @low full-width center supra submit">{{ .strings.submit }}</span>
@ -392,15 +392,15 @@
<span class="dropdown" tabindex="0" id="lang-dropdown"> <span class="dropdown" tabindex="0" id="lang-dropdown">
<span class="button ~urge dropdown-button"> <span class="button ~urge dropdown-button">
<i class="ri-global-line"></i> <i class="ri-global-line"></i>
<span class="ml-1 chev"></span> <span class="ml-2 chev"></span>
</span> </span>
<div class="dropdown-display"> <div class="dropdown-display">
<div class="card ~neutral @low"> <div class="card ~neutral @low">
<label class="switch pb-1"> <label class="switch pb-4">
<input type="radio" name="lang-time" id="lang-12h"> <input type="radio" name="lang-time" id="lang-12h">
<span>{{ .strings.time12h }}</span> <span>{{ .strings.time12h }}</span>
</label> </label>
<label class="switch pb-1"> <label class="switch pb-4">
<input type="radio" name="lang-time" id="lang-24h"> <input type="radio" name="lang-time" id="lang-24h">
<span>{{ .strings.time24h }}</span> <span>{{ .strings.time24h }}</span>
</label> </label>
@ -410,7 +410,7 @@
</span> </span>
<span class="button ~warning" alt="{{ .strings.theme }}" id="button-theme"><i class="ri-sun-line"></i></span> <span class="button ~warning" alt="{{ .strings.theme }}" id="button-theme"><i class="ri-sun-line"></i></span>
<div class="page-container"> <div class="page-container">
<div class="mb-1"> <div class="mb-4">
<header class="flex flex-wrap items-center justify-between"> <header class="flex flex-wrap items-center justify-between">
<div class="text-neutral-700"> <div class="text-neutral-700">
<span id="button-tab-invites" class="tab-button portal">{{ .strings.invites }}</span> <span id="button-tab-invites" class="tab-button portal">{{ .strings.invites }}</span>
@ -419,13 +419,13 @@
</div> </div>
</header> </header>
</div> </div>
<div class="mb-1"> <div class="mb-4">
<div class="text-neutral-700"> <div class="text-neutral-700">
<span class="button ~critical @low mb-1 unfocused" id="logout-button">{{ .strings.logout }}</span> <span class="button ~critical @low mb-4 unfocused" id="logout-button">{{ .strings.logout }}</span>
</div> </div>
</div> </div>
<div id="tab-invites"> <div id="tab-invites">
<div class="card ~neutral @low invites mb-1"> <div class="card ~neutral @low invites mb-4">
<span class="heading">{{ .strings.invites }}</span> <span class="heading">{{ .strings.invites }}</span>
<div id="invites"></div> <div id="invites"></div>
</div> </div>
@ -433,12 +433,12 @@
<span class="heading">{{ .strings.create }}</span> <span class="heading">{{ .strings.create }}</span>
<div class="row" id="create-inv"> <div class="row" id="create-inv">
<div class="card ~neutral @low col"> <div class="card ~neutral @low col">
<div class="row mb-1"> <div class="row mb-2">
<label class="col mr-1"> <label class="col mr-2">
<input type="radio" name="duration" class="unfocused" id="radio-inv-duration" checked> <input type="radio" name="duration" class="unfocused" id="radio-inv-duration" checked>
<span class="button ~neutral @high supra full-width center">{{ .strings.inviteDuration }}</span> <span class="button ~neutral @high supra full-width center">{{ .strings.inviteDuration }}</span>
</label> </label>
<label class="col ml-1"> <label class="col ml-2">
<input type="radio" name="duration" class="unfocused" id="radio-user-expiry"> <input type="radio" name="duration" class="unfocused" id="radio-user-expiry">
<span class="button ~neutral @low supra full-width center">{{ .strings.userExpiry }}</span> <span class="button ~neutral @low supra full-width center">{{ .strings.userExpiry }}</span>
</label> </label>
@ -447,7 +447,7 @@
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<label class="label supra" for="create-months">{{ .strings.inviteMonths }}</label> <label class="label supra" for="create-months">{{ .strings.inviteMonths }}</label>
<div class="select ~neutral @low mb-1 mt-0.5"> <div class="select ~neutral @low mb-2 mt-4">
<select id="create-months"> <select id="create-months">
<option>0</option> <option>0</option>
</select> </select>
@ -455,7 +455,7 @@
</div> </div>
<div class="col"> <div class="col">
<label class="label supra" for="create-days">{{ .strings.inviteDays }}</label> <label class="label supra" for="create-days">{{ .strings.inviteDays }}</label>
<div class="select ~neutral @low mb-1 mt-0.5"> <div class="select ~neutral @low mb-2 mt-4">
<select id="create-days"> <select id="create-days">
<option>0</option> <option>0</option>
</select> </select>
@ -465,7 +465,7 @@
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<label class="label supra" for="create-hours">{{ .strings.inviteHours }}</label> <label class="label supra" for="create-hours">{{ .strings.inviteHours }}</label>
<div class="select ~neutral @low mb-1 mt-0.5"> <div class="select ~neutral @low mb-2 mt-4">
<select id="create-hours"> <select id="create-hours">
<option>0</option> <option>0</option>
</select> </select>
@ -473,7 +473,7 @@
</div> </div>
<div class="col"> <div class="col">
<label class="label supra" for="create-minutes">{{ .strings.inviteMinutes }}</label> <label class="label supra" for="create-minutes">{{ .strings.inviteMinutes }}</label>
<div class="select ~neutral @low mb-1 mt-0.5"> <div class="select ~neutral @low mb-2 mt-4">
<select id="create-minutes"> <select id="create-minutes">
<option>0</option> <option>0</option>
</select> </select>
@ -482,17 +482,17 @@
</div> </div>
</div> </div>
<div id="user-expiry" class="unfocused"> <div id="user-expiry" class="unfocused">
<p class="support">{{ .strings.userExpiryDescription }}</p> <p class="support mb-2">{{ .strings.userExpiryDescription }}</p>
<div class="mb-0.5"> <div class="mb-2">
<label for="create-user-expiry-enabled" class="button ~neutral @low"> <label for="create-user-expiry-enabled" class="button ~neutral @low">
<input type="checkbox" id="create-user-expiry-enabled" aria-label="User duration enabled"> <input type="checkbox" id="create-user-expiry-enabled" aria-label="User duration enabled">
<span class="ml-0.5">{{ .strings.enabled }} </span> <span class="ml-2">{{ .strings.enabled }} </span>
</label> </label>
</div> </div>
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<label class="label supra" for="user-months">{{ .strings.inviteMonths }}</label> <label class="label supra" for="user-months">{{ .strings.inviteMonths }}</label>
<div class="select ~neutral @low mb-1 mt-0.5"> <div class="select ~neutral @low mb-2 mt-4">
<select id="user-months"> <select id="user-months">
<option>0</option> <option>0</option>
</select> </select>
@ -500,7 +500,7 @@
</div> </div>
<div class="col"> <div class="col">
<label class="label supra" for="user-days">{{ .strings.inviteDays }}</label> <label class="label supra" for="user-days">{{ .strings.inviteDays }}</label>
<div class="select ~neutral @low mb-1 mt-0.5"> <div class="select ~neutral @low mb-2 mt-4">
<select id="user-days"> <select id="user-days">
<option>0</option> <option>0</option>
</select> </select>
@ -510,7 +510,7 @@
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<label class="label supra" for="user-hours">{{ .strings.inviteHours }}</label> <label class="label supra" for="user-hours">{{ .strings.inviteHours }}</label>
<div class="select ~neutral @low mb-1 mt-0.5"> <div class="select ~neutral @low mb-2 mt-4">
<select id="user-hours"> <select id="user-hours">
<option>0</option> <option>0</option>
</select> </select>
@ -518,7 +518,7 @@
</div> </div>
<div class="col"> <div class="col">
<label class="label supra" for="user-minutes">{{ .strings.inviteMinutes }}</label> <label class="label supra" for="user-minutes">{{ .strings.inviteMinutes }}</label>
<div class="select ~neutral @low mb-1 mt-0.5"> <div class="select ~neutral @low mb-2 mt-4">
<select id="user-minutes"> <select id="user-minutes">
<option>0</option> <option>0</option>
</select> </select>
@ -528,13 +528,13 @@
</div> </div>
<div class="col"> <div class="col">
<label class="label supra" for="create-label"> {{ .strings.label }}</label> <label class="label supra" for="create-label"> {{ .strings.label }}</label>
<input type="text" id="create-label" class="input ~neutral @low mb-1 mt-0.5"> <input type="text" id="create-label" class="input ~neutral @low mb-2 mt-4">
</div> </div>
</div> </div>
<div class="card ~neutral @low col"> <div class="card ~neutral @low col">
<label class="label supra" for="create-uses">{{ .strings.inviteNumberOfUses }}</label> <label class="label supra" for="create-uses">{{ .strings.inviteNumberOfUses }}</label>
<div class="flex-expand mb-1 mt-0.5"> <div class="flex-expand mb-2 mt-4">
<input type="number" min="0" id="create-uses" class="input ~neutral @low mr-1" value=1> <input type="number" min="0" id="create-uses" class="input ~neutral @low mr-2" value=1>
<label for="create-inf-uses" class="button ~neutral @low" title="Set uses to infinite"> <label for="create-inf-uses" class="button ~neutral @low" title="Set uses to infinite">
<span>∞</span> <span>∞</span>
<input type="checkbox" class="unfocused" id="create-inf-uses" aria-label="Set uses to infinite"> <input type="checkbox" class="unfocused" id="create-inf-uses" aria-label="Set uses to infinite">
@ -542,20 +542,20 @@
</div> </div>
<p class="support unfocused" id="create-inf-uses-warning"><span class="badge ~critical">{{ .strings.warning }}</span> {{ .strings.inviteInfiniteUsesWarning }}</p> <p class="support unfocused" id="create-inf-uses-warning"><span class="badge ~critical">{{ .strings.warning }}</span> {{ .strings.inviteInfiniteUsesWarning }}</p>
<label class="label supra">{{ .strings.profile }}</label> <label class="label supra">{{ .strings.profile }}</label>
<div class="select ~neutral @low mb-1 mt-0.5"> <div class="select ~neutral @low mb-2 mt-4">
<select id="create-profile"> <select id="create-profile">
</select> </select>
</div> </div>
<div id="create-send-to-container"> <div id="create-send-to-container">
<label class="label supra">{{ .strings.inviteSendToEmail }}</label> <label class="label supra">{{ .strings.inviteSendToEmail }}</label>
<div class="flex-expand mb-1 mt-0.5"> <div class="flex-expand mb-2 mt-4">
{{ if .discordEnabled }} {{ if .discordEnabled }}
<input type="text" id="create-send-to" class="input ~neutral @low mr-1" placeholder="example@example.com | user#1234"> <input type="text" id="create-send-to" class="input ~neutral @low mr-2" placeholder="example@example.com | user#1234">
<span id="create-send-to-search" class="button ~neutral @low mr-1"> <span id="create-send-to-search" class="button ~neutral @low mr-2">
<i class="icon ri-search-2-line" title="{{ .strings.search }}"></i> <i class="icon ri-search-2-line" title="{{ .strings.search }}"></i>
</span> </span>
{{ else }} {{ else }}
<input type="email" id="create-send-to" class="input ~neutral @low mr-1" placeholder="example@example.com"> <input type="email" id="create-send-to" class="input ~neutral @low mr-2" placeholder="example@example.com">
{{ end }} {{ end }}
<label for="create-send-to-enabled" class="button ~neutral @low"> <label for="create-send-to-enabled" class="button ~neutral @low">
<input type="checkbox" id="create-send-to-enabled" aria-label="Send to address enabled"> <input type="checkbox" id="create-send-to-enabled" aria-label="Send to address enabled">
@ -568,16 +568,16 @@
</div> </div>
</div> </div>
<div id="tab-accounts" class="unfocused"> <div id="tab-accounts" class="unfocused">
<div class="card ~neutral @low accounts mb-1"> <div class="card ~neutral @low accounts mb-4">
<div class="flex-expand row"> <div class="flex-expand row">
<div class="row"> <div class="row">
<span class="text-3xl font-bold mr-1 col">{{ .strings.accounts }}</span> <span class="text-3xl font-bold mr-2 col">{{ .strings.accounts }}</span>
<input type="search" class="col sm field ~neutral @low input search ml-1 mr-1" id="accounts-search" placeholder="{{ .strings.search }}"> <input type="search" class="col sm field ~neutral @low input search ml-2 mr-2" id="accounts-search" placeholder="{{ .strings.search }}">
</div> </div>
<div class="row"> <div class="row">
<span class="col sm button ~neutral @low center mb-0.5" id="accounts-add-user">{{ .quantityStrings.addUser.Singular }}</span> <span class="col sm button ~neutral @low center mb-2" id="accounts-add-user">{{ .quantityStrings.addUser.Singular }}</span>
<div id="accounts-announce-dropdown" class="col sm dropdown" tabindex="0"> <div id="accounts-announce-dropdown" class="col sm dropdown" tabindex="0">
<span class="h-100 sm button ~info @low center mb-0.5" id="accounts-announce">{{ .strings.announce }}</span> <span class="h-100 sm button ~info @low center mb-2" id="accounts-announce">{{ .strings.announce }}</span>
<div class="dropdown-display"> <div class="dropdown-display">
<div class="card ~neutral @low"> <div class="card ~neutral @low">
<span class="supra sm">{{ .strings.templates }}</span> <span class="supra sm">{{ .strings.templates }}</span>
@ -585,21 +585,21 @@
</div> </div>
</div> </div>
</div> </div>
<span class="col sm button ~urge @low center mb-0.5" id="accounts-modify-user">{{ .strings.modifySettings }}</span> <span class="col sm button ~urge @low center mb-2" id="accounts-modify-user">{{ .strings.modifySettings }}</span>
<span class="col sm button ~warning @low center mb-0.5" id="accounts-extend-expiry">{{ .strings.extendExpiry }}</span> <span class="col sm button ~warning @low center mb-2" id="accounts-extend-expiry">{{ .strings.extendExpiry }}</span>
<div id="accounts-disable-enable-dropdown" class="col sm dropdown manual" tabindex="0"> <div id="accounts-disable-enable-dropdown" class="col sm dropdown manual" tabindex="0">
<span class="h-100 sm button ~positive @low center mb-0.5" id="accounts-disable-enable">{{ .strings.disable }}</span> <span class="h-100 sm button ~positive @low center mb-2" id="accounts-disable-enable">{{ .strings.disable }}</span>
<div class="dropdown-display"> <div class="dropdown-display">
<div class="card ~neutral @low"> <div class="card ~neutral @low">
<span class="button ~neutral sm full-width accounts-announce-template-button" id="accounts-enable-expiry">{{ .strings.setExpiry }}</span> <span class="button ~neutral sm full-width accounts-announce-template-button" id="accounts-enable-expiry">{{ .strings.setExpiry }}</span>
</div> </div>
</div> </div>
</div> </div>
<span class="col sm button ~info @low center mb-0.5 unfocused" id="accounts-send-pwr">{{ .strings.sendPWR }}</span> <span class="col sm button ~info @low center mb-2 unfocused" id="accounts-send-pwr">{{ .strings.sendPWR }}</span>
<span class="col sm button ~critical @low center mb-0.5" id="accounts-delete-user">{{ .quantityStrings.deleteUser.Singular }}</span> <span class="col sm button ~critical @low center mb-2" id="accounts-delete-user">{{ .quantityStrings.deleteUser.Singular }}</span>
</div> </div>
</div> </div>
<div class="card ~neutral @low accounts-header table-responsive mt-0.5"> <div class="card ~neutral @low accounts-header table-responsive mt-8">
<table class="table"> <table class="table">
<thead> <thead>
<tr> <tr>
@ -629,9 +629,9 @@
<div class="flex-expand"> <div class="flex-expand">
<div class="flex-row"> <div class="flex-row">
<span class="heading">{{ .strings.settings }}</span> <span class="heading">{{ .strings.settings }}</span>
<label for="settings-advanced-enabled" class="button ~neutral @low ml-1"> <label for="settings-advanced-enabled" class="button ~neutral @low ml-2">
<input type="checkbox" id="settings-advanced-enabled" aria-label="Advanced settings enabled"> <input type="checkbox" id="settings-advanced-enabled" aria-label="Advanced settings enabled">
<span class="ml-0.5">{{ .strings.advancedSettings }} </span> <span class="ml-2">{{ .strings.advancedSettings }} </span>
</label> </label>
</div> </div>
<div> <div>
@ -641,9 +641,9 @@
</div> </div>
<div class="row"> <div class="row">
<div class="card ~neutral @low col" id="settings-sidebar"> <div class="card ~neutral @low col" id="settings-sidebar">
<aside class="aside sm ~info mb-0.5" id="settings-message">Note: <span class="badge ~critical">*</span> indicates a required field, <span class="badge ~info">R</span> indicates changes require a restart.</aside> <aside class="aside sm ~info mb-2" id="settings-message">Note: <span class="badge ~critical">*</span> indicates a required field, <span class="badge ~info">R</span> indicates changes require a restart.</aside>
<span class="button ~neutral @low settings-section-button mb-0.5" id="setting-about"><span class="flex">{{ .strings.aboutProgram }} <i class="ri-information-line ml-0.5"></i></span></span> <span class="button ~neutral @low settings-section-button mb-2" id="setting-about"><span class="flex">{{ .strings.aboutProgram }} <i class="ri-information-line ml-2"></i></span></span>
<span class="button ~neutral @low settings-section-button mb-0.5" id="setting-profiles"><span class="flex">{{ .strings.userProfiles }} <i class="ri-user-line ml-0.5"></i></span></span> <span class="button ~neutral @low settings-section-button mb-2" id="setting-profiles"><span class="flex">{{ .strings.userProfiles }} <i class="ri-user-line ml-2"></i></span></span>
</div> </div>
<div class="card ~neutral @low col overflow" id="settings-panel"></div> <div class="card ~neutral @low col overflow" id="settings-panel"></div>
</div> </div>

12
html/crash.html
View File

@ -13,22 +13,22 @@
<section class="section ~critical"> <section class="section ~critical">
<span class="heading">Crash report for jfa-go</span> <span class="heading">Crash report for jfa-go</span>
{{ if .Err }} {{ if .Err }}
<div class="monospace pre-line mt-1 mb-1"> <div class="monospace pre-line mt-4 mb-4">
Error: {{ .Err }} Error: {{ .Err }}
</div> </div>
{{ end }} {{ end }}
<a class="button ~critical mb-1" target="_blank" href="https://github.com/hrfee/jfa-go/issues/new/choose">Create an Issue</a> <a class="button ~critical mb-4" target="_blank" href="https://github.com/hrfee/jfa-go/issues/new/choose">Create an Issue</a>
</section> </section>
<section class="section ~neutral @low"> <section class="section ~neutral @low">
<div class="flex-expand"> <div class="flex-expand">
<span class="subheading">Full Log</span> <span class="subheading">Full Log</span>
<span class="button ~urge ml-0.5" id="copy-log">Copy</span> <span class="button ~urge ml-4" id="copy-log">Copy</span>
</div> </div>
<div class="row mb-1"> <div class="row mb-4">
<label class="col mr-1"> <label class="col mr-4">
<span class="button ~neutral @high supra full-width center" id="button-log-normal">Normal</span> <span class="button ~neutral @high supra full-width center" id="button-log-normal">Normal</span>
</label> </label>
<label class="col mr-1"> <label class="col mr-4">
<span class="button ~neutral @low supra full-width center" id="button-log-sanitized">Sanitized</span> <span class="button ~neutral @low supra full-width center" id="button-log-sanitized">Sanitized</span>
</label> </label>
</div> </div>

6
html/create-success.html
View File

@ -7,9 +7,9 @@
</head> </head>
<body class="section"> <body class="section">
<div class="page-container"> <div class="page-container">
<div class="card ~neutral @low mb-1"> <div class="card ~neutral @low mb-4">
<span class="heading mb-1">{{ .strings.successHeader }}</span> <span class="heading mb-4">{{ .strings.successHeader }}</span>
<p class="content mb-1">{{ .successMessage }}</p> <p class="content mb-4">{{ .successMessage }}</p>
<a class="button ~urge @low full-width center supra submit" href="{{ .jfLink }}" id="create-success-button">{{ .strings.successContinueButton }}</a> <a class="button ~urge @low full-width center supra submit" href="{{ .jfLink }}" id="create-success-button">{{ .strings.successContinueButton }}</a>
</div> </div>
<i class="content">{{ .contactMessage }}</i> <i class="content">{{ .contactMessage }}</i>

56
html/form.html
View File

@ -14,68 +14,68 @@
<body class="max-w-full overflow-x-hidden section"> <body class="max-w-full overflow-x-hidden section">
<div id="modal-success" class="modal"> <div id="modal-success" class="modal">
<div class="modal-content card"> <div class="modal-content card">
<span class="heading mb-1">{{ if .passwordReset }}{{ .strings.passwordReset }}{{ else }}{{ .strings.successHeader }}{{ end }}</span> <span class="heading mb-4">{{ if .passwordReset }}{{ .strings.passwordReset }}{{ else }}{{ .strings.successHeader }}{{ end }}</span>
<p class="content mb-1">{{ if .passwordReset }}{{ .strings.youCanLoginPassword }}{{ else }}{{ .successMessage }}{{ end }}</p> <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> <a class="button ~urge @low full-width center supra submit" href="{{ .jfLink }}" id="create-success-button">{{ .strings.continue }}</a>
</div> </div>
</div> </div>
<div id="modal-confirmation" class="modal"> <div id="modal-confirmation" class="modal">
<div class="modal-content card"> <div class="modal-content card">
<span class="heading mb-1">{{ .strings.confirmationRequired }}</span> <span class="heading mb-4">{{ .strings.confirmationRequired }}</span>
<p class="content mb-1">{{ .strings.confirmationRequiredMessage }}</p> <p class="content mb-4">{{ .strings.confirmationRequiredMessage }}</p>
</div> </div>
</div> </div>
{{ if .telegramEnabled }} {{ if .telegramEnabled }}
<div id="modal-telegram" class="modal"> <div id="modal-telegram" class="modal">
<div class="modal-content card"> <div class="modal-content card">
<span class="heading mb-1">{{ .strings.linkTelegram }}</span> <span class="heading mb-4">{{ .strings.linkTelegram }}</span>
<p class="content mb-1">{{ .strings.sendPIN }}</p> <p class="content mb-4">{{ .strings.sendPIN }}</p>
<h1 class="ac">{{ .telegramPIN }}</h1> <h1 class="ac">{{ .telegramPIN }}</h1>
<a class="subheading link-center" href="{{ .telegramURL }}" target="_blank"> <a class="subheading link-center" href="{{ .telegramURL }}" target="_blank">
<span class="shield ~info mr-1"> <span class="shield ~info mr-4">
<span class="icon"> <span class="icon">
<i class="ri-telegram-line"></i> <i class="ri-telegram-line"></i>
</span> </span>
</span> </span>
&#64;{{ .telegramUsername }} &#64;{{ .telegramUsername }}
</a> </a>
<span class="button ~info @low full-width center mt-1" id="telegram-waiting">{{ .strings.success }}</span> <span class="button ~info @low full-width center mt-4" id="telegram-waiting">{{ .strings.success }}</span>
</div> </div>
</div> </div>
{{ end }} {{ end }}
{{ if .discordEnabled }} {{ if .discordEnabled }}
<div id="modal-discord" class="modal"> <div id="modal-discord" class="modal">
<div class="modal-content card"> <div class="modal-content card">
<span class="heading mb-1">{{ .strings.linkDiscord }}</span> <span class="heading mb-4">{{ .strings.linkDiscord }}</span>
<p class="content mb-1"> {{ .discordSendPINMessage }}</p> <p class="content mb-4"> {{ .discordSendPINMessage }}</p>
<h1 class="ac">{{ .discordPIN }}</h1> <h1 class="ac">{{ .discordPIN }}</h1>
<a id="discord-invite"></a> <a id="discord-invite"></a>
<span class="button ~info @low full-width center mt-1" id="discord-waiting">{{ .strings.success }}</span> <span class="button ~info @low full-width center mt-4" id="discord-waiting">{{ .strings.success }}</span>
</div> </div>
</div> </div>
{{ end }} {{ end }}
{{ if .matrixEnabled }} {{ if .matrixEnabled }}
<div id="modal-matrix" class="modal"> <div id="modal-matrix" class="modal">
<div class="modal-content card"> <div class="modal-content card">
<span class="heading mb-1">{{ .strings.linkMatrix }}</span> <span class="heading mb-4">{{ .strings.linkMatrix }}</span>
<p class="content mb-1"> {{ .strings.matrixEnterUser }}</p> <p class="content mb-4"> {{ .strings.matrixEnterUser }}</p>
<input type="text" class="input ~neutral @high" placeholder="@user:riot.im" id="matrix-userid"> <input type="text" class="input ~neutral @high" placeholder="@user:riot.im" id="matrix-userid">
<div class="subheading link-center mt-1"> <div class="subheading link-center mt-4">
<span class="shield ~info mr-1"> <span class="shield ~info mr-4">
<span class="icon"> <span class="icon">
<i class="ri-chat-3-line"></i> <i class="ri-chat-3-line"></i>
</span> </span>
</span> </span>
{{ .matrixUser }} {{ .matrixUser }}
</div> </div>
<span class="button ~info @low full-width center mt-1" id="matrix-send">{{ .strings.submit }}</span> <span class="button ~info @low full-width center mt-4" id="matrix-send">{{ .strings.submit }}</span>
</div> </div>
</div> </div>
{{ end }} {{ end }}
<span class="dropdown" tabindex="0" id="lang-dropdown"> <span class="dropdown" tabindex="0" id="lang-dropdown">
<span class="button ~urge dropdown-button"> <span class="button ~urge dropdown-button">
<i class="ri-global-line"></i> <i class="ri-global-line"></i>
<span class="ml-1 chev"></span> <span class="ml-2 chev"></span>
</span> </span>
<div class="dropdown-display"> <div class="dropdown-display">
<div class="card ~neutral @low" id="lang-list"> <div class="card ~neutral @low" id="lang-list">
@ -110,37 +110,37 @@
{{ if not .passwordReset }} {{ if not .passwordReset }}
<label class="label supra"> <label class="label supra">
{{ .strings.username }} {{ .strings.username }}
<input type="text" class="input ~neutral @high mt-0.5 mb-1" placeholder="{{ .strings.username }}" id="create-username" aria-label="{{ .strings.username }}"> <input type="text" class="input ~neutral @high mt-8 mb-4" placeholder="{{ .strings.username }}" id="create-username" aria-label="{{ .strings.username }}">
</label> </label>
<label class="label supra" for="create-email">{{ .strings.emailAddress }}</label> <label class="label supra" for="create-email">{{ .strings.emailAddress }}</label>
<input type="email" class="input ~neutral @high mt-0.5 mb-1" placeholder="{{ .strings.emailAddress }}" id="create-email" aria-label="{{ .strings.emailAddress }}" value="{{ .email }}"> <input type="email" class="input ~neutral @high mt-8 mb-4" placeholder="{{ .strings.emailAddress }}" id="create-email" aria-label="{{ .strings.emailAddress }}" value="{{ .email }}">
{{ if .telegramEnabled }} {{ if .telegramEnabled }}
<span class="button ~info @low full-width center mb-1" id="link-telegram">{{ .strings.linkTelegram }}</span> <span class="button ~info @low full-width center mb-4" id="link-telegram">{{ .strings.linkTelegram }}</span>
{{ end }} {{ end }}
{{ if .discordEnabled }} {{ if .discordEnabled }}
<span class="button ~info @low full-width center mb-1" id="link-discord">{{ .strings.linkDiscord }}</span> <span class="button ~info @low full-width center mb-4" id="link-discord">{{ .strings.linkDiscord }}</span>
{{ end }} {{ end }}
{{ if .matrixEnabled }} {{ if .matrixEnabled }}
<span class="button ~info @low full-width center mb-1" id="link-matrix">{{ .strings.linkMatrix }}</span> <span class="button ~info @low full-width center mb-4" id="link-matrix">{{ .strings.linkMatrix }}</span>
{{ end }} {{ end }}
{{ if or (.telegramEnabled) (or .discordEnabled .matrixEnabled) }} {{ if or (.telegramEnabled) (or .discordEnabled .matrixEnabled) }}
<div id="contact-via" class="unfocused"> <div id="contact-via" class="unfocused">
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="radio" name="contact-via" value="email"><span>Contact through Email</span> <input type="radio" name="contact-via" value="email"><span>Contact through Email</span>
</label> </label>
{{ if .telegramEnabled }} {{ if .telegramEnabled }}
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="radio" name="contact-via" value="telegram" id="contact-via-telegram"><span>Contact through Telegram</span> <input type="radio" name="contact-via" value="telegram" id="contact-via-telegram"><span>Contact through Telegram</span>
</label> </label>
{{ end }} {{ end }}
{{ if .discordEnabled }} {{ if .discordEnabled }}
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="radio" name="contact-via" value="discord" id="contact-via-discord"><span>Contact through Discord</span> <input type="radio" name="contact-via" value="discord" id="contact-via-discord"><span>Contact through Discord</span>
</label> </label>
{{ end }} {{ end }}
{{ if .matrixEnabled }} {{ if .matrixEnabled }}
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="radio" name="contact-via" value="matrix" id="contact-via-matrix"><span>Contact through Matrix</span> <input type="radio" name="contact-via" value="matrix" id="contact-via-matrix"><span>Contact through Matrix</span>
</label> </label>
{{ end }} {{ end }}
@ -148,10 +148,10 @@
{{ end }} {{ end }}
{{ end }} {{ end }}
<label class="label supra" for="create-password">{{ .strings.password }}</label> <label class="label supra" for="create-password">{{ .strings.password }}</label>
<input type="password" class="input ~neutral @high mt-0.5 mb-1" placeholder="{{ .strings.password }}" id="create-password" aria-label="{{ .strings.password }}"> <input type="password" class="input ~neutral @high mt-8 mb-4" placeholder="{{ .strings.password }}" id="create-password" aria-label="{{ .strings.password }}">
<label class="label supra" for="create-reenter-password">{{ .strings.reEnterPassword }}</label> <label class="label supra" for="create-reenter-password">{{ .strings.reEnterPassword }}</label>
<input type="password" class="input ~neutral @high mt-0.5 mb-1" placeholder="{{ .strings.password }}" id="create-reenter-password" aria-label="{{ .strings.reEnterPassword }}"> <input type="password" class="input ~neutral @high mt-8 mb-4" placeholder="{{ .strings.password }}" id="create-reenter-password" aria-label="{{ .strings.reEnterPassword }}">
<label> <label>
<input type="submit" class="unfocused"> <input type="submit" class="unfocused">
<span class="button ~urge @low full-width center supra submit"> <span class="button ~urge @low full-width center supra submit">

8
html/password-reset.html
View File

@ -12,15 +12,15 @@
</div> </div>
{{ end }} {{ end }}
<div class="page-container"> <div class="page-container">
<div class="card ~neutral @low mb-1"> <div class="card ~neutral @low mb-4">
<span class="heading mb-1"> <span class="heading mb-4">
{{ if .success }} {{ if .success }}
{{ .strings.passwordReset }} {{ .strings.passwordReset }}
{{ else }} {{ else }}
{{ .strings.resetFailed }} {{ .strings.resetFailed }}
{{ end }} {{ end }}
</span> </span>
<p class="content mb-1"> <p class="content mb-4">
{{ if .success }} {{ if .success }}
{{ if .ombiEnabled }} {{ if .ombiEnabled }}
{{ .strings.youCanLoginOmbi }} {{ .strings.youCanLoginOmbi }}
@ -35,7 +35,7 @@
<aside class="aside ~warning"> <aside class="aside ~warning">
{{ .strings.changeYourPassword }} {{ .strings.changeYourPassword }}
</aside> </aside>
<span class="button ~urge @low full-width center supra p-1 mt-1" id="pin" title="{{ .strings.copy }}">{{ .pin }}</span> <span class="button ~urge @low full-width center supra p-4 mt-4" id="pin" title="{{ .strings.copy }}">{{ .pin }}</span>
{{ end }} {{ end }}
</div> </div>
<i class="content">{{ .contactMessage }}</i> <i class="content">{{ .contactMessage }}</i>

266
html/setup.html
View File

@ -10,7 +10,7 @@
<span class="dropdown" tabindex="0" id="lang-dropdown"> <span class="dropdown" tabindex="0" id="lang-dropdown">
<span class="button ~urge dropdown-button"> <span class="button ~urge dropdown-button">
<i class="ri-global-line"></i> <i class="ri-global-line"></i>
<span class="ml-1 chev"></span> <span class="ml-2 chev"></span>
</span> </span>
<div class="dropdown-display"> <div class="dropdown-display">
<div class="card ~neutral @low" id="lang-list"> <div class="card ~neutral @low" id="lang-list">
@ -18,7 +18,7 @@
</div> </div>
</span> </span>
<div class="page-container" id="page-container"> <div class="page-container" id="page-container">
<div class="card ~neutral @low mb-1"> <div class="card ~neutral @low mb-4">
<div class="row"> <div class="row">
<img class="banner header" src="banner.svg" alt="jfa-go" /> <img class="banner header" src="banner.svg" alt="jfa-go" />
</div> </div>
@ -33,26 +33,26 @@
<span class="button ~urge @low next">{{ .lang.StartPage.start }}</span> <span class="button ~urge @low next">{{ .lang.StartPage.start }}</span>
</section> </section>
</div> </div>
<div class="card ~neutral @low mb-1 unfocused"> <div class="card ~neutral @low mb-4 unfocused">
<span class="heading">{{ .lang.Language.title }}</span> <span class="heading">{{ .lang.Language.title }}</span>
<p class="content" id="language-description"></p> <p class="content" id="language-description"></p>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Language.defaultAdminLang }}</span> <span class="mt-8">{{ .lang.Language.defaultAdminLang }}</span>
<div class="select ~neutral @low mt-0.5 mb-1"> <div class="select ~neutral @low mt-8 mb-4">
<select id="ui-language-admin"> <select id="ui-language-admin">
</select> </select>
</div> </div>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Language.defaultFormLang }}</span> <span class="mt-8">{{ .lang.Language.defaultFormLang }}</span>
<div class="select ~neutral @low mt-0.5 mb-1"> <div class="select ~neutral @low mt-8 mb-4">
<select id="ui-language-form"> <select id="ui-language-form">
</select> </select>
</div> </div>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Language.defaultEmailLang }}</span> <span class="mt-8">{{ .lang.Language.defaultEmailLang }}</span>
<div class="select ~neutral @low mt-0.5 mb-1"> <div class="select ~neutral @low mt-8 mb-4">
<select id="email-language"> <select id="email-language">
</select> </select>
</div> </div>
@ -62,34 +62,34 @@
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span> <span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
</section> </section>
</div> </div>
<div class="card ~neutral @low mb-1 unfocused"> <div class="card ~neutral @low mb-4 unfocused">
<span class="heading">{{ .lang.General.title }}</span> <span class="heading">{{ .lang.General.title }}</span>
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.General.listenAddress }}</span> <span class="mt-8">{{ .lang.General.listenAddress }}</span>
<input type="url" class="input ~neutral @low mt-0.5 mb-1" id="ui-host" value="0.0.0.0"> <input type="url" class="input ~neutral @low mt-8 mb-4" id="ui-host" value="0.0.0.0">
</label> </label>
<label class="row switch"> <label class="row switch">
<input type="checkbox" id="advanced-tls"><span>{{ .lang.General.useHTTPS }}</span> <input type="checkbox" id="advanced-tls"><span>{{ .lang.General.useHTTPS }}</span>
</label> </label>
<p class="support mb-1">{{ .lang.General.useHTTPSNotice }}</p> <p class="support mb-4">{{ .lang.General.useHTTPSNotice }}</p>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.General.pathToCertificate }}</span> <span class="mt-8">{{ .lang.General.pathToCertificate }}</span>
<input type="text" class="input ~neutral @low mt-0.5 mb-1" id="advanced-tls_cert"> <input type="text" class="input ~neutral @low mt-8 mb-4" id="advanced-tls_cert">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.General.pathToKeyFile }}</span> <span class="mt-8">{{ .lang.General.pathToKeyFile }}</span>
<input type="text" class="input ~neutral @low mt-0.5 mb-1" id="advanced-tls_key"> <input type="text" class="input ~neutral @low mt-8 mb-4" id="advanced-tls_key">
</label> </label>
<span class="heading">{{ .lang.Updates.title }}</span> <span class="heading">{{ .lang.Updates.title }}</span>
<p class="content" id="updates-description"></p> <p class="content" id="updates-description"></p>
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="checkbox" id="updates-enabled" checked><span>{{ .lang.Strings.enabled }}</span> <input type="checkbox" id="updates-enabled" checked><span>{{ .lang.Strings.enabled }}</span>
</label> </label>
<label class="label"> <label class="label">
<span>{{ .lang.Updates.updateChannel }}</span> <span>{{ .lang.Updates.updateChannel }}</span>
<div class="select ~neutral @low mt-0.5 mb-1"> <div class="select ~neutral @low mt-8 mb-4">
<select id="updates-channel"> <select id="updates-channel">
<option value="stable">{{ .lang.Updates.stable }}</option> <option value="stable">{{ .lang.Updates.stable }}</option>
<option value="unstable">{{ .lang.Updates.unstable }}</option> <option value="unstable">{{ .lang.Updates.unstable }}</option>
@ -99,21 +99,21 @@
</div> </div>
<div class="col"> <div class="col">
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.port }}</span> <span class="mt-8">{{ .lang.Strings.port }}</span>
<input type="number" class="input ~neutral @low mt-0.5 mb-1" id="ui-port" value="8056"> <input type="number" class="input ~neutral @low mt-8 mb-4" id="ui-port" value="8056">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.General.httpsPort }}</span> <span class="mt-8">{{ .lang.General.httpsPort }}</span>
<input type="number" class="input ~neutral @low mt-0.5 mb-1" id="advanced-tls_port" value="8057"> <input type="number" class="input ~neutral @low mt-8 mb-4" id="advanced-tls_port" value="8057">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.General.urlBase }} ({{ .lang.Strings.optional }})</span> <span class="mt-8">{{ .lang.General.urlBase }} ({{ .lang.Strings.optional }})</span>
<input type="url" class="input ~neutral @low mt-0.5" id="ui-url_base"> <input type="url" class="input ~neutral @low mt-8" id="ui-url_base">
<p class="support mb-1">{{ .lang.General.urlBaseNotice }}</p> <p class="support mb-4">{{ .lang.General.urlBaseNotice }}</p>
</label> </label>
<label class="label"> <label class="label">
<span>{{ .lang.Strings.theme }}</span> <span>{{ .lang.Strings.theme }}</span>
<div class="select ~neutral @low mt-0.5 mb-1"> <div class="select ~neutral @low mt-8 mb-4">
<select id="ui-theme"> <select id="ui-theme">
<option value="Jellyfin (Dark)">{{ .lang.General.darkTheme }}</option> <option value="Jellyfin (Dark)">{{ .lang.General.darkTheme }}</option>
<option value="Default (Light)">{{ .lang.General.lightTheme }}</option> <option value="Default (Light)">{{ .lang.General.lightTheme }}</option>
@ -127,33 +127,33 @@
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span> <span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
</section> </section>
</div> </div>
<div class="card ~neutral @low mb-1 unfocused"> <div class="card ~neutral @low mb-4 unfocused">
<span class="heading">{{ .lang.Login.title }}</span> <span class="heading">{{ .lang.Login.title }}</span>
<p class="content">{{ .lang.Login.description }}</p> <p class="content">{{ .lang.Login.description }}</p>
<div class="pl-1"> <div class="pl-4">
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="radio" name="ui-jellyfin_login" value="true" checked><span>{{ .lang.Login.authorizeWithJellyfin }}</span> <input type="radio" name="ui-jellyfin_login" value="true" checked><span>{{ .lang.Login.authorizeWithJellyfin }}</span>
</label> </label>
<label class="row switch pl-1 pb-1"> <label class="row switch pl-4 pb-4">
<input type="checkbox" id="ui-admin_only"><span>{{ .lang.Login.adminOnly }}</span> <input type="checkbox" id="ui-admin_only"><span>{{ .lang.Login.adminOnly }}</span>
</label> </label>
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="radio" name="ui-jellyfin_login" value="false"><span>{{ .lang.Login.authorizeManual }}</span> <input type="radio" name="ui-jellyfin_login" value="false"><span>{{ .lang.Login.authorizeManual }}</span>
</label> </label>
</div> </div>
<div id="login-manual"> <div id="login-manual">
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.username }}</span> <span class="mt-8">{{ .lang.Strings.username }}</span>
<input type="text" id="ui-username" class="input ~neutral @low mt-0.5 mb-1" placeholder="{{ .lang.Strings.username }}"> <input type="text" id="ui-username" class="input ~neutral @low mt-8 mb-4" placeholder="{{ .lang.Strings.username }}">
</label> </label>
<label class="label"> <label class="label">
<span>{{ .lang.Strings.password }}</span> <span>{{ .lang.Strings.password }}</span>
<input type="password" id="ui-password" class="input ~neutral @low mt-0.5 mb-1" placeholder="{{ .lang.Strings.password }}"> <input type="password" id="ui-password" class="input ~neutral @low mt-8 mb-4" placeholder="{{ .lang.Strings.password }}">
</label> </label>
<label class="label"> <label class="label">
<span>{{ .lang.Strings.emailAddress }} ({{ .lang.Strings.optional }})</span> <span>{{ .lang.Strings.emailAddress }} ({{ .lang.Strings.optional }})</span>
<input type="email" id="ui-email" class="input ~neutral @low mt-0.5" placeholder="email@address"> <input type="email" id="ui-email" class="input ~neutral @low mt-8" placeholder="email@address">
<span class="support mb-1">{{ .lang.Login.emailNotice }}</span> <span class="support mb-4">{{ .lang.Login.emailNotice }}</span>
</label> </label>
</div> </div>
<section class="section ~neutral banner footer flex-expand middle"> <section class="section ~neutral banner footer flex-expand middle">
@ -161,44 +161,44 @@
<span class="button ~urge @low next">{{ .lang.Strings.next }}</span> <span class="button ~urge @low next">{{ .lang.Strings.next }}</span>
</section> </section>
</div> </div>
<div class="card ~neutral @low mb-1 unfocused"> <div class="card ~neutral @low mb-4 unfocused">
<span class="heading">{{ .lang.JellyfinEmby.title }}</span> <span class="heading">{{ .lang.JellyfinEmby.title }}</span>
<p class="content">{{ .lang.JellyfinEmby.description }}</p> <p class="content">{{ .lang.JellyfinEmby.description }}</p>
<div class="row"> <div class="row">
<div class="col"> <div class="col">
<label class="label"> <label class="label">
<span>{{ .lang.Strings.serverType }}</span> <span>{{ .lang.Strings.serverType }}</span>
<div class="select ~neutral @low mt-0.5"> <div class="select ~neutral @low mt-8">
<select id="jellyfin-type"> <select id="jellyfin-type">
<option value="jellyfin">Jellyfin</option> <option value="jellyfin">Jellyfin</option>
<option value="emby">Emby</option> <option value="emby">Emby</option>
</select> </select>
</div> </div>
<p class="support mb-1">{{ .lang.JellyfinEmby.embyNotice }}</p> <p class="support mb-4">{{ .lang.JellyfinEmby.embyNotice }}</p>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.JellyfinEmby.replaceJellyfin }} ({{ .lang.Strings.optional }})</span> <span class="mt-8">{{ .lang.JellyfinEmby.replaceJellyfin }} ({{ .lang.Strings.optional }})</span>
<input type="text" class="input ~neutral @low mt-0.5" id="jellyfin-substitute_jellyfin_strings"> <input type="text" class="input ~neutral @low mt-8" id="jellyfin-substitute_jellyfin_strings">
<p class="support mb-1">{{ .lang.JellyfinEmby.replaceJellyfinNotice }}</p> <p class="support mb-4">{{ .lang.JellyfinEmby.replaceJellyfinNotice }}</p>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.username }}</span> <span class="mt-8">{{ .lang.Strings.username }}</span>
<input type="text" id="jellyfin-username" class="input ~neutral @low mt-0.5 mb-1" placeholder="{{ .lang.Strings.username }}"> <input type="text" id="jellyfin-username" class="input ~neutral @low mt-8 mb-4" placeholder="{{ .lang.Strings.username }}">
</label> </label>
<label class="label"> <label class="label">
<span>{{ .lang.Strings.password }}</span> <span>{{ .lang.Strings.password }}</span>
<input type="password" id="jellyfin-password" class="input ~neutral @low mt-0.5 mb-1" placeholder="{{ .lang.Strings.password }}"> <input type="password" id="jellyfin-password" class="input ~neutral @low mt-8 mb-4" placeholder="{{ .lang.Strings.password }}">
</label> </label>
</div> </div>
<div class="col"> <div class="col">
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.serverAddress }} ({{ .lang.JellyfinEmby.internal }})</span> <span class="mt-8">{{ .lang.Strings.serverAddress }} ({{ .lang.JellyfinEmby.internal }})</span>
<input type="url" class="input ~neutral @low mt-0.5 mb-1" id="jellyfin-server" placeholder="http://jellyf.in:80"> <input type="url" class="input ~neutral @low mt-8 mb-4" id="jellyfin-server" placeholder="http://jellyf.in:80">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.serverAddress }} ({{ .lang.JellyfinEmby.external }})</span> <span class="mt-8">{{ .lang.Strings.serverAddress }} ({{ .lang.JellyfinEmby.external }})</span>
<input type="url" class="input ~neutral @low mt-0.5" id="jellyfin-public_server" placeholder="https://jellyf.in"> <input type="url" class="input ~neutral @low mt-8" id="jellyfin-public_server" placeholder="https://jellyf.in">
<p class="support mb-1">{{ .lang.JellyfinEmby.addressExternalNotice }}</p> <p class="support mb-4">{{ .lang.JellyfinEmby.addressExternalNotice }}</p>
</label> </label>
</div> </div>
</div> </div>
@ -210,20 +210,20 @@
</div> </div>
</section> </section>
</div> </div>
<div class="card ~neutral @low mb-1 unfocused"> <div class="card ~neutral @low mb-4 unfocused">
<span class="heading">{{ .lang.Ombi.title }}</span> <span class="heading">{{ .lang.Ombi.title }}</span>
<p class="content">{{ .lang.Ombi.description }}</p> <p class="content">{{ .lang.Ombi.description }}</p>
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="checkbox" id="ombi-enabled"><span>{{ .lang.Strings.enabled }}</span> <input type="checkbox" id="ombi-enabled"><span>{{ .lang.Strings.enabled }}</span>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.serverAddress }}</span> <span class="mt-8">{{ .lang.Strings.serverAddress }}</span>
<input type="url" class="input ~neutral @low mt-0.5 mb-1" id="ombi-server" placeholder="ombi.jellyf.in"> <input type="url" class="input ~neutral @low mt-8 mb-4" id="ombi-server" placeholder="ombi.jellyf.in">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.apiKey }}</span> <span class="mt-8">{{ .lang.Strings.apiKey }}</span>
<input type="text" class="input ~neutral @low mt-0.5" id="ombi-api_key"> <input type="text" class="input ~neutral @low mt-8" id="ombi-api_key">
<p class="support mb-1">{{ .lang.Ombi.apiKeyNotice }}</p> <p class="support mb-4">{{ .lang.Ombi.apiKeyNotice }}</p>
</label> </label>
<section class="section ~neutral banner footer flex-expand middle"> <section class="section ~neutral banner footer flex-expand middle">
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span> <span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
@ -232,22 +232,22 @@
</div> </div>
</section> </section>
</div> </div>
<div class="card ~neutral @low mb-1 unfocused"> <div class="card ~neutral @low mb-4 unfocused">
<span class="heading">{{ .lang.Messages.title }}</span> <span class="heading">{{ .lang.Messages.title }}</span>
<p class="content" id="messages-description"></p> <p class="content" id="messages-description"></p>
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="checkbox" id="messages-enabled" checked><span>{{ .lang.Strings.enabled }}</span> <input type="checkbox" id="messages-enabled" checked><span>{{ .lang.Strings.enabled }}</span>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Email.dateFormat }}</span> <span class="mt-8">{{ .lang.Email.dateFormat }}</span>
<input type="text" class="input ~neutral @low mt-0.5" id="email-date_format" value="%d/%m/%y"> <input type="text" class="input ~neutral @low mt-8" id="email-date_format" value="%d/%m/%y">
<p class="support mb-1" id="email-dateformat-notice"></p> <p class="support mb-4" id="email-dateformat-notice"></p>
</label> </label>
<div> <div>
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="radio" name="email-24h" value="true" checked><span>{{ .lang.Strings.time24h }}</span> <input type="radio" name="email-24h" value="true" checked><span>{{ .lang.Strings.time24h }}</span>
</label> </label>
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="radio" name="email-24h" value="false"><span>{{ .lang.Strings.time12h }}</span> <input type="radio" name="email-24h" value="false"><span>{{ .lang.Strings.time12h }}</span>
</label> </label>
</div> </div>
@ -258,7 +258,7 @@
<div class="col"> <div class="col">
<label class="label"> <label class="label">
<span>{{ .lang.Email.method }}</span> <span>{{ .lang.Email.method }}</span>
<div class="select ~neutral @low mt-0.5 mb-1"> <div class="select ~neutral @low mt-8 mb-4">
<select id="email-method"> <select id="email-method">
<option value="">{{ .lang.Strings.disabled }}</option> <option value="">{{ .lang.Strings.disabled }}</option>
<option value="smtp">SMTP</option> <option value="smtp">SMTP</option>
@ -268,15 +268,15 @@
</label> </label>
<label class="row switch"> <label class="row switch">
<input type="checkbox" id="email-no_username"><span>{{ .lang.Email.useEmailAsUsername }}</span> <input type="checkbox" id="email-no_username"><span>{{ .lang.Email.useEmailAsUsername }}</span>
<p class="support mb-1">{{ .lang.Email.useEmailAsUsernameNotice }}</p> <p class="support mb-4">{{ .lang.Email.useEmailAsUsernameNotice }}</p>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Email.fromAddress }}</span> <span class="mt-8">{{ .lang.Email.fromAddress }}</span>
<input type="email" class="input ~neutral @low mt-0.5 mb-1" id="email-address" placeholder="mail@jellyf.in"> <input type="email" class="input ~neutral @low mt-8 mb-4" id="email-address" placeholder="mail@jellyf.in">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Email.senderName }}</span> <span class="mt-8">{{ .lang.Email.senderName }}</span>
<input type="text" class="input ~neutral @low mt-0.5 mb-1" id="email-from" value="Jellyfin"> <input type="text" class="input ~neutral @low mt-8 mb-4" id="email-from" value="Jellyfin">
</label> </label>
</div> </div>
<div class="col"> <div class="col">
@ -284,7 +284,7 @@
<p class="subheading">SMTP</p> <p class="subheading">SMTP</p>
<label class="label"> <label class="label">
<span>{{ .lang.Email.encryption }}</span> <span>{{ .lang.Email.encryption }}</span>
<div class="select ~neutral @low mt-0.5 mb-1"> <div class="select ~neutral @low mt-8 mb-4">
<select id="smtp-encryption"> <select id="smtp-encryption">
<option value="starttls">STARTTLS ({{ .lang.Strings.port }} 587)</option> <option value="starttls">STARTTLS ({{ .lang.Strings.port }} 587)</option>
<option value="ssl_tls">SSL/TLS ({{ .lang.Strings.port }} 465)</option> <option value="ssl_tls">SSL/TLS ({{ .lang.Strings.port }} 465)</option>
@ -292,31 +292,31 @@
</div> </div>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.serverAddress }}</span> <span class="mt-8">{{ .lang.Strings.serverAddress }}</span>
<input type="url" class="input ~neutral @low mt-0.5 mb-1" id="smtp-server" placeholder="smtp.jellyf.in"> <input type="url" class="input ~neutral @low mt-8 mb-4" id="smtp-server" placeholder="smtp.jellyf.in">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.port }}</span> <span class="mt-8">{{ .lang.Strings.port }}</span>
<input type="number" class="input ~neutral @low mt-0.5 mb-1" id="smtp-port" placeholder="587"> <input type="number" class="input ~neutral @low mt-8 mb-4" id="smtp-port" placeholder="587">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.username }}</span> <span class="mt-8">{{ .lang.Strings.username }}</span>
<input type="text" class="input ~neutral @low mt-0.5 mb-1" id="smtp-username"> <input type="text" class="input ~neutral @low mt-8 mb-4" id="smtp-username">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.password }}</span> <span class="mt-8">{{ .lang.Strings.password }}</span>
<input type="password" class="input ~neutral @low mt-0.5 mb-1" id="smtp-password"> <input type="password" class="input ~neutral @low mt-8 mb-4" id="smtp-password">
</label> </label>
</div> </div>
<div id="email-mailgun"> <div id="email-mailgun">
<p class="subheading">Mailgun</p> <p class="subheading">Mailgun</p>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Email.mailgunApiURL }}</span> <span class="mt-8">{{ .lang.Email.mailgunApiURL }}</span>
<input type="url" class="input ~neutral @low mt-0.5 mb-1" id="mailgun-api_url" placeholder="https://api.eu.mailgun.net/v3/mail.jellyf.in/messages"> <input type="url" class="input ~neutral @low mt-8 mb-4" id="mailgun-api_url" placeholder="https://api.eu.mailgun.net/v3/mail.jellyf.in/messages">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.apiKey }}</span> <span class="mt-8">{{ .lang.Strings.apiKey }}</span>
<input type="text" class="input ~neutral @low mt-0.5 mb-1" id="mailgun-api_key"> <input type="text" class="input ~neutral @low mt-8 mb-4" id="mailgun-api_key">
</label> </label>
</div> </div>
</div> </div>
@ -329,20 +329,20 @@
</div> </div>
</section> </section>
</div> </div>
<div class="card ~neutral @low mb-1 unfocused related-to-email"> <div class="card ~neutral @low mb-4 unfocused related-to-email">
<span class="heading">{{ .lang.Notifications.title }}</span> <span class="heading">{{ .lang.Notifications.title }}</span>
<p class="content">{{ .lang.Notifications.description }}</p> <p class="content">{{ .lang.Notifications.description }}</p>
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="checkbox" id="notifications-enabled"><span>{{ .lang.Strings.enabled }}</span> <input type="checkbox" id="notifications-enabled"><span>{{ .lang.Strings.enabled }}</span>
</label> </label>
<span class="heading">{{ .lang.WelcomeEmails.title }}</span> <span class="heading">{{ .lang.WelcomeEmails.title }}</span>
<p class="content">{{ .lang.WelcomeEmails.description }}</p> <p class="content">{{ .lang.WelcomeEmails.description }}</p>
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="checkbox" id="welcome_email-enabled"><span>{{ .lang.Strings.enabled }}</span> <input type="checkbox" id="welcome_email-enabled"><span>{{ .lang.Strings.enabled }}</span>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.emailSubject }}</span> <span class="mt-8">{{ .lang.Strings.emailSubject }}</span>
<input type="text" class="input ~neutral @low mt-0.5 mb-1" id="welcome_email-subject" placeholder="{{ .emailLang.WelcomeEmail.title }}"> <input type="text" class="input ~neutral @low mt-8 mb-4" id="welcome_email-subject" placeholder="{{ .emailLang.WelcomeEmail.title }}">
</label> </label>
<section class="section ~neutral banner footer flex-expand middle"> <section class="section ~neutral banner footer flex-expand middle">
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span> <span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
@ -351,19 +351,19 @@
</div> </div>
</section> </section>
</div> </div>
<div class="card ~neutral @low mb-1 unfocused related-to-email"> <div class="card ~neutral @low mb-4 unfocused related-to-email">
<span class="heading">{{ .lang.InviteEmails.title }}</span> <span class="heading">{{ .lang.InviteEmails.title }}</span>
<p class="content">{{ .lang.InviteEmails.description }}</p> <p class="content">{{ .lang.InviteEmails.description }}</p>
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="checkbox" id="invite_emails-enabled"><span>{{ .lang.Strings.enabled }}</span> <input type="checkbox" id="invite_emails-enabled"><span>{{ .lang.Strings.enabled }}</span>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.URL }}</span> <span class="mt-8">{{ .lang.Strings.URL }}</span>
<input type="url" class="input ~neutral @low mt-0.5 mb-1" id="invite_emails-url_base" placeholder="https://accounts.jellyf.in/invite"> <input type="url" class="input ~neutral @low mt-8 mb-4" id="invite_emails-url_base" placeholder="https://accounts.jellyf.in/invite">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.Strings.emailSubject }}</span> <span class="mt-8">{{ .lang.Strings.emailSubject }}</span>
<input type="text" class="input ~neutral @low mt-0.5 mb-1" id="invite_emails-subject" placeholder="{{ .emailLang.InviteEmail.title }}"> <input type="text" class="input ~neutral @low mt-8 mb-4" id="invite_emails-subject" placeholder="{{ .emailLang.InviteEmail.title }}">
</label> </label>
<section class="section ~neutral banner footer flex-expand middle"> <section class="section ~neutral banner footer flex-expand middle">
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span> <span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
@ -372,35 +372,35 @@
</div> </div>
</section> </section>
</div> </div>
<div id="password-resets" class="card ~neutral @low mb-1 unfocused related-to-email"> <div id="password-resets" class="card ~neutral @low mb-4 unfocused related-to-email">
<span class="heading">{{ .lang.PasswordResets.title }}</span> <span class="heading">{{ .lang.PasswordResets.title }}</span>
<p class="content">{{ .lang.PasswordResets.description }}</p> <p class="content">{{ .lang.PasswordResets.description }}</p>
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="checkbox" id="password_resets-enabled"><span>{{ .lang.Strings.enabled }}</span> <input type="checkbox" id="password_resets-enabled"><span>{{ .lang.Strings.enabled }}</span>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.PasswordResets.pathToJellyfin }}</span> <span class="mt-8">{{ .lang.PasswordResets.pathToJellyfin }}</span>
<input type="text" class="input ~neutral @low mt-0.5" id="password_resets-watch_directory" placeholder="/config/jellyfin"> <input type="text" class="input ~neutral @low mt-8" id="password_resets-watch_directory" placeholder="/config/jellyfin">
<p class="support mb-1">{{ .lang.PasswordResets.pathToJellyfinNotice }}</p> <p class="support mb-4">{{ .lang.PasswordResets.pathToJellyfinNotice }}</p>
</label> </label>
<label class="switch"> <label class="switch">
<input type="checkbox" id="password_resets-link_reset"><span>{{ .lang.PasswordResets.resetLinks }}</span> <input type="checkbox" id="password_resets-link_reset"><span>{{ .lang.PasswordResets.resetLinks }}</span>
<p class="support mb-1">{{ .lang.PasswordResets.resetLinksNotice }}</p> <p class="support mb-4">{{ .lang.PasswordResets.resetLinksNotice }}</p>
</label> </label>
<label class="switch"> <label class="switch">
<input type="checkbox" id="password_resets-set_password"><span>{{ .lang.PasswordResets.setPassword }}</span> <input type="checkbox" id="password_resets-set_password"><span>{{ .lang.PasswordResets.setPassword }}</span>
<p class="support mb-1">{{ .lang.PasswordResets.setPasswordNotice }}</p> <p class="support mb-4">{{ .lang.PasswordResets.setPasswordNotice }}</p>
</label> </label>
<label class="label"> <label class="label">
<p class="mt-0.5">{{ .lang.PasswordResets.resetLinksLanguage }}</p> <p class="mt-8">{{ .lang.PasswordResets.resetLinksLanguage }}</p>
<div class="select ~neutral @low mt-0.5 mb-1"> <div class="select ~neutral @low mt-8 mb-4">
<select id="password_resets-language"> <select id="password_resets-language">
</select> </select>
</div> </div>
</label> </label>
<label class="row label"> <label class="row label">
<span class="mt-0.5">{{ .lang.Strings.emailSubject }}</span> <span class="mt-8">{{ .lang.Strings.emailSubject }}</span>
<input type="text" class="input ~neutral @low mt-0.5 mb-1" id="password_resets-subject" placeholder="{{ .emailLang.PasswordReset.title }}"> <input type="text" class="input ~neutral @low mt-8 mb-4" id="password_resets-subject" placeholder="{{ .emailLang.PasswordReset.title }}">
</label> </label>
<section class="section ~neutral banner footer flex-expand middle"> <section class="section ~neutral banner footer flex-expand middle">
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span> <span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
@ -409,31 +409,31 @@
</div> </div>
</section> </section>
</div> </div>
<div class="card ~neutral @low mb-1 unfocused"> <div class="card ~neutral @low mb-4 unfocused">
<span class="heading">{{ .lang.PasswordValidation.title }}</span> <span class="heading">{{ .lang.PasswordValidation.title }}</span>
<p class="content">{{ .lang.PasswordValidation.description }}</p> <p class="content">{{ .lang.PasswordValidation.description }}</p>
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="checkbox" id="password_validation-enabled" checked><span>{{ .lang.Strings.enabled }}</span> <input type="checkbox" id="password_validation-enabled" checked><span>{{ .lang.Strings.enabled }}</span>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.PasswordValidation.length }}</span> <span class="mt-8">{{ .lang.PasswordValidation.length }}</span>
<input type="number" class="input ~neutral @low mt-0.5 mb-1" id="password_validation-min_length" value="8"> <input type="number" class="input ~neutral @low mt-8 mb-4" id="password_validation-min_length" value="8">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.PasswordValidation.uppercase }}</span> <span class="mt-8">{{ .lang.PasswordValidation.uppercase }}</span>
<input type="number" class="input ~neutral @low mt-0.5 mb-1" id="password_validation-upper" value="1"> <input type="number" class="input ~neutral @low mt-8 mb-4" id="password_validation-upper" value="1">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.PasswordValidation.lowercase }}</span> <span class="mt-8">{{ .lang.PasswordValidation.lowercase }}</span>
<input type="number" class="input ~neutral @low mt-0.5 mb-1" id="password_validation-lower" value="0"> <input type="number" class="input ~neutral @low mt-8 mb-4" id="password_validation-lower" value="0">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.PasswordValidation.numbers }}</span> <span class="mt-8">{{ .lang.PasswordValidation.numbers }}</span>
<input type="number" class="input ~neutral @low mt-0.5 mb-1" id="password_validation-number" value="0"> <input type="number" class="input ~neutral @low mt-8 mb-4" id="password_validation-number" value="0">
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.PasswordValidation.special }}</span> <span class="mt-8">{{ .lang.PasswordValidation.special }}</span>
<input type="number" class="input ~neutral @low mt-0.5 mb-1" id="password_validation-special" value="0"> <input type="number" class="input ~neutral @low mt-8 mb-4" id="password_validation-special" value="0">
</label> </label>
<section class="section ~neutral banner footer flex-expand middle"> <section class="section ~neutral banner footer flex-expand middle">
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span> <span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
@ -442,28 +442,28 @@
</div> </div>
</section> </section>
</div> </div>
<div class="card ~neutral @low mb-1 unfocused"> <div class="card ~neutral @low mb-4 unfocused">
<span class="heading">{{ .lang.HelpMessages.title }}</span> <span class="heading">{{ .lang.HelpMessages.title }}</span>
<p class="content">{{ .lang.HelpMessages.description }}</p> <p class="content">{{ .lang.HelpMessages.description }}</p>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.HelpMessages.contactMessage }}</span> <span class="mt-8">{{ .lang.HelpMessages.contactMessage }}</span>
<input type="text" class="input ~neutral @low mt-0.5" id="ui-contact_message"> <input type="text" class="input ~neutral @low mt-8" id="ui-contact_message">
<p class="support mb-1">{{ .lang.HelpMessages.contactMessageNotice }}</p> <p class="support mb-4">{{ .lang.HelpMessages.contactMessageNotice }}</p>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.HelpMessages.helpMessage }}</span> <span class="mt-8">{{ .lang.HelpMessages.helpMessage }}</span>
<input type="text" class="input ~neutral @low mt-0.5" id="ui-help_message"> <input type="text" class="input ~neutral @low mt-8" id="ui-help_message">
<p class="support mb-1">{{ .lang.HelpMessages.helpMessageNotice }}</p> <p class="support mb-4">{{ .lang.HelpMessages.helpMessageNotice }}</p>
</label> </label>
<label class="label"> <label class="label">
<span class="mt-0.5">{{ .lang.HelpMessages.successMessage }}</span> <span class="mt-8">{{ .lang.HelpMessages.successMessage }}</span>
<input type="text" class="input ~neutral @low mt-0.5" id="ui-success_message"> <input type="text" class="input ~neutral @low mt-8" id="ui-success_message">
<p class="support mb-1">{{ .lang.HelpMessages.successMessageNotice }}</p> <p class="support mb-4">{{ .lang.HelpMessages.successMessageNotice }}</p>
</label> </label>
<label class="label related-to-email"> <label class="label related-to-email">
<span class="mt-0.5">{{ .lang.HelpMessages.emailMessage }}</span> <span class="mt-8">{{ .lang.HelpMessages.emailMessage }}</span>
<input type="text" class="input ~neutral @low mt-0.5" id="email-message"> <input type="text" class="input ~neutral @low mt-8" id="email-message">
<p class="support mb-1">{{ .lang.HelpMessages.emailMessageNotice }}</p> <p class="support mb-4">{{ .lang.HelpMessages.emailMessageNotice }}</p>
</label> </label>
<section class="section ~neutral banner footer flex-expand middle"> <section class="section ~neutral banner footer flex-expand middle">
<span class="button ~neutral @low back">{{ .lang.Strings.back }}</span> <span class="button ~neutral @low back">{{ .lang.Strings.back }}</span>
@ -472,7 +472,7 @@
</div> </div>
</section> </section>
</div> </div>
<div class="card ~neutral @low mb-1 unfocused"> <div class="card ~neutral @low mb-4 unfocused">
<div class="row col flex center"> <div class="row col flex center">
<span class="heading">{{ .lang.EndPage.finished }}</span> <span class="heading">{{ .lang.EndPage.finished }}</span>
</div> </div>
@ -480,7 +480,7 @@
<p class="content">{{ .lang.EndPage.restartMessage }}</p> <p class="content">{{ .lang.EndPage.restartMessage }}</p>
</div> </div>
<div class="row col flex center"> <div class="row col flex center">
<span class="button ~neutral @low back mr-1">{{ .lang.Strings.back }}</span> <span class="button ~neutral @low back mr-4">{{ .lang.Strings.back }}</span>
<span class="button ~urge @low" id="restart">{{ .lang.Strings.submit }}</span> <span class="button ~urge @low" id="restart">{{ .lang.Strings.submit }}</span>
<span class="button ~urge @low unfocused" id="refresh">{{ .lang.EndPage.refreshPage }}</span> <span class="button ~urge @low unfocused" id="refresh">{{ .lang.EndPage.refreshPage }}</span>
</div> </div>

4
scripts/dark-variant.sh
View File

@ -10,7 +10,7 @@ if [[ "$1" == "ts" ]]; then
if [ $? -eq 0 ]; then if [ $? -eq 0 ]; then
echo $line | sed 's/.*classList//; s/).*//' | grep "~neutral\|~positive\|~urge\|~warning\|~info\|~critical" &> /dev/null echo $line | sed 's/.*classList//; s/).*//' | grep "~neutral\|~positive\|~urge\|~warning\|~info\|~critical" &> /dev/null
if [ $? -eq 0 ]; then if [ $? -eq 0 ]; then
echo "found classList @ " $l # echo "found classList @ " $l
for color in neutral positive urge warning info critical; do for color in neutral positive urge warning info critical; do
sed -i "${l},${l}s/\"~${color}\"/\"~${color}\", \"dark:~d_${color}\"/g" $f sed -i "${l},${l}s/\"~${color}\"/\"~${color}\", \"dark:~d_${color}\"/g" $f
done done
@ -18,7 +18,7 @@ if [[ "$1" == "ts" ]]; then
echo "FIX: classList found, but color tag wasn't in it" echo "FIX: classList found, but color tag wasn't in it"
fi fi
else else
echo "found inline in " $f " @ " $l ", " $(sed -n "${l}p" $f) # echo "found inline in " $f " @ " $l ", " $(sed -n "${l}p" $f)
for color in neutral positive urge warning info critical; do for color in neutral positive urge warning info critical; do
sed -i "${l},${l}s/~${color}/~${color} dark:~d_${color}/g" $f sed -i "${l},${l}s/~${color}/~${color} dark:~d_${color}/g" $f
done done

2
ts/form.ts
View File

@ -101,7 +101,7 @@ if (window.discordEnabled) {
link.classList.add("subheading", "link-center"); link.classList.add("subheading", "link-center");
link.href = inv.invite; link.href = inv.invite;
link.target = "_blank"; link.target = "_blank";
link.innerHTML = `<span class="img-circle lg mr-1"><img class="img-circle" src="${inv.icon}" width="64" height="64"></span>${window.discordServerName}`; link.innerHTML = `<span class="img-circle lg mr-4"><img class="img-circle" src="${inv.icon}" width="64" height="64"></span>${window.discordServerName}`;
} }
}); });
} }

18
ts/modules/accounts.ts
View File

@ -86,10 +86,10 @@ class user implements User {
get admin(): boolean { return this._admin.classList.contains("chip"); } get admin(): boolean { return this._admin.classList.contains("chip"); }
set admin(state: boolean) { set admin(state: boolean) {
if (state) { if (state) {
this._admin.classList.add("chip", "~info", "ml-1"); this._admin.classList.add("chip", "~info", "ml-4");
this._admin.textContent = window.lang.strings("admin"); this._admin.textContent = window.lang.strings("admin");
} else { } else {
this._admin.classList.remove("chip", "~info", "ml-1"); this._admin.classList.remove("chip", "~info", "ml-4");
this._admin.textContent = ""; this._admin.textContent = "";
} }
} }
@ -97,10 +97,10 @@ class user implements User {
get disabled(): boolean { return this._disabled.classList.contains("chip"); } get disabled(): boolean { return this._disabled.classList.contains("chip"); }
set disabled(state: boolean) { set disabled(state: boolean) {
if (state) { if (state) {
this._disabled.classList.add("chip", "~warning", "ml-1"); this._disabled.classList.add("chip", "~warning", "ml-4");
this._disabled.textContent = window.lang.strings("disabled"); this._disabled.textContent = window.lang.strings("disabled");
} else { } else {
this._disabled.classList.remove("chip", "~warning", "ml-1"); this._disabled.classList.remove("chip", "~warning", "ml-4");
this._disabled.textContent = ""; this._disabled.textContent = "";
} }
} }
@ -135,24 +135,24 @@ class user implements User {
<div class="dropdown-display lg"> <div class="dropdown-display lg">
<div class="card ~neutral @low"> <div class="card ~neutral @low">
<span class="supra sm">${window.lang.strings("contactThrough")}</span> <span class="supra sm">${window.lang.strings("contactThrough")}</span>
<label class="row switch pb-1 mt-half"> <label class="row switch pb-4 mt-half">
<input type="checkbox" name="accounts-contact-${this.id}" class="accounts-contact-email"> <input type="checkbox" name="accounts-contact-${this.id}" class="accounts-contact-email">
</span>Email</span> </span>Email</span>
</label> </label>
<div class="accounts-area-telegram"> <div class="accounts-area-telegram">
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="checkbox" name="accounts-contact-${this.id}" class="accounts-contact-telegram"> <input type="checkbox" name="accounts-contact-${this.id}" class="accounts-contact-telegram">
<span>Telegram</span> <span>Telegram</span>
</label> </label>
</div> </div>
<div class="accounts-area-discord"> <div class="accounts-area-discord">
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="checkbox" name="accounts-contact-${this.id}" class="accounts-contact-discord"> <input type="checkbox" name="accounts-contact-${this.id}" class="accounts-contact-discord">
<span>Discord</span> <span>Discord</span>
</label> </label>
</div> </div>
<div class="accounts-area-matrix"> <div class="accounts-area-matrix">
<label class="row switch pb-1"> <label class="row switch pb-4">
<input type="checkbox" name="accounts-contact-${this.id}" class="accounts-contact-matrix"> <input type="checkbox" name="accounts-contact-${this.id}" class="accounts-contact-matrix">
<span>Matrix</span> <span>Matrix</span>
</label> </label>
@ -940,7 +940,7 @@ export class accountsList {
const el = document.createElement("div") as HTMLDivElement; const el = document.createElement("div") as HTMLDivElement;
el.classList.add("flex-expand", "ellipsis", "mt-half"); el.classList.add("flex-expand", "ellipsis", "mt-half");
el.innerHTML = ` el.innerHTML = `
<span class="button ~neutral sm full-width accounts-announce-template-button">${name}</span><span class="button ~critical fr ml-1 accounts-announce-template-delete">&times;</span> <span class="button ~neutral sm full-width accounts-announce-template-button">${name}</span><span class="button ~critical fr ml-4 accounts-announce-template-delete">&times;</span>
`; `;
(el.querySelector("span.accounts-announce-template-button") as HTMLSpanElement).onclick = () => { (el.querySelector("span.accounts-announce-template-button") as HTMLSpanElement).onclick = () => {
_get("/users/announce/" + name, null, (req: XMLHttpRequest) => { _get("/users/announce/" + name, null, (req: XMLHttpRequest) => {

4
ts/modules/common.ts
View File

@ -111,7 +111,7 @@ export class notificationBox implements NotificationBox {
} }
noti.innerHTML = `<strong>${error}</strong> ${message}`; noti.innerHTML = `<strong>${error}</strong> ${message}`;
const closeButton = document.createElement('span') as HTMLSpanElement; const closeButton = document.createElement('span') as HTMLSpanElement;
closeButton.classList.add("button", "~critical", "@low", "ml-1"); closeButton.classList.add("button", "~critical", "@low", "ml-4");
closeButton.innerHTML = `<i class="icon ri-close-line"></i>`; closeButton.innerHTML = `<i class="icon ri-close-line"></i>`;
closeButton.onclick = () => { this._box.removeChild(noti); }; closeButton.onclick = () => { this._box.removeChild(noti); };
noti.appendChild(closeButton); noti.appendChild(closeButton);
@ -123,7 +123,7 @@ export class notificationBox implements NotificationBox {
noti.classList.add("aside", "~positive", "@low", "mt-half", "notification-positive"); noti.classList.add("aside", "~positive", "@low", "mt-half", "notification-positive");
noti.innerHTML = `<strong>${bold}</strong> ${message}`; noti.innerHTML = `<strong>${bold}</strong> ${message}`;
const closeButton = document.createElement('span') as HTMLSpanElement; const closeButton = document.createElement('span') as HTMLSpanElement;
closeButton.classList.add("button", "~positive", "@low", "ml-1"); closeButton.classList.add("button", "~positive", "@low", "ml-4");
closeButton.innerHTML = `<i class="icon ri-close-line"></i>`; closeButton.innerHTML = `<i class="icon ri-close-line"></i>`;
closeButton.onclick = () => { this._box.removeChild(noti); }; closeButton.onclick = () => { this._box.removeChild(noti); };
noti.appendChild(closeButton); noti.appendChild(closeButton);

6
ts/modules/discord.ts
View File

@ -22,13 +22,13 @@ export function newDiscordSearch(title: string, description: string, buttonText:
} }
list.innerHTML = ``; list.innerHTML = ``;
addLoader(list); addLoader(list);
list.parentElement.classList.add("mb-1", "mt-1"); list.parentElement.classList.add("mb-4", "mt-4");
timer = setTimeout(() => { timer = setTimeout(() => {
_get("/users/discord/" + input.value, null, (req: XMLHttpRequest) => { _get("/users/discord/" + input.value, null, (req: XMLHttpRequest) => {
if (req.readyState == 4) { if (req.readyState == 4) {
if (req.status != 200) { if (req.status != 200) {
removeLoader(list); removeLoader(list);
list.parentElement.classList.remove("mb-1", "mt-1"); list.parentElement.classList.remove("mb-4", "mt-4");
return; return;
} }
const users = req.response["users"] as Array<DiscordUser>; const users = req.response["users"] as Array<DiscordUser>;
@ -50,7 +50,7 @@ export function newDiscordSearch(title: string, description: string, buttonText:
} }
list.innerHTML = innerHTML; list.innerHTML = innerHTML;
removeLoader(list); removeLoader(list);
list.parentElement.classList.remove("mb-1", "mt-1"); list.parentElement.classList.remove("mb-4", "mt-4");
for (let i = 0; i < users.length; i++) { for (let i = 0; i < users.length; i++) {
const button = document.getElementById(`discord-user-${users[i].id}`) as HTMLInputElement; const button = document.getElementById(`discord-user-${users[i].id}`) as HTMLInputElement;
button.onclick = () => buttonFunction(users[i], event.detail); button.onclick = () => buttonFunction(users[i], event.detail);

18
ts/modules/invites.ts
View File

@ -93,14 +93,14 @@ class DOMInvite implements Invite {
const chip = container.querySelector("span.inv-email-chip"); const chip = container.querySelector("span.inv-email-chip");
const tooltip = container.querySelector("span.content") as HTMLSpanElement; const tooltip = container.querySelector("span.content") as HTMLSpanElement;
if (address == "") { if (address == "") {
container.classList.remove("mr-1"); container.classList.remove("mr-4");
icon.classList.remove("ri-mail-line"); icon.classList.remove("ri-mail-line");
icon.classList.remove("ri-mail-close-line"); icon.classList.remove("ri-mail-close-line");
chip.classList.remove("~neutral"); chip.classList.remove("~neutral");
chip.classList.remove("~critical"); chip.classList.remove("~critical");
chip.classList.remove("chip"); chip.classList.remove("chip");
} else { } else {
container.classList.add("mr-1"); container.classList.add("mr-4");
chip.classList.add("chip"); chip.classList.add("chip");
if (address.includes("Failed")) { if (address.includes("Failed")) {
icon.classList.remove("ri-mail-line"); icon.classList.remove("ri-mail-line");
@ -257,7 +257,7 @@ class DOMInvite implements Invite {
this._header.appendChild(this._codeArea); this._header.appendChild(this._codeArea);
this._codeArea.classList.add("inv-codearea"); this._codeArea.classList.add("inv-codearea");
this._codeArea.innerHTML = ` this._codeArea.innerHTML = `
<a class="invite-link code monospace mr-1" href=""></a> <a class="invite-link code monospace mr-4" href=""></a>
<span class="button ~info @low" title="${window.lang.strings("copy")}"><i class="ri-file-copy-line"></i></span> <span class="button ~info @low" title="${window.lang.strings("copy")}"><i class="ri-file-copy-line"></i></span>
`; `;
const copyButton = this._codeArea.querySelector("span.button") as HTMLSpanElement; const copyButton = this._codeArea.querySelector("span.button") as HTMLSpanElement;
@ -284,7 +284,7 @@ class DOMInvite implements Invite {
<span class="inv-email-chip"><i></i></span> <span class="inv-email-chip"><i></i></span>
<span class="content sm"></span> <span class="content sm"></span>
</div> </div>
<span class="inv-duration mr-1"></span> <span class="inv-duration mr-4"></span>
<span class="button ~critical @low inv-delete">${window.lang.strings("delete")}</span> <span class="button ~critical @low inv-delete">${window.lang.strings("delete")}</span>
<label> <label>
<i class="icon clickable ri-arrow-down-s-line not-rotated"></i> <i class="icon clickable ri-arrow-down-s-line not-rotated"></i>
@ -313,8 +313,8 @@ class DOMInvite implements Invite {
detailsInner.appendChild(this._left); detailsInner.appendChild(this._left);
this._left.classList.add("inv-profilearea"); this._left.classList.add("inv-profilearea");
let innerHTML = ` let innerHTML = `
<p class="supra mb-1 top">${window.lang.strings("profile")}</p> <p class="supra mb-2 top">${window.lang.strings("profile")}</p>
<div class="select ~neutral @low inv-profileselect inline-block"> <div class="select ~neutral @low inv-profileselect inline-block mb-2">
<select> <select>
<option value="noProfile" selected>${window.lang.strings("inviteNoProfile")}</option> <option value="noProfile" selected>${window.lang.strings("inviteNoProfile")}</option>
</select> </select>
@ -348,9 +348,9 @@ class DOMInvite implements Invite {
detailsInner.appendChild(this._middle); detailsInner.appendChild(this._middle);
this._middle.classList.add("block"); this._middle.classList.add("block");
this._middle.innerHTML = ` this._middle.innerHTML = `
<p class="supra mb-1 top">${window.lang.strings("inviteDateCreated")} <strong class="inv-created"></strong></p> <p class="supra mb-4 top">${window.lang.strings("inviteDateCreated")} <strong class="inv-created"></strong></p>
<p class="supra mb-1">${window.lang.strings("inviteRemainingUses")} <strong class="inv-remaining"></strong></p> <p class="supra mb-4">${window.lang.strings("inviteRemainingUses")} <strong class="inv-remaining"></strong></p>
<p class="supra mb-1"><span class="user-expiry"></span> <strong class="user-expiry-time"></strong></p> <p class="supra mb-4"><span class="user-expiry"></span> <strong class="user-expiry-time"></strong></p>
`; `;
this._right = document.createElement('div') as HTMLDivElement; this._right = document.createElement('div') as HTMLDivElement;

4
ts/modules/settings.ts
View File

@ -808,7 +808,7 @@ class EmailEditor {
let innerHTML = ''; let innerHTML = '';
for (let i = 0; i < this._templ.variables.length; i++) { for (let i = 0; i < this._templ.variables.length; i++) {
let ci = i % colors.length; let ci = i % colors.length;
innerHTML += '<span class="button ~' + colors[ci] +' @low mb-1" style="margin-left: 0.25rem; margin-right: 0.25rem;"></span>' innerHTML += '<span class="button ~' + colors[ci] +' @low mb-4" style="margin-left: 0.25rem; margin-right: 0.25rem;"></span>'
} }
if (this._templ.variables.length == 0) { if (this._templ.variables.length == 0) {
this._variablesLabel.classList.add("unfocused"); this._variablesLabel.classList.add("unfocused");
@ -832,7 +832,7 @@ class EmailEditor {
} else { } else {
for (let i = this._templ.conditionals.length-1; i >= 0; i--) { for (let i = this._templ.conditionals.length-1; i >= 0; i--) {
let ci = i % colors.length; let ci = i % colors.length;
innerHTML += '<span class="button ~' + colors[ci] +' @low mb-1" style="margin-left: 0.25rem; margin-right: 0.25rem;"></span>' innerHTML += '<span class="button ~' + colors[ci] +' @low mb-4" style="margin-left: 0.25rem; margin-right: 0.25rem;"></span>'
} }
this._conditionalsLabel.classList.remove("unfocused"); this._conditionalsLabel.classList.remove("unfocused");
this._conditionals.innerHTML = innerHTML this._conditionals.innerHTML = innerHTML