mirror of
https://github.com/BobbyWibowo/lolisafe.git
synced 2025-01-19 01:31:34 +00:00
Updated auth page, amont other things
"Login or register" subtitle and Register button will no longer be shown if enableUserAccounts are disabled in config. Updated auth.js to continue working even when register and/or login buttons cannot be found. Added .is-wrappable support for .button elements. This makes the text inside the buttons "wrappable" to next lines. Do note that this will cause the buttons to get taller when they do need to wrap their texts. Updated "Log in to upload" button in homepage uploader use the new .is-wrappable class. Their texts will also now be split into two lines. Anonymous upload warning specifically will now instead say "Log in or register". Bumped v1 version string and rebuilt client assets.
This commit is contained in:
Bobby Wibowo
parent
5e54c07f94
commit
64ab8e20b2
2
dist/css/style.css
vendored
2
dist/css/style.css
vendored
@ -1,2 +1,2 @@
|
||||
html{background-color:#000;overflow-y:auto}body{color:#eff0f1;-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}@-webkit-keyframes fadeInOpacity{0%{opacity:0}to{opacity:1}}@keyframes fadeInOpacity{0%{opacity:0}to{opacity:1}}a{color:#209cee}a:hover{color:#67c3ff}hr{background-color:#585858}.message-body code,code{background-color:#000;border-radius:5px;font-size:1rem}.subtitle,.subtitle strong{color:#bdc3c7}.subtitle.is-brighter,.subtitle.is-brighter strong,.title{color:#eff0f1}.input,.select select,.textarea{color:#eff0f1;border-color:#585858;background-color:#000}.input::-moz-placeholder,.textarea::-moz-placeholder{color:#bdc3c7}.input::-webkit-input-placeholder,.textarea::-webkit-input-placeholder{color:#bdc3c7}.input:-moz-placeholder,.textarea:-moz-placeholder{color:#bdc3c7}.input:-ms-input-placeholder,.textarea:-ms-input-placeholder{color:#bdc3c7}.input.is-active,.input.is-focused,.input:active,.input:focus,.input:not([disabled]):hover,.select fieldset:not([disabled]) select:hover,.select select:not([disabled]):hover,.textarea.is-active,.textarea.is-focused,.textarea:active,.textarea:focus,.textarea:not([disabled]):hover,fieldset:not([disabled]) .input:hover,fieldset:not([disabled]) .select select:hover,fieldset:not([disabled]) .textarea:hover{border-color:#209cee}.input[disabled],.select fieldset[disabled] select,.select select[disabled],.textarea[disabled],fieldset[disabled] .input,fieldset[disabled] .select select,fieldset[disabled] .textarea{border-color:#585858;background-color:#2f2f2f}.label{color:#eff0f1;font-weight:400}.help{color:#bdc3c7}.progress{background-color:#585858}.button.is-info.is-hovered [class*=" icon-"]:before,.button.is-info.is-hovered [class^=icon-]:before,.button.is-info:hover [class*=" icon-"]:before,.button.is-info:hover [class^=icon-]:before{fill:#fff}.checkbox:hover,.radio:hover{color:#7f8c8d}.select:not(.is-multiple):not(.is-loading):after,.select:not(.is-multiple):not(.is-loading):hover:after{border-color:#eff0f1}.select select[disabled]:hover,fieldset[disabled] .select select:hover{border-color:#585858}.message{background-color:#2f2f2f}.message-body{color:#eff0f1;border:0}.table{color:#bdc3c7;background-color:#000}.table.is-narrow{font-size:.75rem}.table.is-hoverable tbody tr:not(.is-selected):hover{background-color:#2f2f2f}.table td,.table th{white-space:nowrap;vertical-align:middle;border-bottom:1px solid #585858}.table th{color:#eff0f1;height:2.25em;font-weight:400}.table th.capitalize{text-transform:capitalize}.table thead td,.table thead th{color:#eff0f1;background-color:#383838;border-bottom:0;height:31px}.table tbody tr:last-child td,.table tbody tr:last-child th{border-bottom-width:1px}.table .cell-indent{padding-left:2.25em}.cc-window{font-family:inherit!important}.cc-link{padding:0!important}.section.has-extra-bottom-padding{padding-bottom:6.5rem}a.floating-home-button{display:flex;position:fixed;right:1.5rem;bottom:1.5rem;border-radius:100%;background-color:#209cee;color:#fff;width:3.5rem;height:3.5rem;justify-content:center;align-items:center;transition:background-color .25s}a.floating-home-button:hover{background-color:#67c3ff;color:#fff}a.floating-home-button>.icon{margin-top:-2px}.hero.is-fullheight>.hero-body{min-height:100vh;height:100%}.hero.is-fullheight>.hero-body>.container{width:100%}
|
||||
html{background-color:#000;overflow-y:auto}body{color:#eff0f1;-webkit-animation:fadeInOpacity .5s;animation:fadeInOpacity .5s}@-webkit-keyframes fadeInOpacity{0%{opacity:0}to{opacity:1}}@keyframes fadeInOpacity{0%{opacity:0}to{opacity:1}}a{color:#209cee}a:hover{color:#67c3ff}hr{background-color:#585858}.message-body code,code{background-color:#000;border-radius:5px;font-size:1rem}.subtitle,.subtitle strong{color:#bdc3c7}.subtitle.is-brighter,.subtitle.is-brighter strong,.title{color:#eff0f1}.input,.select select,.textarea{color:#eff0f1;border-color:#585858;background-color:#000}.input::-moz-placeholder,.textarea::-moz-placeholder{color:#bdc3c7}.input::-webkit-input-placeholder,.textarea::-webkit-input-placeholder{color:#bdc3c7}.input:-moz-placeholder,.textarea:-moz-placeholder{color:#bdc3c7}.input:-ms-input-placeholder,.textarea:-ms-input-placeholder{color:#bdc3c7}.input.is-active,.input.is-focused,.input:active,.input:focus,.input:not([disabled]):hover,.select fieldset:not([disabled]) select:hover,.select select:not([disabled]):hover,.textarea.is-active,.textarea.is-focused,.textarea:active,.textarea:focus,.textarea:not([disabled]):hover,fieldset:not([disabled]) .input:hover,fieldset:not([disabled]) .select select:hover,fieldset:not([disabled]) .textarea:hover{border-color:#209cee}.input[disabled],.select fieldset[disabled] select,.select select[disabled],.textarea[disabled],fieldset[disabled] .input,fieldset[disabled] .select select,fieldset[disabled] .textarea{border-color:#585858;background-color:#2f2f2f}.label{color:#eff0f1;font-weight:400}.help{color:#bdc3c7}.progress{background-color:#585858}.button.is-info.is-hovered [class*=" icon-"]:before,.button.is-info.is-hovered [class^=icon-]:before,.button.is-info:hover [class*=" icon-"]:before,.button.is-info:hover [class^=icon-]:before{fill:#fff}.button.is-wrappable{white-space:break-spaces;height:auto}.checkbox:hover,.radio:hover{color:#7f8c8d}.select:not(.is-multiple):not(.is-loading):after,.select:not(.is-multiple):not(.is-loading):hover:after{border-color:#eff0f1}.select select[disabled]:hover,fieldset[disabled] .select select:hover{border-color:#585858}.message{background-color:#2f2f2f}.message-body{color:#eff0f1;border:0}.table{color:#bdc3c7;background-color:#000}.table.is-narrow{font-size:.75rem}.table.is-hoverable tbody tr:not(.is-selected):hover{background-color:#2f2f2f}.table td,.table th{white-space:nowrap;vertical-align:middle;border-bottom:1px solid #585858}.table th{color:#eff0f1;height:2.25em;font-weight:400}.table th.capitalize{text-transform:capitalize}.table thead td,.table thead th{color:#eff0f1;background-color:#383838;border-bottom:0;height:31px}.table tbody tr:last-child td,.table tbody tr:last-child th{border-bottom-width:1px}.table .cell-indent{padding-left:2.25em}.cc-window{font-family:inherit!important}.cc-link{padding:0!important}.section.has-extra-bottom-padding{padding-bottom:6.5rem}a.floating-home-button{display:flex;position:fixed;right:1.5rem;bottom:1.5rem;border-radius:100%;background-color:#209cee;color:#fff;width:3.5rem;height:3.5rem;justify-content:center;align-items:center;transition:background-color .25s}a.floating-home-button:hover{background-color:#67c3ff;color:#fff}a.floating-home-button>.icon{margin-top:-2px}.hero.is-fullheight>.hero-body{min-height:100vh;height:100%}.hero.is-fullheight>.hero-body>.container{width:100%}
|
||||
/*# sourceMappingURL=style.css.map */
|
||||
|
||||
2
dist/css/style.css.map
vendored
2
dist/css/style.css.map
vendored
File diff suppressed because one or more lines are too long
2
dist/js/auth.js
vendored
2
dist/js/auth.js
vendored
@ -1,2 +1,2 @@
|
||||
var lsKeys={token:"token"},page={token:localStorage[lsKeys.token],user:null,pass:null,unhide:function(){document.querySelector("#loader").classList.add("is-hidden"),document.querySelector("#login").classList.remove("is-hidden")},onAxiosError:function(e){console.error(e);var r={520:"Unknown Error",521:"Web Server Is Down",522:"Connection Timed Out",523:"Origin Is Unreachable",524:"A Timeout Occurred",525:"SSL Handshake Failed",526:"Invalid SSL Certificate",527:"Railgun Error",530:"Origin DNS Error"}[e.response.status]||e.response.statusText,o=e.response.data&&e.response.data.description?e.response.data.description:"There was an error with the request, please check the console for more information.";return swal(e.response.status+" "+r,o,"error")},do:function(e,r){var o=page.user.value.trim();if(!o)return swal("An error occurred!","You need to specify a username.","error");var n=page.pass.value.trim();if(!n)return swal("An error occurred!","You need to specify a password.","error");r.classList.add("is-loading"),axios.post("api/"+e,{username:o,password:n}).then((function(o){if(!1===o.data.success)return r.classList.remove("is-loading"),swal("Unable to "+e+"!",o.data.description,"error");localStorage.token=o.data.token,window.location="dashboard"})).catch((function(e){r.classList.remove("is-loading"),page.onAxiosError(e)}))},verify:function(){axios.post("api/tokens/verify",{token:page.token}).then((function(e){if(!1===e.data.success)return page.unhide(),swal("An error occurred!",e.data.description,"error");window.location="dashboard"})).catch((function(e){page.unhide(),page.onAxiosError(e)}))}};window.onload=function(){page.user=document.querySelector("#user"),page.pass=document.querySelector("#pass");var e=document.querySelector("#authForm");e.addEventListener("submit",(function(e){e.preventDefault()})),document.querySelector("#loginBtn").addEventListener("click",(function(r){e.checkValidity()&&page.do("login",r.currentTarget)})),document.querySelector("#registerBtn").addEventListener("click",(function(r){e.checkValidity()&&page.do("register",r.currentTarget)})),page.token?page.verify():page.unhide()};
|
||||
var lsKeys={token:"token"},page={token:localStorage[lsKeys.token],user:null,pass:null,unhide:function(){document.querySelector("#loader").classList.add("is-hidden"),document.querySelector("#login").classList.remove("is-hidden")},onAxiosError:function(e){console.error(e);var r={520:"Unknown Error",521:"Web Server Is Down",522:"Connection Timed Out",523:"Origin Is Unreachable",524:"A Timeout Occurred",525:"SSL Handshake Failed",526:"Invalid SSL Certificate",527:"Railgun Error",530:"Origin DNS Error"}[e.response.status]||e.response.statusText,o=e.response.data&&e.response.data.description?e.response.data.description:"There was an error with the request, please check the console for more information.";return swal(e.response.status+" "+r,o,"error")},do:function(e,r){var o=page.user.value.trim();if(!o)return swal("An error occurred!","You need to specify a username.","error");var n=page.pass.value.trim();if(!n)return swal("An error occurred!","You need to specify a password.","error");r.classList.add("is-loading"),axios.post("api/"+e,{username:o,password:n}).then((function(o){if(!1===o.data.success)return r.classList.remove("is-loading"),swal("Unable to "+e+"!",o.data.description,"error");localStorage.token=o.data.token,window.location="dashboard"})).catch((function(e){r.classList.remove("is-loading"),page.onAxiosError(e)}))},verify:function(){axios.post("api/tokens/verify",{token:page.token}).then((function(e){if(!1===e.data.success)return page.unhide(),swal("An error occurred!",e.data.description,"error");window.location="dashboard"})).catch((function(e){page.unhide(),page.onAxiosError(e)}))}};window.onload=function(){page.user=document.querySelector("#user"),page.pass=document.querySelector("#pass");var e=document.querySelector("#authForm");e.addEventListener("submit",(function(e){e.preventDefault()}));var r=document.querySelector("#loginBtn");r&&r.addEventListener("click",(function(r){e.checkValidity()&&page.do("login",r.currentTarget)}));var o=document.querySelector("#registerBtn");o&&o.addEventListener("click",(function(r){e.checkValidity()&&page.do("register",r.currentTarget)})),page.token?page.verify():page.unhide()};
|
||||
//# sourceMappingURL=auth.js.map
|
||||
|
||||
2
dist/js/auth.js.map
vendored
2
dist/js/auth.js.map
vendored
File diff suppressed because one or more lines are too long
2
dist/js/home.js
vendored
2
dist/js/home.js
vendored
File diff suppressed because one or more lines are too long
2
dist/js/home.js.map
vendored
2
dist/js/home.js.map
vendored
File diff suppressed because one or more lines are too long
@ -141,6 +141,11 @@ fieldset[disabled] .textarea {
|
||||
fill: #fff
|
||||
}
|
||||
|
||||
.button.is-wrappable {
|
||||
white-space: break-spaces;
|
||||
height: auto
|
||||
}
|
||||
|
||||
.checkbox:hover,
|
||||
.radio:hover {
|
||||
color: #7f8c8d
|
||||
|
||||
@ -97,15 +97,19 @@ window.onload = () => {
|
||||
event.preventDefault()
|
||||
})
|
||||
|
||||
document.querySelector('#loginBtn').addEventListener('click', event => {
|
||||
if (!form.checkValidity()) return
|
||||
page.do('login', event.currentTarget)
|
||||
})
|
||||
const loginBtn = document.querySelector('#loginBtn')
|
||||
if (loginBtn)
|
||||
loginBtn.addEventListener('click', event => {
|
||||
if (!form.checkValidity()) return
|
||||
page.do('login', event.currentTarget)
|
||||
})
|
||||
|
||||
document.querySelector('#registerBtn').addEventListener('click', event => {
|
||||
if (!form.checkValidity()) return
|
||||
page.do('register', event.currentTarget)
|
||||
})
|
||||
const registerBtn = document.querySelector('#registerBtn')
|
||||
if (registerBtn)
|
||||
registerBtn.addEventListener('click', event => {
|
||||
if (!form.checkValidity()) return
|
||||
page.do('register', event.currentTarget)
|
||||
})
|
||||
|
||||
if (page.token)
|
||||
page.verify()
|
||||
|
||||
@ -177,9 +177,9 @@ page.preparePage = () => {
|
||||
button.href = 'auth'
|
||||
button.classList.remove('is-loading')
|
||||
if (page.enableUserAccounts)
|
||||
button.innerText = 'Anonymous upload is disabled. Log in to upload.'
|
||||
button.innerText = 'Anonymous upload is disabled.\nLog in or register to upload.'
|
||||
else
|
||||
button.innerText = 'Running in private mode. Log in to upload.'
|
||||
button.innerText = 'Running in private mode.\nLog in to upload.'
|
||||
}
|
||||
else
|
||||
return page.prepareUpload()
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
{
|
||||
"1": "1590435956",
|
||||
"1": "1590436805",
|
||||
"2": "1589010026",
|
||||
"3": "1581416390",
|
||||
"4": "1581416390",
|
||||
|
||||
@ -3,6 +3,8 @@
|
||||
|
||||
{% extends "_layout.njk" %}
|
||||
|
||||
{% set enableUserAccounts = config.enableUserAccounts %}
|
||||
|
||||
{% block stylesheets %}
|
||||
{{ super() }}
|
||||
<link rel="stylesheet" href="libs/fontello/fontello.css{{ versions[1] }}">
|
||||
@ -31,21 +33,24 @@
|
||||
<h1 class="title">
|
||||
Dashboard Access
|
||||
</h1>
|
||||
{% if enableUserAccounts -%}
|
||||
<h2 class="subtitle">
|
||||
Login or register
|
||||
</h2>
|
||||
{%- endif %}
|
||||
<form id="authForm">
|
||||
<div class="field">
|
||||
<div class="control">
|
||||
<input id="user" name="user" class="input" type="text" placeholder="Your username" minlength="4" maxlength="32">
|
||||
<input id="user" name="user" class="input" type="text" placeholder="Username" minlength="4" maxlength="32">
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<div class="control">
|
||||
<input id="pass" name="pass" class="input" type="password" placeholder="Your password" minlength="6" maxlength="64">
|
||||
<input id="pass" name="pass" class="input" type="password" placeholder="Password" minlength="6" maxlength="64">
|
||||
</div>
|
||||
</div>
|
||||
<div class="field is-grouped is-grouped-right">
|
||||
{% if enableUserAccounts -%}
|
||||
<div class="control">
|
||||
<button id="registerBtn" type="button" class="button is-primary is-outlined">
|
||||
<span class="icon">
|
||||
@ -54,6 +59,7 @@
|
||||
<span>Register</span>
|
||||
</button>
|
||||
</div>
|
||||
{%- endif %}
|
||||
<div class="control">
|
||||
<button id="loginBtn" type="submit" class="button is-info is-outlined">
|
||||
<span class="icon">
|
||||
|
||||
@ -59,7 +59,7 @@
|
||||
<div class="columns is-gapless">
|
||||
<div class="column is-hidden-mobile"></div>
|
||||
<div class="column">
|
||||
<a id="loginToUpload" class="button is-danger is-outlined is-fullwidth is-loading"></a>
|
||||
<a id="loginToUpload" class="button is-danger is-outlined is-fullwidth is-loading is-wrappable"></a>
|
||||
<div id="albumDiv" class="field has-addons is-hidden">
|
||||
<div class="control is-expanded">
|
||||
<div class="select is-fullwidth">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user