diff --git a/app/app.ejs b/app/app.ejs index 35c71fb..16ce7e4 100644 --- a/app/app.ejs +++ b/app/app.ejs @@ -13,8 +13,6 @@ #main { height: calc(100% - 22px); background: linear-gradient(to top, rgba(0, 0, 0, 0.75) 0%, rgba(0, 0, 0, 0) 100%); - will-change: filter; - transition: filter 0.5s ease; } #main[overlay] { filter: blur(3px) contrast(0.9) brightness(1.0); diff --git a/app/assets/css/launcher.css b/app/assets/css/launcher.css index 04e99dc..4f0a97a 100644 --- a/app/assets/css/launcher.css +++ b/app/assets/css/launcher.css @@ -706,78 +706,6 @@ p { transform: rotate(45deg); } -/* * * -* Login View | Error Overlay -* * */ - -#loginErrorContainer { - position: absolute; - display: none; - align-items: center; - justify-content: center; - width: 100%; - height: 100%; - background: rgba(0, 0, 0, 0.50); -} - -/*#loginContainer[error] > #loginErrorContainer { - display: flex; -}*/ - -#loginContainer[error] > div:not(#loginErrorContainer) { - filter: blur(3px) contrast(0.9) brightness(1.0); -} - -#loginErrorContent { - position: relative; - display: flex; - flex-direction: column; - align-items: center; - justify-content: space-between; - width: 300px; - height: 35%; - box-sizing: border-box; - padding: 15px 0px; - /* background-color: #424242; */ - text-align: center; -} - -#loginErrorTitle { - font-family: 'Avenir Medium'; - font-size: 20px; - color: #fff; - font-weight: bold; - letter-spacing: 1px; -} - -#loginErrorDesc { - font-family: 'Avenir Book'; - font-size: 12px; - color: #fff; - font-weight: bold; -} - -#loginErrorAcknowledge { - background: none; - border: 1px solid #ffffff; - color: white; - font-family: 'Avenir Medium'; - font-weight: bold; - border-radius: 2px; - width: 75px; - cursor: pointer; - transition: 0.25s ease; -} -#loginErrorAcknowledge:hover, -#loginErrorAcknowledge:focus { - box-shadow: 0px 0px 10px 0px #fff; - outline: none; -} -#loginErrorAcknowledge:active { - border-color: rgba(255, 255, 255, 0.75); - color: rgba(255, 255, 255, 0.75); -} - /* * * * Login View | Loader * * */ @@ -1313,7 +1241,7 @@ p { font-family: 'Avenir Medium'; font-weight: bold; border-radius: 2px; - width: 75px; + padding: 0px 8.1px; cursor: pointer; transition: 0.25s ease; } diff --git a/app/assets/js/actionbinder.js b/app/assets/js/actionbinder.js index 9e422f5..5872813 100644 --- a/app/assets/js/actionbinder.js +++ b/app/assets/js/actionbinder.js @@ -102,10 +102,39 @@ function toggleOverlay(toggleState){ } if(toggleState){ document.getElementById('main').setAttribute('overlay', true) - $('#overlayContainer').fadeToggle(500) + $('#overlayContainer').fadeToggle(250) } else { document.getElementById('main').removeAttribute('overlay') - $('#overlayContainer').fadeToggle(500) + $('#overlayContainer').fadeToggle(250) + } +} + +/** + * Set the content of the overlay. + * + * @param {string} title Overlay title text. + * @param {string} description Overlay description text. + * @param {string} acknowledge Acknowledge button text. + */ +function setOverlayContent(title, description, acknowledge){ + document.getElementById('overlayTitle').innerHTML = title + document.getElementById('overlayDesc').innerHTML = description + document.getElementById('overlayAcknowledge').innerHTML = acknowledge +} + +/** + * Set the onclick handler of the overlay acknowledge button. + * If the handler is null, a default handler will be added. + * + * @param {function} handler + */ +function setOverlayHandler(handler){ + if(handler == null){ + document.getElementById('overlayAcknowledge').onclick = () => { + toggleOverlay(false) + } + } else { + document.getElementById('overlayAcknowledge').onclick = handler } } diff --git a/app/login.ejs b/app/login.ejs index 2689c2d..25431e9 100644 --- a/app/login.ejs +++ b/app/login.ejs @@ -55,13 +55,6 @@ -
-
- LOGIN FAILED:
INVALID CREDENTIALS
- Either the email or password you supplied is invalid. Please ensure everything is correct and try again. - -
-