From 7ad6ca0df78f6893bb8afc8cec789c3d58893f75 Mon Sep 17 00:00:00 2001
From: sajotrei <75281007+sajotrei@users.noreply.github.com>
Date: Fri, 14 Aug 2026 10:37:02 +0200
Subject: [PATCH] Modernize login page UI
---
assets/src/css/style.css | 186 +++++++++++++++++++++++++++++++++
include/login.php | 211 +++++++++++++++++++++++++++++++++++++
index.php | 219 ++++++++++-----------------------------
locale/de_DE/de_DE.mo | Bin 1173 -> 1367 bytes
locale/de_DE/de_DE.po | 16 +++
locale/en_GB/en_GB.mo | Bin 288551 -> 288756 bytes
locale/en_GB/en_GB.po | 16 +++
7 files changed, 483 insertions(+), 165 deletions(-)
create mode 100644 include/login.php
diff --git a/assets/src/css/style.css b/assets/src/css/style.css
index 19141ae042..88ab38aaaf 100755
--- a/assets/src/css/style.css
+++ b/assets/src/css/style.css
@@ -216,6 +216,192 @@ input[type=file] {
box-shadow: 0 1px 3px rgba(255, 193, 7, 0.3);
}
+.login-page .osm-login {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ width: 100%;
+ min-height: 100vh;
+ padding: 32px 16px;
+ background:
+ linear-gradient(135deg, rgba(15, 23, 42, 0.04), rgba(14, 165, 233, 0.08)),
+ #f5f7fb;
+}
+
+.login-page .osm-login__panel {
+ width: min(100%, 430px);
+}
+
+.login-page .osm-login__brand {
+ margin-bottom: 18px;
+ text-align: center;
+}
+
+.login-page .osm-login__logo {
+ width: min(100%, 310px);
+ max-height: 86px;
+ object-fit: contain;
+}
+
+.login-page .osm-login__locale {
+ display: flex;
+ align-items: center;
+ justify-content: flex-end;
+ gap: 8px;
+ margin-bottom: 12px;
+}
+
+.login-page .osm-login__locale-label {
+ margin-bottom: 0;
+ color: #4b5563;
+ font-size: 0.9rem;
+ font-weight: 600;
+}
+
+.login-page .osm-login__locale-select {
+ width: auto;
+ min-width: 180px;
+}
+
+.login-page .osm-login__form {
+ padding: 32px;
+ background: #fff;
+ border: 1px solid #dbe3ef;
+ border-radius: 8px;
+ box-shadow: 0 18px 45px rgba(15, 23, 42, 0.12);
+}
+
+.login-page .osm-login__title {
+ margin: 0;
+ color: #111827;
+ font-size: 1.75rem;
+ font-weight: 700;
+ letter-spacing: 0;
+ line-height: 1.2;
+}
+
+.login-page .osm-login__subtitle {
+ margin: 8px 0 24px;
+ color: #64748b;
+}
+
+.login-page .osm-login__notice,
+.login-page .osm-login__error {
+ border-radius: 8px;
+}
+
+.login-page .osm-login__brute {
+ display: block;
+ margin-top: 8px;
+}
+
+.login-page .osm-login__field {
+ margin-bottom: 18px;
+}
+
+.login-page .osm-login__field label {
+ color: #334155;
+ font-weight: 600;
+}
+
+.login-page .osm-login__field .form-control {
+ min-height: 46px;
+ border-color: #cbd5e1;
+ border-radius: 6px 0 0 6px;
+}
+
+.login-page .osm-login__field .input-group-text,
+.login-page .osm-login__password-toggle {
+ min-width: 46px;
+ border-color: #cbd5e1;
+ background: #f8fafc;
+ color: #475569;
+}
+
+.login-page .osm-login__password-toggle {
+ border-radius: 0 6px 6px 0;
+}
+
+.login-page .osm-login__submit {
+ min-height: 48px;
+ border-radius: 6px;
+ font-weight: 700;
+}
+
+.login-page .osm-login__links {
+ margin-top: 18px;
+ text-align: center;
+}
+
+.login-page .osm-login__links a {
+ color: #475569;
+ font-weight: 600;
+}
+
+.login-page .osm-login__links a:hover {
+ color: #0f766e;
+}
+
+.login-page .osm-login__divider {
+ display: flex;
+ align-items: center;
+ gap: 12px;
+ margin: 24px 0 16px;
+ color: #64748b;
+ font-size: 0.9rem;
+}
+
+.login-page .osm-login__divider::before,
+.login-page .osm-login__divider::after {
+ content: "";
+ flex: 1;
+ height: 1px;
+ background: #e2e8f0;
+}
+
+.login-page .osm-login__oauth-button {
+ border-radius: 6px;
+ font-weight: 700;
+}
+
+.login-page .osm-login :focus-visible {
+ outline: 3px solid rgba(14, 165, 233, 0.35);
+ outline-offset: 2px;
+}
+
+@media (max-width: 575.98px) {
+ .login-page .osm-login {
+ align-items: flex-start;
+ padding: 22px 12px;
+ }
+
+ .login-page .osm-login__brand {
+ margin-bottom: 14px;
+ }
+
+ .login-page .osm-login__logo {
+ width: min(100%, 250px);
+ max-height: 72px;
+ }
+
+ .login-page .osm-login__locale {
+ justify-content: stretch;
+ }
+
+ .login-page .osm-login__locale-select {
+ flex: 1;
+ min-width: 0;
+ }
+
+ .login-page .osm-login__form {
+ padding: 24px 18px;
+ }
+
+ .login-page .osm-login__title {
+ font-size: 1.45rem;
+ }
+}
+
/* Disabilita il widget sidebar-search di AdminLTE */
[data-widget-disabled="true"] .sidebar-search-results,
.sidebar-search-results,
diff --git a/include/login.php b/include/login.php
new file mode 100644
index 0000000000..6300b38b07
--- /dev/null
+++ b/include/login.php
@@ -0,0 +1,211 @@
+.
+ */
+
+$escape = static fn ($value) => htmlspecialchars((string) $value, ENT_QUOTES, 'UTF-8');
+
+$username = $username ?? '';
+$error_message = $error_message ?? null;
+$available_login_locales = $available_login_locales ?? [];
+$selected_login_locale = $selected_login_locale ?? trans_osm()->getCurrentLocale();
+$oauth_providers = $oauth_providers ?? [];
+
+$provider_icon = static function ($provider_name) {
+ $provider_name = strtolower((string) $provider_name);
+
+ if (str_contains($provider_name, 'microsoft')) {
+ return 'fa-windows';
+ }
+ if (str_contains($provider_name, 'keycloak')) {
+ return 'fa-key';
+ }
+ if (str_contains($provider_name, 'google')) {
+ return 'fa-google';
+ }
+
+ return 'fa-sign-in';
+};
+
+echo '
+
+
'.tr('Sono stati effettuati troppi tentativi di accesso consecutivi!').'
-'.tr('Tempo rimanente').':
-;QfQJkKy#p7l7chp9zVDV9e7l%--{l%htLTuMh9Mjp5M)As0&;X
z+UsI1>TP3vA{y$s=!Djy6WD|v!{n v0Z;ymw7N82$NsokLAekn#Z6jOmx-x^|`iiI`fFv
z!ntO_`EU))d)@iY=OK(8hF7v1&W>ce>97^l5zT|Tyepv!-3Lp-3s9dg;@@(PCJ*%d
z{%;uux(v0T&aOVxirW}_K;7cOHXm=C1C?;4>9;^Ve*2-${4&&KeP@h#+tGW&%*cIj
z^Ze^fnwek<)RyjpI-~G+oR7-|U}@%UU=Fw*>dxFV=D6$pa@r86c)>6m{BHB~_v~^*
zUFxPb?{tsnUn>nnpdA w~d9=fS(dYAw3Xv;`9(47w0=C3F?*BU}RK#g$NMFY8xCxtL&O5^ZJEJ+#
z7j1YNnw*Q!$UKKe>TPra2hsM9qD%P$nrpw~2)t}G`@b87(G(onPIL`FMMM8J+R;h0
zqkp40$AkeDMH{YycH9t+SXVUZZo>?GF!}--$z7N_n8vXGTXEqm7e-;dv0?wO#!}RO
zz;>C~@8iP$?KVFAJ-`&4#QkkJ2J24iw8p
zNZ}9#S3IhI3@Msq)3FpTz@E4Zoj~CR;cqya;0@I8z$`p~ChLFb@h#mj9Jg-hRy~bQ
zU}bbeL(ad+wSxvj{2n^+DKz`fp*fJFQJCQ6==0^#i>VR%TpRR;>xmw}F=*swqy4Tx
zkK<1CxlhnY{n3c?UxUK=*if}`NUqxG08P-2+F?f=fQIe`G-6xOWZj1z<0I%m=VE)I
zCSkx5Xk?n83mAq@Y(kQP$ub}9a6P)BJ!nVoqaFW%t}IW}@O&9GGEMOg?20Dq>*(qD
z7+t^@=!#EAFKQMRP!jDoS&@P-bU+koV*DL+G0Qj7BJ1r7+V1XoE%221}#&
zo1!!Cj7GL6+J1ku-LbKroJqm8e*#P6YiQ{Hhc@^Nnq-$(4r^EeZJ;+A%F*cdT!t>i
zt7u1C(U9*&+dGCn_ZxchWv-HXE}3Xd!L{y!zAy%Ta7L^zK|5TFhV)%@K!?z*zl0{!
zwN=CQvS@o9(QP*hGjJ}tWUru+*@B(j|2rtO;lkC`!W!L*uJJG&k1t^dELlBd`)Hg&
z{WTnm4Qhm>d>MOCKaHcXT}^(l;2T&E|3SY2wQ6NbY{YR`h5i%eYG+FH!yecjx8OaP
zw@x_w=c3ze2ijn^x}l@?*pT`vyaT_*TG*vtSc(VG8P7!{y98b8wO9jpV$zS!KNLz}
zk@_KY&C!q#LX&3_+R#+=r`jyE!8g(8_M-29hZ&fqK}f=~=#tezv%fRCn|h(`jc&mH
zw=kItwQ&Zzf48DZvmNbdKl