pcwvanbeers/assetmgt
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

cmxx - Improved login

Browse Source
This commit is contained in:
“VeLiTi”
2025-03-27 13:55:02 +01:00
parent 6fd22ede84
commit 0432d7fa47
10 changed files with 757 additions and 387 deletions
Download Patch File Download Diff File Expand all files Collapse all files

166
login.php
View File

@@ -1,14 +1,48 @@
<?php ini_set('display_errors', '1');
<?php
ini_set('display_errors', '1');
ini_set('display_startup_errors', '1');
error_reporting(E_ALL);
include './assets/functions.php';
include './settings/settings_redirector.php';
include './settings/config_redirector.php';
include_once './settings/translations/translations_US.php';
if (session_status() == PHP_SESSION_NONE) {
session_start();
}
//=========================================
//GET Language
//=========================================
if (isset($_GET['language']) && $_GET['language'] !=''){
//INCLUDE LANGUAGE FILE
$api_file_language = './settings/translations/translations_'.strtoupper($_GET['language']).'.php';
if (file_exists($api_file_language)){
include $api_file_language; //Include the code
//DEFINE LANGUAGE
$_SESSION['country_code'] = trim($_GET['language']);
}
else {
include './settings/translations/translations_US.php';
//DEFINE LANGUAGE
$_SESSION['country_code'] = 'US';
}
}
if(isset($_SESSION['country_code'])){
$api_file_language = './settings/translations/translations_'.strtoupper($_SESSION['country_code']).'.php';
if (file_exists($api_file_language)){
include $api_file_language; //Include the code
}
else {
include './settings/translations/translations_US.php';
}
}
//=========================================
//GET DOMAIN FOR CORRECT STYLING AND SETTINGS
//=========================================
$domain = getDomainName($_SERVER['SERVER_NAME']);
$custom_css = (file_exists(dirname(__FILE__).'/style/'.$domain.'/'.$domain.'_login.css') ? './style/'.$domain.'/'.$domain.'_login.css' : './style/admin_login.css');
@@ -28,14 +62,14 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
// Check if username is empty
if(empty(trim($_POST['username']))){
$username_err = 'Please enter username.';
$username_err = $username_enter ?? 'Please enter username' ;
} else{
$username = trim($_POST['username']);
}
// Check if password is empty
if(empty(trim($_POST['password']))){
$password_err = 'Please enter your password.';
$password_err = $password_enter ?? 'Please enter your password';
} else{
$password = trim($_POST['password']);
}
@@ -52,9 +86,9 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
if ($responses === 'NOK'){
$retry++;
$password_err = 'Not authorized, please retry';
$password_err = $password_err_1 ?? 'Not authorized, please retry';
} elseif ($responses == '1'){
$password_err = 'Too many login attempts. User blocked, please contact your administrator';
$password_err = $password_err_2 ?? 'Too many login attempts. User blocked, please contact your administrator';
} else {
// Start a new session
session_start();
@@ -86,7 +120,7 @@ if ($_SERVER['REQUEST_METHOD'] === 'POST') {
}
else {
// Display an error for passord mismatch
$password_err = 'Not authorized';
$password_err = $password_err_3 ?? 'Not authorized';
}
}
echo'
@@ -101,66 +135,92 @@ echo'
<body>
';
//Maintenance mode notification message
if (maintenance_mode_communication){
echo'
<p style="text-align: center;">
<small>'.maintenance_mode_notification.'</small>
</p>';
}
//Logon view
echo'
<div class="logon">
<div class="logon_center" style="position: static;">
<div id="imagelogon"></div>
<div class="login-box">
<small style="color:#fff;">'.site_title.'</small>
<h1>'.site_name.'</h1>
';
<div class="login-container">
<div class="login-form">
<div class="logo"></div>
<a href="#" class="register-link"></a>';
if (maintenance_mode)
{
//Maintenance mode is on => Show maintenance mode text
echo '
<p style="margin-top: 10%;color: white;">'.maintenance_mode_text.'</p>
<div class="message">
<p>'.maintenance_mode_text.'</p>
</div>
';
} else {
//Maintenance mode is off => Show login
echo '
<form style="margin-top:15px;" action="'.$_SERVER['PHP_SELF'].'" method="POST">
<input type="text" id="username" name="username" placeholder="Username" value="'; echo $username; echo '" autofocus>
<input type="password" id="password" name="password" placeholder="Password" value="'; echo $password; echo '">
<div id="reset"><a href="reset.php">'.$button2.'</a></div>
<input type="submit" value="'.$button1.'">
</form>
<div id="message"><p>'.$username_err.''.$password_err.'<p></div>';
}
echo '
</div>';
// -----------------------
//DISPLAY REDIRECT SLIDER
/* -----------------------
echo '
<section title="">
<div class="slider-checkbox">
<input id="my-check-box" type="checkbox" onchange="location.href=\'https://legacy.veliti.nl\'"/>
<label for="my-check-box">
<span id="ball"></span>
</label>
<div class="header">
<h1>'.($login_h1 ?? 'Login to your account').'</h1>
<p>'.($login_p ?? 'Enter your details to login.').'</p>
</div>
<p style="text-align:center;margin-top:-20px;color:#ffffff7a;font-size:12px;">use legacy portal</p>
</section>
';
// -----------------------
// END - REDIRECT SLIDER
// -----------------------
*/
<form action="'.$_SERVER['PHP_SELF'].'" method="POST">
<div class="input-group">
<input type="text" id="username" name="username" placeholder="'.($User_username ?? 'Username').'" value="'.$username.'" autofocus>
</div>
<div class="input-group">
<input type="password" id="password" name="password" placeholder="'.($account_create_password ?? 'Password').'" value="'.$password.'">
<a href="reset.php'.(isset($_GET['language'])? '?language='.$_GET['language'].'' : '').'" class="forgot-password">'.($button2 ?? 'Forgot password?').'</a>
</div>
<div class="remember-me">
<label for="remember-me"></label>
</div>
<button type="submit" class="login-btn">'.($button1 ?? 'Login').'</button>
</form>';
}
if($password_err !='' || $username_err != ''){
echo'
<div class="message"><p>'.$username_err.''.$password_err.'</p></div>
';
}
//Maintenance mode notification message
if (maintenance_mode_communication){
echo'
<div class="maintenance">
<p style="text-align: center;">
<small>'.maintenance_mode_notification.'</small>
</p>
</div>';
}
echo'
<div class="trademark">'.site_title.'</div>
<div class="language-selector">
<span>🌐</span>
<select id="language-selector">
<option value="US" '.((isset($_SESSION['country_code']) && $_SESSION['country_code'] == 'US') ? 'selected' : '').'>US</option>
<option value="NL" '.((isset($_SESSION['country_code']) && $_SESSION['country_code'] == 'NL') ? 'selected' : '').'>NL</option>
<option value="ES" '.((isset($_SESSION['country_code']) && $_SESSION['country_code'] == 'ES') ? 'selected' : '').'>ES</option>
<option value="PT" '.((isset($_SESSION['country_code']) && $_SESSION['country_code'] == 'PT') ? 'selected' : '').'>PT</option>
<option value="DE" '.((isset($_SESSION['country_code']) && $_SESSION['country_code'] == 'DE') ? 'selected' : '').'>DE</option>
</select>
</div>
</div>
<div class="login-visual">
<img src="https://dev.veliti.nl/assets/images/emergencyplug-auto-in-licht.jpg" alt="Login Visual">
</div>
</div>
</body>
</html>
';
<script>
document.getElementById(\'language-selector\').addEventListener(\'change\', function() {
if (this.value) {
// Get the current URL
let currentUrl = window.location.pathname;
// Append the selected value as a query parameter
window.location.href = `${currentUrl}?language=${this.value}`;
}
});
</script>
</html>';
?>

2
logout.php
View File

@@ -10,6 +10,6 @@
session_destroy();
// Redirect to login page
header('location: index.php');
header('location: login.php');
exit;
?>

167
reset.php
View File

@@ -3,7 +3,6 @@
include './assets/functions.php';
include './settings/settings_redirector.php';
include './settings/config_redirector.php';
include_once './settings/translations/translations_US.php';
// Check if the user is already logged in, if yes then redirect him to welcome page
if(isset($_SESSION["loggedin"]) && $_SESSION["loggedin"] === true){
@@ -11,6 +10,38 @@ if(isset($_SESSION["loggedin"]) && $_SESSION["loggedin"] === true){
exit();
}
if (session_status() == PHP_SESSION_NONE) {
session_start();
}
//=========================================
//GET Language
//=========================================
if (isset($_GET['language']) && $_GET['language'] !=''){
//INCLUDE LANGUAGE FILE
$api_file_language = './settings/translations/translations_'.strtoupper($_GET['language']).'.php';
if (file_exists($api_file_language)){
include $api_file_language; //Include the code
//DEFINE LANGUAGE
$_SESSION['country_code'] = trim($_GET['language']);
}
else {
include './settings/translations/translations_US.php';
//DEFINE LANGUAGE
$_SESSION['country_code'] = 'US';
}
}
if(isset($_SESSION['country_code'])){
$api_file_language = './settings/translations/translations_'.strtoupper($_SESSION['country_code']).'.php';
if (file_exists($api_file_language)){
include $api_file_language; //Include the code
}
else {
include './settings/translations/translations_US.php';
}
}
//=========================================
//GET DOMAIN FOR CORRECT STYLING AND SETTINGS
$domain = getDomainName($_SERVER['SERVER_NAME']);
@@ -24,7 +55,7 @@ $username_err = $password_err = '';
if ($_POST['submit'] === 'Reset' && $_POST['username'] !='EMP-updater') {
// Check if username is empty
if(empty(trim($_POST['username']))){
$username_err = 'Please enter username.';
$username_err = $username_enter ?? 'Please enter username';
} else{
$username = trim($_POST['username']);
}
@@ -39,7 +70,7 @@ if ($_POST['submit'] === 'Reset' && $_POST['username'] !='EMP-updater') {
if (!empty($responses)){$responses = decode_payload($responses);}else{$responses = '400';}
if ($responses === 'NOK'){
$usernameerr = 'Not authorized, please retry';
$username_err = $password_err_1 ?? 'Not authorized, please retry';
} else {
$username_err = $reset_message;
@@ -83,10 +114,10 @@ if (isset($_POST['resetkey']) && $_POST['resetkey'] !='' && $_POST['password_upd
if (!empty($responses)){$responses = decode_payload($responses);}else{$responses = '400';}
if ($responses === 'NOK'){
$usernameerr = 'Not authorized, please retry';
$username_err = $password_err_1 ?? 'Not authorized, please retry';
} else {
// success
$username_err = 'You will be redirected';
$username_err = $redirect_succes ?? 'You will be redirected';
//redirect to login page
header("Refresh:2; url=index.php");
}
@@ -94,7 +125,7 @@ if (isset($_POST['resetkey']) && $_POST['resetkey'] !='' && $_POST['password_upd
//$username_err = 'You will be redirected';
}
else {
$username_err = 'Passwords do not match';
$username_err = $password_err_3 ?? 'Passwords do not match';
$reset_id_valid = 1;
}
}
@@ -117,7 +148,7 @@ if (isset($_GET['resetkey']) && $_GET['resetkey'] !=''){
$username_err = $reset_message2 ;
//redirect to login page
header("Refresh:5; url=index.php");
header("Refresh:3; url=index.php");
}
}
@@ -133,61 +164,117 @@ echo'
<body>
';
//Maintenance mode notification message
if (maintenance_mode_communication){
echo'
<p style="text-align: center;">
<small>'.maintenance_mode_notification.'</small>
</p>';
}
//Logon view
echo'
<div class="logon">
<div class="logon_center" style="position: static;">
<div id="imagelogon"></div>
<div class="login-box">
<small style="color:#fff;">'.site_title.'</small>
<h1>'.site_name.'</h1>
';
<div class="login-container">
<div class="login-form">
<div class="logo"></div>
<a href="#" class="register-link"></a>';
if (maintenance_mode)
{
//Maintenance mode is on => Show maintenance mode text
echo '
<p style="margin-top: 10%;color: white;">'.maintenance_mode_text.'</p>
<div class="message">
<p>'.maintenance_mode_text.'</p>
</div>
';
} else {
}
else {
//Maintenance mode is off => Show login
echo '
<form style="margin-top:15px;" action="'.$_SERVER['PHP_SELF'].'" method="POST">
';
<div class="header">
<h1>'.($login_reset_h1 ?? 'Forgot your password').'</h1>
<p>'.($login_reset_p ?? 'Enter your username to reset password.').'</p>
</div>
<form action="'.$_SERVER['PHP_SELF'].'" method="POST">';
if ($reset_id_valid != 1){
echo'
<input type="text" id="username" name="username" placeholder="Username" value="'; echo $username; echo '" autofocus>
<div id="reset"><a href="index.php">Back to login</a></div>
<div class="input-group">
<input type="text" id="username" name="username" placeholder="'.($User_username ?? 'Username').'" value="'.$username.'" autofocus>
</div>
<div class="input-group">
<a href="index.php" class="forgot-password">'.($button_back_to_login ?? 'Back to login').'</a>
<input type="hidden" name="submit" value="Reset">
<input type="submit" value="Request reset">
</div>';
} else {
echo '
<div class="input-group">
<input type="hidden" id="resetkey" name="resetkey" value="'.$resetkey.'">
<input type="password" id="password_new" name="password" min="8" max="20" placeholder="'.($password_new ?? 'New Password').'" autofocus>
</div>
<div class="input-group">
<input type="password" id="password_update" name="password_update" min="8" max="20" placeholder="'.($password_check ?? 'Repeat password').'">
</div>';
}
echo'
<div class="remember-me">
<label for="remember-me"></label>
</div>';
if ($reset_id_valid != 1){
echo '
<button type="submit" class="login-btn">'.($button_reset ?? 'Request reset').'</button>
';
} else {
echo '
<input type="hidden" id="resetkey" name="resetkey" value="'.$resetkey.'">
<input type="password" id="password_new" name="password" min="8" max="20" placeholder="New Password" autofocus>
<input type="password" id="password_update" name="password_update" min="8" max="20" placeholder="Repeat password">
<input type="submit" name="submit" value="Update password">
';
}
echo' </form>
<div id="message"><p>'.$username_err.'<p></div>
<button type="submit" name="submit" class="login-btn">'.($button_password_update ?? 'Update password').'</button>
';
}
echo '
</form>';
}
if($username_err != ''){
echo'
<div class="message"><p>'.$username_err.'</p></div>
';
}
//Maintenance mode notification message
if (maintenance_mode_communication){
echo'
<div class="maintenance">
<p style="text-align: center;">
<small>'.maintenance_mode_notification.'</small>
</p>
</div>';
}
echo'
<div class="trademark">'.site_title.'</div>
<div class="language-selector">
<span>🌐</span>
<select id="language-selector">
<option value="US" '.((isset($_SESSION['country_code']) && $_SESSION['country_code'] == 'US') ? 'selected' : '').'>US</option>
<option value="NL" '.((isset($_SESSION['country_code']) && $_SESSION['country_code'] == 'NL') ? 'selected' : '').'>NL</option>
<option value="ES" '.((isset($_SESSION['country_code']) && $_SESSION['country_code'] == 'ES') ? 'selected' : '').'>ES</option>
<option value="PT" '.((isset($_SESSION['country_code']) && $_SESSION['country_code'] == 'PT') ? 'selected' : '').'>PT</option>
<option value="DE" '.((isset($_SESSION['country_code']) && $_SESSION['country_code'] == 'DE') ? 'selected' : '').'>DE</option>
</select>
</div>
</div>
<div class="login-visual">
<img src="https://dev.veliti.nl/assets/images/emergencyplug-auto-in-licht.jpg" alt="Login Visual">
</div>
</div>
</body>
</html>
';
<script>
document.getElementById(\'language-selector\').addEventListener(\'change\', function() {
if (this.value) {
// Get the current URL
let currentUrl = window.location.pathname;
// Append the selected value as a query parameter
window.location.href = `${currentUrl}?language=${this.value}`;
}
});
</script>
</html>';
?>

15
settings/translations/translations_DE.php
View File

@@ -751,4 +751,19 @@ $menu_shipping = 'Versand';
$menu_uploader = 'Upload-Tool';
$contract_billing4 = ' Einmalig im Voraus';
$message_build = ' Bitte melden Sie sich erneut an';
$username_enter = 'Geben Sie bitte den Benutzernamen ein';
$password_enter = 'Geben Sie bitte Ihr Passwort ein';
$password_err_1 = 'Nicht autorisiert, bitte versuchen Sie es erneut';
$password_err_2 = 'Zu viele Anmeldeversuche. Benutzer blockiert, bitte wenden Sie sich an Ihren Administrator';
$password_err_3 = 'Die Passwörter stimmen nicht überein';
$login_h1 = 'Melden Sie sich bei Ihrem Konto an';
$login_p = 'Geben Sie Ihre Anmeldedaten ein, um sich anzumelden';
$redirect_succes = 'Sie werden weitergeleitet';
$login_reset_h1 = 'Haben Sie Ihr Passwort vergessen?';
$login_reset_p = 'Geben Sie Ihren Benutzernamen ein, um das Passwort zurückzusetzen';
$button_back_to_login = 'Zurück zum Login';
$button_reset = 'Zurücksetzen anfordern';
$password_new = 'Neues Passwort';
$password_check = 'Wiederhole das Passwort';
$button_password_update = 'Passwort aktualisieren';
?>

15
settings/translations/translations_ES.php
View File

@@ -757,4 +757,19 @@ $menu_shipping = 'Envío';
$menu_uploader = 'Herramienta de carga';
$contract_billing4 = ' Único pago por adelantado';
$message_build = ' Por favor, faça login novamente';
$username_enter = 'Por favor, ingresa tu nombre de usuario';
$password_enter = 'Por favor, ingresa tu contraseña';
$password_err_1 = 'No autorizado, por favor reinténtalo';
$password_err_2 = 'Ha demasiados intentos de inicio de sesión. Usuario bloqueado, por favor contacte con su administrador';
$password_err_3 = 'Las contraseñas no coinciden';
$login_h1 = 'Inicia sesión en tu cuenta';
$login_p = 'Ingresa tus detalles para iniciar sesión';
$redirect_succes = 'Sera redirigido';
$login_reset_h1 = '¿Olvidaste tu contraseña?';
$login_reset_p = 'Introduce tu nombre de usuario para restablecer la contraseña';
$button_back_to_login = 'Volver a iniciar sesión';
$button_reset = 'Solicitar restablecimiento';
$password_new = 'Nueva contraseña';
$password_check = 'Repite la contraseña';
$button_password_update = 'Actualizar contraseña';
?>

17
settings/translations/translations_NL.php
View File

@@ -123,7 +123,7 @@ $data_software_text = 'Activa upgrade gewenst';
$data_service_text_forecast = 'Activa waarbij service gewenst per kwartaal';
$data_warranty_text_forecast = 'Activa onder garantie tot kwartaal';
$button1 = 'Login';
$button2 = 'Request reset';
$button2 = 'Wachtwoord vergeten?';
$equipment_label1 = 'Indicatie';
$equipment_label2 = 'Serienummer';
$equipment_label3 = 'Status';
@@ -963,4 +963,19 @@ $payment_status_999 = 'Geannuleerd';
$payment_method_3 = ' Debit/Credit';
$contract_billing4 = ' Eenmalig vooraf';
$message_build = ' Gelieve opnieuw in te loggen';
$username_enter = 'Vul je gebruikersnaam in';
$password_enter = 'Vul je wachtwoord in';
$password_err_1 = 'Niet geautoriseerd, probeer het opnieuw';
$password_err_2 = 'Te veel inlogpogingen. Gebruiker geblokkeerd, neem contact op met je beheerder';
$password_err_3 = 'Wachtwoorden komen niet overeen';
$login_h1 = 'Inloggen op je account';
$login_p = 'Vul je gegevens in om in te loggen';
$redirect_succes = 'U wordt doorgestuurd';
$login_reset_h1 = 'Wachtwoord vergeten';
$login_reset_p = 'Vul je gebruikersnaam in om je wachtwoord te resetten';
$button_back_to_login = 'Terug naar inloggen';
$button_reset = 'Aanvraag reset';
$password_new = 'Nieuw wachtwoord';
$password_check = 'Herhaal wachtwoord';
$button_password_update = 'Wachtwoord bijwerken';
?>

15
settings/translations/translations_PT.php
View File

@@ -757,4 +757,19 @@ $menu_shipping = 'Envio';
$menu_uploader = 'Ferramenta de upload';
$contract_billing4 = ' Único pagamento antecipado';
$message_build = ' Por favor, inicie sesión nuevamente';
$username_enter = 'Por favor, insira o nome de usuário';
$password_enter = 'Por favor, insira sua senha';
$password_err_1 = 'Não autorizado, tente novamente';
$password_err_2 = 'Excesso de tentativas de login. Usuário bloqueado, por favor, entre em contato com o seu administrador';
$password_err_3 = 'As senhas não coincidem';
$login_h1 = 'Entrar na sua conta';
$login_p = 'Insira seus dados para fazer login';
$redirect_succes = 'Você será redirecionado';
$login_reset_h1 = 'Esqueceu sua senha?';
$login_reset_p = 'Insira seu nome de usuário para redefinir a senha';
$button_back_to_login = 'Voltar para o login';
$button_reset = 'Solicitar redefiniçao';
$password_new = 'Nova senha';
$password_check = 'Repita a senha';
$button_password_update = 'Atualizar senha';
?>

17
settings/translations/translations_US.php
View File

@@ -123,7 +123,7 @@ $data_software_text = 'Assets requiring firmware upgrade';
$data_service_text_forecast = 'Assets with service due within given period';
$data_warranty_text_forecast = 'Assets with warranty coverage untill given period';
$button1 = 'Login';
$button2 = 'Request reset';
$button2 = 'Forgot password?';
$equipment_label1 = 'Indicators';
$equipment_label2 = 'Serialnumber';
$equipment_label3 = 'Status';
@@ -968,4 +968,19 @@ $payment_status_999 = 'Cancelled';
$payment_method_3 = 'Debit/Credit';
$contract_billing4 = ' Onetime upfront';
$message_build = ' Please login again';
$username_enter = 'Please enter username';
$password_enter = 'Please enter your password';
$password_err_1 = 'Not authorized, please retry';
$password_err_2 = 'Too many login attempts. User blocked, please contact your administrator';
$password_err_3 = 'Passwords do not match';
$login_h1 = 'Login to your account';
$login_p = 'Enter your details to login';
$redirect_succes = 'You will be redirected';
$login_reset_h1 = 'Forgot your password';
$login_reset_p = 'Enter your username to reset password';
$button_back_to_login = 'Back to login';
$button_reset = 'Request reset';
$password_new = 'New Password';
$password_check = 'Repeat password';
$button_password_update = 'Update password';
?>

318
style/admin_login.css
View File

@@ -1,172 +1,226 @@
:root {
--color-white: #FFFFFF;
--color-light-green: #2FAC66;
--color-green: #005655c2;
--color-red: #a75151;
--text-color: #333333;
--error-background: #f3c3c3;
}
* {
padding: 0;
margin: 0;
box-sizing: border-box;
font-family: "Open Sans", Helvetica, sans-serif;
accent-color: #005655c2;
accent-color: var(--color-green);
}
body {
background-color: #fff;
font-family: sans-serif;
background-color:#2FAC66;
background-image: url(/assets/images/emergencyplug-auto-in-licht.jpg);
background-position: center center;
background-size: 100% 100%;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background-repeat: no-repeat;
background-color: var(--color-white);
padding: 20px;
}
.logon {
margin: 0;
.login-container {
display: flex;
width: 100%;
max-width: 1200px;
height: calc(100vh - 40px);
background-color: var(--color-white);
border-radius: 16px;
box-shadow: 0 10px 25px rgba(0,0,0,0.1);
overflow: hidden;
}
.login-form {
width: 45%;
padding: 40px;
display: flex;
flex-direction: column;
justify-content: center;
position: relative;
}
.logo {
position: absolute;
top: 40%;
left: 50%;
transform: translate(-50%, -50%);
}
#imagelogon {
top: 20px;
left: 20px;
background-image: url(/assets/images/TSS-logo3.png);
background-repeat: no-repeat;
opacity: inherit;
width: 85px;
height: 150px;
height: 120px;
margin: 0 auto;
position: relative;
top: 87px;
-webkit-filter: drop-shadow(5px 5px 5px #222);
filter: drop-shadow(5px 5px 5px #222);
}
.login-box{
width: 350px;
height: 330px;
background-color:#005655c2;
padding: 55px 30px;
border-radius: 10px;
text-align: center;
-webkit-box-shadow: 10px 10px 5px -4px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 5px -4px rgba(0,0,0,0.75);
box-shadow: 10px 10px 5px -4px rgba(0,0,0,0.75);
.login-visual {
width: 55%;
position: relative;
overflow: hidden;
}
.login-box h1{
font-weight: 500;
color: #fff;
.login-visual img {
width: 100%;
height: 100%;
object-fit: cover;
}
.login-box input[type="text"],
.login-box input[type="password"]{
width: 75%;
.register-link {
position: absolute;
top: 20px;
right: 20px;
text-decoration: none;
color: var(--text-color);
}
.header {
margin-bottom: 30px;
}
.header h1 {
font-size: 24px;
margin-bottom: 10px;
}
.login-box input[type="text"],
.login-box input[type="password"]{
border-radius: 10px;
//background: transparent;
border: none;
outline: none;
border: 2px solid #2FAC66;
font-size: 13px;
height: 40px;
text-align: center;
transition: 0.27s;
}
.login-box input[type="text"]:focus,
.login-box input[type="password"]:focus{
width: 80%;
border-color:#6fd653;
.header p {
color: #666;
}
.login-box input[type="submit"]{
width: 60%;
border: none;
outline: none;
background: #2FAC66;
padding: 10px 0;
border-radius: 10px;
color: #ffffff;
font-weight: 500;
text-transform: uppercase;
cursor: pointer;
margin-bottom: 20px;
.input-group {
margin-bottom: 15px;
position: relative;
bottom: -12px;
font-style: italic;
}
.login-box input[type="submit"]:hover{
background:#6FD653;
transition: .2s;
}
.login-box input[type="submit"]:focus{
transform: scaleX(1.1);
}
.login-box a {
text-decoration: none;
font-size: 12px;
color: #00bcd4;
}
.login-box a:hover{
color: #6FD653;
}
#reset a {
text-decoration: none;
font-size: 10px;
color: #00bcd4;
}
#reset {
margin-top: -10px;
}
#message p {
font-size: 15px;
color: #ffffff;;
}
/* Slide 5 */
.slider-checkbox {
width: 3em;
height: 1.5em;
margin: 20px auto;
}
.slider-checkbox * {
transition: 250ms;
box-sizing: border-box;
}
.slider-checkbox input[type="checkbox"] {
display: none;
}
.slider-checkbox label {
display: inline-block;
.input-group input {
width: 100%;
height: 95%;
background: #005655c2;
border-radius: 0.7em;
padding-top: 0.2em;
padding-left: 0.2em;
padding: 10px;
border: 1px solid #ddd;
border-radius: 4px;
}
.slider-checkbox span {
display: inline-block;
width: 1em;
height: 1em;
background: #FFF;
.input-group input[type="email"] {
padding-left: 40px;
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="%23999" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg>') no-repeat left 10px center;
}
.input-group input[type="password"] {
padding-left: 40px;
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="%23999" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg>') no-repeat left 10px center;
}
.forgot-password {
color: var(--text-color);
text-decoration: none;
text-align: right;
margin-top: 5px;
float: right;
font-size: 12px;
}
.remember-me {
display: flex;
align-items: center;
margin-bottom: 20px;
}
.remember-me input {
margin-right: 10px;
}
.maintenance {
padding: 5px;
}
.message p {
margin-top: 5px;
background-color: var(--error-background);
border-left: 4px solid var(--color-red);
color: var(--color-red);
padding: 5px;
border-radius: 4px;
text-align: center;
}
.login-btn {
width: 100%;
padding: 12px;
background-color: var(--color-light-green);
color: var(--color-white);
border: none;
border-radius: 2em;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.3s ease;
}
.slider-checkbox input[type="checkbox"]:checked ~ label {
background: #93ed49;
padding-left: 1.7em;
.login-btn:hover {
background-color: var(--color-green);
}
.trademark {
position: absolute;
bottom: 20px;
left: 20px;
color: var(--text-color);
font-size: 12px;
}
.language-selector {
position: absolute;
bottom: 20px;
right: 20px;
display: flex;
align-items: center;
color: var(--text-color);
}
.language-selector select {
margin-left: 10px;
border: none;
background: transparent;
}
/* Responsive Design */
@media screen and (max-width: 1024px) {
.login-container {
flex-direction: column;
height: auto;
max-width: 500px;
}
.login-form, .login-visual {
width: 100%;
height: auto;
}
.login-visual {
height: 300px;
}
.logo {
position: static;
margin: 20px auto;
margin-bottom: 0;
}
.trademark, .language-selector {
position: static;
text-align: center;
margin: 20px 0;
}
}
@media screen and (max-width: 480px) {
.login-form {
padding: 20px;
}
.header h1 {
font-size: 20px;
}
}

262
style/admin_reset.css
View File

@@ -1,132 +1,226 @@
:root {
--color-white: #FFFFFF;
--color-light-green: #2FAC66;
--color-green: #005655c2;
--color-red: #a75151;
--text-color: #333333;
--error-background: #f3c3c3;
}
* {
padding: 0;
margin: 0;
box-sizing: border-box;
font-family: "Open Sans", Helvetica, sans-serif;
accent-color: '.color.';
accent-color: var(--color-green);
}
body {
background-color: #fff;
font-family: sans-serif;
background-color:#2FAC66;
background-image: url(/assets/images/emergencyplug-auto-in-licht.jpg);
background-position: center center;
background-size: 100% 100%;
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
background-repeat: no-repeat;
background-color: var(--color-white);
padding: 20px;
}
.logon {
margin: 0;
.login-container {
display: flex;
width: 100%;
max-width: 1200px;
height: calc(100vh - 40px);
background-color: var(--color-white);
border-radius: 16px;
box-shadow: 0 10px 25px rgba(0,0,0,0.1);
overflow: hidden;
}
.login-form {
width: 45%;
padding: 40px;
display: flex;
flex-direction: column;
justify-content: center;
position: relative;
}
.logo {
position: absolute;
top: 40%;
left: 50%;
transform: translate(-50%, -50%)
}
#imagelogon {
top: 20px;
left: 20px;
background-image: url(/assets/images/TSS-logo3.png);
background-repeat: no-repeat;
opacity: inherit;
width: 85px;
height: 150px;
height: 120px;
margin: 0 auto;
position: relative;
top: 87px;
-webkit-filter: drop-shadow(5px 5px 5px #222);
filter: drop-shadow(5px 5px 5px #222);
}
.login-box{
width: 350px;
height: 330px;
background-color:#005655;
padding: 55px 30px;
border-radius: 10px;
text-align: center;
-webkit-box-shadow: 10px 10px 5px -4px rgba(0,0,0,0.75);
-moz-box-shadow: 10px 10px 5px -4px rgba(0,0,0,0.75);
box-shadow: 10px 10px 5px -4px rgba(0,0,0,0.75);
.login-visual {
width: 55%;
position: relative;
overflow: hidden;
}
.login-box h1{
font-weight: 500;
color: #fff;
.login-visual img {
width: 100%;
height: 100%;
object-fit: cover;
}
.login-box input[type="text"],
.login-box input[type="password"]{
width: 75%;
.register-link {
position: absolute;
top: 20px;
right: 20px;
text-decoration: none;
color: var(--text-color);
}
.header {
margin-bottom: 30px;
}
.header h1 {
font-size: 24px;
margin-bottom: 10px;
}
.login-box input[type="text"],
.login-box input[type="password"]{
border-radius: 10px;
//background: transparent;
border: none;
outline: none;
border: 2px solid #2FAC66;
font-size: 13px;
height: 40px;
text-align: center;
transition: 0.27s;
}
.login-box input[type="text"]:focus,
.login-box input[type="password"]:focus{
width: 80%;
border-color:#6fd653;
.header p {
color: #666;
}
.login-box input[type="submit"]{
width: 60%;
border: none;
outline: none;
background: #2FAC66;
padding: 10px 0;
border-radius: 10px;
color: #ffffff;
font-weight: 500;
text-transform: uppercase;
cursor: pointer;
margin-bottom: 20px;
.input-group {
margin-bottom: 15px;
position: relative;
bottom: -12px;
font-style: italic;
}
.login-box input[type="submit"]:hover{
background:#6FD653;
transition: .2s;
.input-group input {
width: 100%;
padding: 10px;
border: 1px solid #ddd;
border-radius: 4px;
}
.login-box input[type="submit"]:focus{
transform: scaleX(1.1);
.input-group input[type="email"] {
padding-left: 40px;
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="%23999" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg>') no-repeat left 10px center;
}
.login-box a {
.input-group input[type="password"] {
padding-left: 40px;
background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="%23999" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg>') no-repeat left 10px center;
}
.forgot-password {
color: var(--text-color);
text-decoration: none;
text-align: right;
margin-top: 5px;
float: right;
font-size: 12px;
color: #00bcd4;
}
.login-box a:hover{
color: #6FD653;
.remember-me {
display: flex;
align-items: center;
margin-bottom: 20px;
}
#reset a {
text-decoration: none;
font-size: 10px;
color: #00bcd4;
.remember-me input {
margin-right: 10px;
}
#reset {
margin-top: -10px;
.maintenance {
padding: 5px;
}
#message p {
font-size: 15px;
color: #ffffff;;
.message p {
margin-top: 5px;
background-color: var(--error-background);
border-left: 4px solid var(--color-red);
color: var(--color-red);
padding: 5px;
border-radius: 4px;
text-align: center;
}
.login-btn {
width: 100%;
padding: 12px;
background-color: var(--color-light-green);
color: var(--color-white);
border: none;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.3s ease;
}
.login-btn:hover {
background-color: var(--color-green);
}
.trademark {
position: absolute;
bottom: 20px;
left: 20px;
color: var(--text-color);
font-size: 12px;
}
.language-selector {
position: absolute;
bottom: 20px;
right: 20px;
display: flex;
align-items: center;
color: var(--text-color);
}
.language-selector select {
margin-left: 10px;
border: none;
background: transparent;
}
/* Responsive Design */
@media screen and (max-width: 1024px) {
.login-container {
flex-direction: column;
height: auto;
max-width: 500px;
}
.login-form, .login-visual {
width: 100%;
height: auto;
}
.login-visual {
height: 300px;
}
.logo {
position: static;
margin: 20px auto;
margin-bottom: 0;
}
.trademark, .language-selector {
position: static;
text-align: center;
margin: 20px 0;
}
}
@media screen and (max-width: 480px) {
.login-form {
padding: 20px;
}
.header h1 {
font-size: 20px;
}
}