fixes #2345 create piwigo standard pages

create new theme standard pages with tpl, css, js and images
update backend to handle pages
add config use_standard_pages
on update set config to false, on install set config to true
add standard pages to no be ingored in git

admin/configuration.php

@@ -50,6 +50,7 @@ $main_checkboxes = array(
     'show_mobile_app_banner_in_gallery',
     'show_mobile_app_banner_in_admin',
     'upload_detect_duplicate',
+    'use_standard_pages',
    );
 
 $sizes_checkboxes = array(

admin/themes/default/template/configuration_main.tpl

@@ -252,6 +252,17 @@ jQuery("input[name='email_admin_on_new_user_filter']").change(function() {
         <span class="icon-help-circled tiptip" title="{'During upload, if Piwigo detects the photo already exists, associate the existing photo to the destination album, without duplicating file'|translate}" style="cursor:help"></span>
       </li>
 
+      <li>
+        <label class="font-checkbox">
+          <span class="icon-check"></span>
+          <input type="checkbox" name="use_standard_pages" {if ($main.use_standard_pages)}checked="checked"{/if}>
+            {'Use standard Piwigo template for common pages.'|translate}
+        </label>
+
+        <span class="icon-help-circled tiptip" title="{'When enabled, a common template is used for the login, registration and forgotten password pages, regardless of the theme. Some themes might use these templates even if you uncheck this option'|translate}" style="cursor:help"></span>
+      </li>
+
+
 
       <li>
         <label>{'Mail theme'|translate}</label>

admin/themes_installed.php

@@ -59,7 +59,7 @@ $tpl_themes = array();
 
 foreach ($themes->fs_themes as $theme_id => $fs_theme)
 {
-  if ($theme_id == 'default')
+  if ($theme_id == 'default' or $theme_id == 'standard_pages')
   {
     continue;
   }

identification.php

@@ -40,7 +40,7 @@ if ( !empty($_GET['redirect']) )
   $redirect_to = urldecode($_GET['redirect']);
   if ( $conf['guest_access'] and !isset($_GET['hide_redirect_error']))
   {
-    $page['errors'][] = l10n('You are not authorized to access the requested page');
+    $page['errors']['login_page_error'][] = l10n('You are not authorized to access the requested page');
   }
 }
 
@@ -48,7 +48,7 @@ if (isset($_POST['login']))
 {
   if (!isset($_COOKIE[session_name()]))
   {
-    $page['errors'][] = l10n('Cookies are blocked or not supported by your browser. You must enable cookies to connect.');
+    $page['errors']['login_page_error'][] = l10n('Cookies are blocked or not supported by your browser. You must enable cookies to connect.');
   }
   else
   {
@@ -82,7 +82,7 @@ if (isset($_POST['login']))
     }
     else
     {
-      $page['errors'][] = l10n('Invalid username or password!');
+      $page['errors']['login_form_error'] = l10n('Invalid username or password!');
     }
   }
 }
@@ -121,6 +121,41 @@ if (!$conf['gallery_locked'] && (!isset($themeconf['hide_menu_on']) OR !in_array
   include( PHPWG_ROOT_PATH.'include/menubar.inc.php');
 }
 
+//Load language if cookie is set from login/register/password pages
+if (isset($_COOKIE['lang']) and $user['language'] != $_COOKIE['lang'])
+{
+  if (!array_key_exists($_COOKIE['lang'], get_languages()))
+  {
+    fatal_error('[Hacking attempt] the input parameter "'.$_COOKIE['lang'].'" is not valid');
+  }
+  
+  $user['language'] = $_COOKIE['lang'];
+  load_language('common.lang', '', array('language'=>$user['language']));
+}
+
+//Get list of languages
+foreach (get_languages() as $language_code => $language_name)
+{
+  $language_options[$language_code] = $language_name;
+}
+
+$template->assign(array(
+  'language_options' => $language_options,
+  'current_language' => $user['language']
+));
+
+//Get link to doc
+if ('fr' == substr($user['language'], 0, 2))
+{
+  $help_link = "https://doc-fr.piwigo.org/les-utilisateurs/se-connecter-a-piwigo";
+}
+else
+{
+  $help_link = "https://doc.piwigo.org/managing-users/log-in-to-piwigo";
+}
+
+$template->assign('HELP_LINK', $help_link);
+
 //----------------------------------------------------------- html code display
 include(PHPWG_ROOT_PATH.'include/page_header.php');
 trigger_notify('loc_end_identification');

include/functions_user.inc.php

@@ -1048,6 +1048,29 @@ function log_user($user_id, $remember_me)
 {
   global $conf, $user;
 
+  //New default login and register pages, if users changes languages and succesfully logs in
+  //we want to update the userpref language stored in a cookie
+
+  //TODO check value of cookie
+
+  if (isset($_COOKIE['lang']) and $user['language'] != $_COOKIE['lang'])
+  {
+    if (!array_key_exists($_COOKIE['lang'], get_languages()))
+    {
+      fatal_error('[Hacking attempt] the input parameter "'.$_COOKIE['lang'].'" is not valid');
+    }
+
+    single_update(
+      USER_INFOS_TABLE,
+      array('language' => $_COOKIE['lang']),
+      array('user_id' => $user_id)
+    );
+
+    // We unset the lang cookie, if user has changed their language using interface we don't want to keep setting it back 
+    // to what was chosen using standard pages lang switch
+    setcookie("lang", "", time() - 3600);
+  }
+
   if ($remember_me and $conf['authorize_remembering'])
   {
     $now = time();

include/template.class.php

@@ -181,10 +181,21 @@ class Template
    */
   function set_theme($root, $theme, $path, $load_css=true, $load_local_head=true, $colorscheme='dark')
   {
-    $this->set_template_dir($root.'/'.$theme.'/'.$path);
-
     $themeconf = $this->load_themeconf($root.'/'.$theme);
 
+    // We loop over the theme and the parent theme, so if we exclude default, 
+    // standard pages can't get the header to load the html header
+    if (
+      'default' != $theme 
+      and in_array(script_basename(), array('identification', 'register', 'password')) 
+      and (($themeconf['use_standard_pages'] ?? false) or conf_get_param('use_standard_pages', false))
+    )
+    {
+      $theme = 'standard_pages';
+    }
+
+    $this->set_template_dir($root.'/'.$theme.'/'.$path);
+
     if (isset($themeconf['parent']) and $themeconf['parent'] != $theme)
     {
       $this->set_theme(

install/config.sql

@@ -79,3 +79,4 @@ INSERT INTO piwigo_config (param,value) VALUES ('index_search_in_set_button','fa
 INSERT INTO piwigo_config (param,value) VALUES ('index_search_in_set_action','true');
 INSERT INTO piwigo_config (param,value) VALUES ('upload_detect_duplicate','true');
 INSERT INTO piwigo_config (param,value) VALUES ('webmaster_id','1');
+INSERT INTO piwigo_config (param,value) VALUES ('use_standard_pages','true');

install/db/175-database.php

@@ -0,0 +1,22 @@
+<?php
+// +-----------------------------------------------------------------------+
+// | This file is part of Piwigo.                                          |
+// |                                                                       |
+// | For copyright and license information, please view the COPYING.txt    |
+// | file that was distributed with this source code.                      |
+// +-----------------------------------------------------------------------+
+
+if (!defined('PHPWG_ROOT_PATH'))
+{
+  die('Hacking attempt!');
+}
+
+$upgrade_description = 'add config parameter to override Theme Login & Registration Pages';
+
+// we set it to false in this upgrade script, as opposed to the default value
+// for a new installation, because it was the default behavior before Piwigo 16
+conf_update_param('use_standard_pages', false);
+
+echo "\n".$upgrade_description."\n";
+
+?>

language/en_GB/common.lang.php

@@ -175,7 +175,7 @@ $lang['Photo title, A → Z'] = 'Photo title, A → Z';
 $lang['Photo title, Z → A'] = 'Photo title, Z → A';
 $lang['Link: %s'] = 'Link: %s';
 $lang['Links'] = 'Links';
-$lang['Login'] = 'Login';
+$lang['Login'] = 'Sign in';
 $lang['Logout'] = 'Logout';
 $lang['Manage this user comment: %s'] = 'Manage this user comment: %s';
 $lang['Manual sort order'] = 'Manual sort order';

language/en_UK/common.lang.php

@@ -205,7 +205,7 @@ $lang['letters'] = "letters";
 $lang['Links'] = "Links";
 $lang['login mustn\'t end with a space character'] = "login must not end with a space character";
 $lang['login mustn\'t start with a space character'] = "login must not start with a space character";
-$lang['Login'] = "Login";
+$lang['Login'] = "Sign in";
 $lang['Logout'] = "Logout";
 $lang['mail address must be like xxx@yyy.eee (example : jack@altern.org)'] = 'mail address must be like xxx@yyy.eee (example: jack@altern.org)';
 $lang['Manage this user comment: %s'] = 'Manage this user comment: %s';
@@ -455,3 +455,20 @@ $lang['There are no tags available for the photos currently filtered'] = 'There
 $lang['There are no creation dates available for the photos currently filtered'] = 'There are no creation dates available for the photos currently filtered';
 $lang['There are no authors available for the photos currently filtered'] = 'There are no authors available for the photos currently filtered';
 $lang['Set your password below.'] = 'Set your password below.';
+$lang['Use standard Piwigo template for common pages.'] = 'Use standard Piwigo template for common pages.';
+$lang['When enabled, a common template is used for the login and registration pages, regardless of the theme.'] = 'When enabled, a common template is used for the login and registration pages, regardless of the theme.';
+$lang['Don\'t have an account yet ?'] = 'Don\'t have an account yet ?';
+$lang['Create an account'] = 'Create an account';
+$lang['Return to the gallery'] = 'Return to the gallery';
+$lang['Already have an account ?'] = 'Already have an account ?';
+$lang['An email has been sent with a link to reset your password'] = 'An email has been sent with a link to reset your password';
+$lang['Check your inbox'] = 'Check your inbox';
+$lang['Your password was successfully set'] = 'Your password was successfully set';
+$lang['Your password was successfully reset'] = 'Your password was successfully reset';
+$lang['An error has occured please got back to <a href="identification.php" title="Sign in">Sign in</a> or <a href="register.php">Register</a>'] = 'An error has occured please got back to <a href="identification.php" title="Sign in">Sign in</a> or <a href="register.php">Register</a>';
+$lang['Return to <a href="identification.php" title="Sign in">Sign in</a>'] = 'Return to <a href="identification.php" title="Sign in">Sign in</a>';
+$lang['Hello <em>%s</em>, enter your new password below.'] = 'Hello <em>%s</em>, enter your new password below.';
+$lang['Confirm my new password'] = 'Confirm my new password';
+$lang['Confirm Password'] = 'Confirm Password';
+$lang['Confirm new password'] = 'Confirm new password';
+$lang['Set my password'] = 'Set my password';

language/fr_FR/common.lang.php

@@ -455,3 +455,20 @@ $lang['There are no tags available for the photos currently filtered'] = 'Aucun
 $lang['There are no creation dates available for the photos currently filtered'] = 'Aucune date de création n\'est disponible pour les photos actuellement filtrées';
 $lang['There are no authors available for the photos currently filtered'] = 'Aucun auteur n\'est disponible pour les photos actuellement filtrées';
 $lang['Set your password below.'] = 'Définissez votre mot de passe ci-dessous.';
+$lang['Use standard Piwigo template for common pages.'] = 'Utiliser le modèle standard de Piwigo pour les pages courantes.';
+$lang['When enabled, a common template is used for the login and registration pages, regardless of the theme.'] = 'Lorsqu\'elle est activée, un modèle commun est utilisé pour les pages de connexion, d\'inscription et de mot de passe oublié, quel que soit le thème. Certains thèmes peuvent utiliser ces modèles même si vous décochez cette option.';
+$lang['Don\'t have an account yet ?'] = 'Vous n\'avez pas encore de compte?';
+$lang['Create an account'] = 'Créez un compte';
+$lang['Return to the gallery'] = 'Retour à la galerie';
+$lang['Already have an account ?'] = 'Vous avez déjà un compte ?';
+$lang['An error has occured please got back to <a href="identification.php" title="Sign in">Sign in</a> or <a href="register.php">Register</a>'] = 'Une erreur est survenue, veuillez retourner à la page <a href="identification.php" title="Connexion">Connexion</a> ou <a href="register.php">Inscription</a>.';
+$lang['Return to <a href="identification.php" title="Sign in">Sign in</a>'] ='Retour à la page <a href="identification.php" title="Connexion">Connexion</a>';
+$lang['An email has been sent with a link to reset your password'] = 'Un e-mail a été envoyé avec un lien pour réinitialiser votre mot de passe.';
+$lang['Check your inbox.'] = 'Vérifiez votre boîte de réception.';
+$lang['Hello <em>%s</em>, enter your new password below.'] = 'Bonjour <em>%s</em>, saisissez votre nouveau mot de passe ci-dessous.';
+$lang['Confirm my new password'] = 'Confirmer mon nouveau mot de passe';
+$lang['Confirm Password'] = 'Confirmer le mot de passe';
+$lang['Confirm new password'] = 'Confirmer le nouveau mot de passe';
+$lang['Set my password'] = 'Définir mon mot de passe';
+$lang['Your password was successfully set'] = 'Votre mot de passe a été défini avec succès';
+$lang['Your password was successfully reset'] = 'Votre mot de passe a été réinitialisé avec succès';

password.php

@@ -22,7 +22,7 @@ check_status(ACCESS_FREE);
 
 trigger_notify('loc_begin_password');
 
-check_input_parameter('action', $_GET, false, '/^(lost|reset|none)$/');
+check_input_parameter('action', $_GET, false, '/^(lost|reset|lost_end|reset_end|none)$/');
 
 // +-----------------------------------------------------------------------+
 // | Functions                                                             |
@@ -40,7 +40,7 @@ function process_password_request()
   
   if (empty($_POST['username_or_email']))
   {
-    $page['errors'][] = l10n('Invalid username or email');
+    $page['errors']['password_form_error'] = l10n('Invalid username or email');
     return false;
   }
   
@@ -53,7 +53,7 @@ function process_password_request()
 
   if (!is_numeric($user_id))
   {
-    $page['errors'][] = l10n('Invalid username or email');
+    $page['errors']['password_form_error'] = l10n('Invalid username or email');
     return false;
   }
 
@@ -63,13 +63,13 @@ function process_password_request()
   $status = $userdata['status'];
   if (is_a_guest($status) or is_generic($status))
   {
-    $page['errors'][] = l10n('Password reset is not allowed for this user');
+    $page['errors']['password_form_error'] = l10n('Password reset is not allowed for this user');
     return false;
   }
 
   if (empty($userdata['email']))
   {
-    $page['errors'][] = l10n(
+    $page['errors']['password_form_error'] = l10n(
       'User "%s" has no email address, password reset is not possible',
       $userdata['username']
       );
@@ -92,7 +92,7 @@ function process_password_request()
   }
   else
   {
-    $page['errors'][] = l10n('Error sending email');
+    $page['errors']['password_page_error'] = l10n('Error sending email');
     return false;
   }
 }
@@ -110,7 +110,7 @@ function check_password_reset_key($reset_key)
   $key = $reset_key;
   if (!preg_match('/^[a-z0-9]{20}$/i', $key))
   {
-    $page['errors'][] = l10n('Invalid key');
+    $page['errors']['password_page_error'] = l10n('Invalid key');
     return false;
   }
 
@@ -130,7 +130,7 @@ SELECT
     {
       if (is_a_guest($row['status']) or is_generic($row['status']))
       {
-        $page['errors'][] = l10n('Password reset is not allowed for this user');
+        $page['errors']['password_page_error'] = l10n('Password reset is not allowed for this user');
         return false;
       }
 
@@ -141,7 +141,7 @@ SELECT
 
   if (empty($user_id))
   {
-    $page['errors'][] = l10n('Invalid key');
+    $page['errors']['password_page_error'] = l10n('Invalid key');
     return false;
   }
   
@@ -160,13 +160,13 @@ function reset_password()
 
   if ($_POST['use_new_pwd'] != $_POST['passwordConf'])
   {
-    $page['errors'][] = l10n('The passwords do not match');
+    $page['errors']['password_form_error'] = l10n('The passwords do not match');
     return false;
   }
 
   if (!isset($_GET['key']))
   {
-    $page['errors'][] = l10n('Invalid key');
+    $page['errors']['password_page_error'] = l10n('Invalid key');
   }
   
   $user_id = check_password_reset_key($_GET['key']);
@@ -202,7 +202,7 @@ if (isset($_POST['submit']))
   {
     if (process_password_request())
     {
-      $page['action'] = 'none';
+      $page['action'] = 'lost_end';
     }
   }
 
@@ -210,7 +210,7 @@ if (isset($_POST['submit']))
   {
     if (reset_password())
     {
-      $page['action'] = 'none';
+      $page['action'] = 'reset_end';
     }
   }
 }
@@ -272,7 +272,6 @@ if ('lost' == $page['action'] and !is_a_guest())
 // +-----------------------------------------------------------------------+
 // | template initialization                                               |
 // +-----------------------------------------------------------------------+
-
 $title = l10n('Password Reset');
 if ('lost' == $page['action'])
 {
@@ -291,7 +290,7 @@ else if ('reset' == $page['action'] and isset($first_login) and $first_login)
 
 $page['body_id'] = 'thePasswordPage';
 
-$template->set_filenames(array('password'=>'password.tpl'));
+$template->set_filenames( array('password'=>'password.tpl') );
 $template->assign(
   array(
     'title' => $title,
@@ -302,7 +301,6 @@ $template->assign(
     )
   );
 
-
 // include menubar
 $themeconf = $template->get_template_vars('themeconf');
 if (!isset($themeconf['hide_menu_on']) OR !in_array('thePasswordPage', $themeconf['hide_menu_on']))
@@ -310,6 +308,42 @@ if (!isset($themeconf['hide_menu_on']) OR !in_array('thePasswordPage', $themecon
   include( PHPWG_ROOT_PATH.'include/menubar.inc.php');
 }
 
+//Load language if cookie is set from login/register/password pages
+if (isset($_COOKIE['lang']) and $user['language'] != $_COOKIE['lang'])
+{
+  if (!array_key_exists($_COOKIE['lang'], get_languages()))
+  {
+    fatal_error('[Hacking attempt] the input parameter "'.$_COOKIE['lang'].'" is not valid');
+  }
+  
+  $user['language'] = $_COOKIE['lang'];
+  load_language('common.lang', '', array('language'=>$user['language']));
+}
+
+//Get list of languages
+foreach (get_languages() as $language_code => $language_name)
+{
+  $language_options[$language_code] = $language_name;
+}
+
+$template->assign(array(
+  'language_options' => $language_options,
+  'current_language' => $user['language']
+));
+
+//Get link to doc
+if ('fr' == substr($user['language'], 0, 2))
+{
+  $help_link = "https://doc-fr.piwigo.org/les-utilisateurs/se-connecter-a-piwigo";
+}
+else
+{
+  $help_link = "https://doc.piwigo.org/managing-users/log-in-to-piwigo";
+}
+
+$template->assign('HELP_LINK', $help_link);
+
+
 // +-----------------------------------------------------------------------+
 // |                           html code display                           |
 // +-----------------------------------------------------------------------+

register.php

@@ -29,20 +29,20 @@ if (isset($_POST['submit']))
   if (!verify_ephemeral_key(@$_POST['key']))
   {
 		set_status_header(403);
-    $page['errors'][] = l10n('Invalid/expired form key');
+    $page['errors']['register_page_error'][] = l10n('Invalid/expired form key');
   }
 
   if(empty($_POST['password']))
   {
-    $page['errors'][] = l10n('Password is missing. Please enter the password.');
+    $page['errors']['register_form_error'] = l10n('Password is missing. Please enter the password.');
   }
   else if(empty($_POST['password_conf']))
   {
-    $page['errors'][] = l10n('Password confirmation is missing. Please confirm the chosen password.');
+    $page['errors']['register_form_error'] = l10n('Password confirmation is missing. Please confirm the chosen password.');
   }
   else if ($_POST['password'] != $_POST['password_conf'])
   {
-    $page['errors'][] = l10n('The passwords do not match');
+    $page['errors']['register_form_error'] = l10n('The passwords do not match');
   }
 
   register_user(
@@ -92,7 +92,7 @@ $template->assign(array(
   'F_LOGIN' => $login,
   'F_EMAIL' => $email,
   'obligatory_user_mail_address' => $conf['obligatory_user_mail_address'],
-  ));
+));
 
 // include menubar
 $themeconf = $template->get_template_vars('themeconf');
@@ -101,6 +101,41 @@ if (!isset($themeconf['hide_menu_on']) OR !in_array('theRegisterPage', $themecon
   include( PHPWG_ROOT_PATH.'include/menubar.inc.php');
 }
 
+//Load language if cookie is set from login/register/password pages
+if (isset($_COOKIE['lang']) and $user['language'] != $_COOKIE['lang'])
+{
+  if (!array_key_exists($_COOKIE['lang'], get_languages()))
+  {
+    fatal_error('[Hacking attempt] the input parameter "'.$_COOKIE['lang'].'" is not valid');
+  }
+  
+  $user['language'] = $_COOKIE['lang'];
+  load_language('common.lang', '', array('language'=>$user['language']));
+}
+
+//Get list of languages
+foreach (get_languages() as $language_code => $language_name)
+{
+  $language_options[$language_code] = $language_name;
+}
+
+$template->assign(array(
+  'language_options' => $language_options,
+  'current_language' => $user['language'],
+));
+
+//Get link to doc
+if ('fr' == substr($user['language'], 0, 2))
+{
+  $help_link = "https://doc-fr.piwigo.org/les-utilisateurs/se-connecter-a-piwigo";
+}
+else
+{
+  $help_link = "https://doc.piwigo.org/managing-users/log-in-to-piwigo";
+}
+
+$template->assign('HELP_LINK', $help_link);
+
 include(PHPWG_ROOT_PATH.'include/page_header.php');
 trigger_notify('loc_end_register');
 flush_page_messages();

themes/standard_pages/css/identification_register.css

@@ -0,0 +1,480 @@
+html{
+  min-height:100%;
+}
+
+#theHeader,
+#copyright{
+  display:none;
+}
+
+#theIdentificationPage,
+#theRegisterPage,
+#thePasswordPage{
+  width:100%;
+  height:100%;
+  min-height:100vh;
+  margin:0;
+  font-family:Arial, Helvetica, sans-serif;
+}
+
+#theIdentificationPage #the_page,
+#theRegisterPage #the_page,
+#thePasswordPage #the_page{
+  min-height:100vh;
+  height:100%;
+}
+
+#mode{
+  display:flex;
+  flex-direction:column;
+  height:100%;
+  min-height:100vh;
+  overflow-y:auto;
+}
+
+#login-form,
+#register-form,
+#password-form{
+  border-radius:15px;
+  width:400px;
+  margin:0 auto;
+  margin-top:50px;
+  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.15);
+  padding:50px;
+}
+
+#logo-section{
+  max-width:300px;
+  margin:0 auto;
+  padding-top:50px;
+}
+
+#logo-section img{
+  width:100%;
+}
+
+h1{
+  font-size: 30px;
+  font-weight: 400;
+  margin:0;
+  margin-bottom:30px;
+  text-align:center;
+}
+
+h1 i{
+  margin:10px;
+}
+
+#login-form form,
+#register-form form,
+#password-form form{
+  display:flex;
+  justify-content:center;
+  flex-direction:column;
+}
+
+#password-form p{
+  text-align:center;
+  font-size:15px;
+  font-weight:500;
+  margin:0;
+}
+
+#password-form .error-message{
+  bottom:0;
+}
+
+.input-container{
+  border-radius:3px;
+  padding:5px 15px;
+  margin-bottom:25px;
+  flex-wrap:nowrap;
+}
+
+.input-container input{
+  background-color:transparent;
+  border:none;
+  width:100%;
+  line-height:25px;
+} 
+
+.input-container input:focus{
+  border:none;
+  outline:none;
+}
+
+.input-container:focus-within{
+  border:1px solid #ff7700!important;
+}
+
+.input-container i {
+  font-size:15px;
+  margin-right:5px;
+}
+
+.column-flex{
+  display:flex;
+  flex-direction:column;
+  position:relative;
+}
+
+.row-flex{
+  display:flex;
+  flex-direction:row;
+  align-items:center;
+}
+
+
+.remember-me-container {
+  display: flex;
+  align-items: center;
+  cursor: pointer;
+  font-family: sans-serif;
+  font-size: 16px;
+  margin-bottom:5px;
+}
+
+.gallery-icon-checkmark {
+  width: 18px;
+  height: 18px;
+  border: 1px solid #777;
+  border-radius: 2px;
+  display: inline-block;
+  margin-right: 8px;
+  line-height: 18px;
+  font-size: 14px;
+}
+
+.remember-me-container:hover label{
+  cursor:pointer;
+}
+
+.gallery-icon-checkmark::before {
+  opacity: 0;
+}
+
+input[type="checkbox"]#remember_me {
+  display: none;
+}
+
+input[type="checkbox"]#remember_me:checked + label ~ .gallery-icon-checkmark::before,
+input[type="checkbox"]#remember_me:checked + .gallery-icon-checkmark::before {
+  opacity: 1;
+  font-size: 12px;
+  margin: 2px;
+  vertical-align: text-top;
+}
+
+label{
+margin-bottom:5px;
+font-size:15px;
+}
+
+p.form-instructions{
+  padding-bottom:25px;
+}
+ 
+.btn-main{
+  background-color:#ff7700!important;
+  color:white!important;
+  border:none;
+  padding:15px;
+  margin-top:15px;
+  cursor:pointer;
+  text-decoration:none!important;
+}
+
+a.btn-main{
+  display:block;
+  text-align:center;
+}
+
+#return-to-gallery{
+  margin: 30px auto;
+  display:block;
+  width:fit-content;
+}
+
+.secondary-links{
+  margin-top:40px;
+  text-align:center;
+}
+
+#theIdentificationPage a,
+#theRegisterPage a,
+#thePasswordPage a{
+  text-decoration:underline;
+}
+
+#theIdentificationPage a:hover,
+#theRegisterPage a:hover,
+#thePasswordPage a:hover{
+  border-bottom:none;
+}
+
+#separator{
+  width:300px;
+  border-bottom:1px solid #D8D8D8;
+  display:block;
+  margin: 15px auto;
+}
+
+#header-options{
+  position:fixed;
+  width:100%;
+  display:flex;
+  justify-content: space-between;
+  font-size:15px;
+}
+
+#header-options > *{
+  padding:15px;
+}
+
+#theIdentificationPage #header-options .toggle-mode{
+  cursor:pointer;
+}
+
+.gallery-icon-sun{
+  display:none;
+}
+
+.gallery-icon-eye{
+  cursor:pointer;
+}
+
+#language-switch{
+  display:flex;
+  justify-content: flex-end;
+  font-size:15px;
+  position: fixed;
+  right: 0;
+  bottom: 0;
+}
+
+#lang-select{
+  width:fit-content;
+  position:relative;
+}
+
+#selected-language-container{
+  padding:15px;
+}
+
+#lang-select #other-languages{
+  display:none;
+  border-radius: 5px;
+  padding: 15px;
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
+  margin-right:11px;
+  width:max-content;
+  position:absolute;
+  bottom:40px;
+  right:0;
+}
+
+#lang-select #other-languages span{
+  text-decoration:none;
+  display:block;
+  padding:5px 0;
+}
+
+#lang-select #other-languages span:hover{
+  color:#ff7700; 
+  cursor:pointer;
+}
+
+#lang-select:hover #other-languages{
+  display:block;
+}
+
+#lang-select .gallery-icon-left-chevron:before{
+  rotate: 90deg;
+}
+
+#selected-language{
+  margin-left:5px;
+  text-decoration:underline;
+}
+
+.success-message{
+  width: calc(100% - 34px);
+  display: block;
+  padding: 15px;
+  margin-bottom:15px;
+}
+
+.error-message{
+  text-align: left;
+  position: absolute;
+  bottom: 10px;
+  left:0;
+  margin: 0;
+  display:none;
+}
+
+.error-message i,
+p.error-message{
+  color: #EB3223!important;
+}
+
+.error_block_container {
+  position: absolute;
+  right: 15px;
+  max-width: 300px;
+  top:40px;
+}
+
+.error_block {
+  display:flex;
+  background-color:#BE4949;
+  border-radius:5px;
+  color:#FFC8C8;
+  padding:15px;
+  position:relative;
+  align-items:center;
+}
+
+.error_block p{
+  margin:0;
+}
+
+.error_block .gallery-icon-cancel:before{
+  font-size:33px;
+  margin-left:0;
+  margin-right:15px;
+}
+
+#password-form p.intro-paragraph{
+  margin-bottom:15px;
+}
+
+
+/* Light */
+#theIdentificationPage .light,
+#theRegisterPage .light,
+#thePasswordPage .light{
+  background: linear-gradient(75.69deg, #FFEACF 7.64%, #FFFAF3 77.87%);
+}
+
+.light #login-form,
+.light #register-form,
+.light #password-form,
+.light #lang-select #other-languages {
+  background-color:#ffffff;
+}
+
+#theIdentificationPage .light a,
+#theRegisterPage .light a,
+#thePasswordPage .light a,
+.light h1,
+.light .input-container input,
+.light .secondary-links,
+.light .properties label,
+.light .properties i,
+.light #password-form p,
+.light #lang-select #other-languages span{
+  color:#3C3C3C;
+}
+
+#theIdentificationPage .light a:hover,
+#theRegisterPage .light a:hover,
+#thePasswordPage .light a:hover{
+  color:#ff7700;
+}
+
+.light #header-options a,
+.light #header-options .toggle-mode,
+.light #selected-language-container{
+  color:#ff7700;
+}
+
+.light .input-container{
+  background-color:#F0F0F0;
+  border:1px solid #F0F0F0;
+}
+
+.light #separator{
+  border-bottom:1px solid #D8D8D8;
+}
+
+.light .gallery-icon-eye{
+  color:#898989;
+}
+
+.light .success-message{
+  background-color: #DBF6D7;
+  color: #6DCE5E;
+  border-left: 4px solid #6DCE5E;
+}
+
+/* Dark */
+#theIdentificationPage .dark,
+#theRegisterPage .dark,
+#thePasswordPage .dark{
+  background: linear-gradient(75.69deg, #1B1B1D 7.64%, #2F2F2F 77.87%);
+}
+
+.dark #login-form,
+.dark #register-form,
+.dark #password-form{
+  background-color:#3C3C3C;
+}
+
+#theIdentificationPage .dark a,
+#theRegisterPage .dark a,
+#thePasswordPage .dark a,
+.dark h1,
+.dark .input-container input,
+.dark .secondary-links,
+.dark .properties label,
+.dark .properties i,
+.dark #password-form p,
+.dark #lang-select #other-languages span{
+  color:#D6D6D6;
+}
+
+#theIdentificationPage .dark a:hover,
+#theRegisterPage .dark a:hover,
+#thePasswordPage .dark a:hover,
+.dark #lang-select #other-languages span{
+  color:#ff7700;
+}
+
+.dark #header-options a,
+.dark #header-options .toggle-mode,
+.dark #selected-language-container{
+  color:#FFEBD0;
+}
+
+.dark .input-container{
+  background-color:#303030;
+  border:1px solid #303030;
+}
+
+.dark #separator{
+  border-bottom:1px solid #303030;
+}
+
+.dark .gallery-icon-eye{
+  color:#898989;
+}
+
+.dark #lang-select #other-languages {
+  background-color: #3C3C3C;
+}
+
+.dark .success-message{
+  background-color: #4EA590;
+  color: #AAF6E4;
+  border-left: 4px solid #AAF6E4;
+}
+
+/*Responsive display*/
+@media (max-width: 768px) {
+  #login-form,
+  #register-form,
+  #password-form{
+    max-width:300px;
+  }
+}

themes/standard_pages/images/piwigo_logo.svg

@@ -0,0 +1,26 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 767.6 191">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #3c3c3c;
+      }
+
+      .cls-2 {
+        fill: #f70;
+      }
+
+      .cls-3 {
+        fill: #fff;
+      }
+    </style>
+  </defs>
+  <g id="Symbole_23_1" data-name="Symbole 23 – 1" transform="translate(-577 -446.516)">
+    <path id="Tracé_3456" data-name="Tracé 3456" class="cls-1" d="M48.953-42.57c1.466-.943,4.51-.83,4.51-.83H64.8a75.758,75.758,0,0,0,28.1-5.1A46.707,46.707,0,0,0,113.6-64q7.8-10.4,7.8-25.6,0-15.4-7.3-25.8a43.832,43.832,0,0,0-19.7-15.5A72.474,72.474,0,0,0,66.6-136H26.286s-4.763-.041-7.4,1.925-2.483,5.564-2.483,5.564V-3.588a3.986,3.986,0,0,0,.77,2.735,4.788,4.788,0,0,0,2.9.853H43.957a4.221,4.221,0,0,0,2.869-.853c.911-.972.774-3.035.774-3.035V-39.627A3.519,3.519,0,0,1,48.953-42.57ZM65.6-110.8q11,0,17.1,5.6t6.1,16.4q-.2,9.4-6.5,14.9T66-68.4H50.653a3.693,3.693,0,0,1-2.331-.742,3.813,3.813,0,0,1-.722-2.364v-37.132a2.062,2.062,0,0,1,.722-1.716,5.2,5.2,0,0,1,2.5-.446Z" transform="translate(735 592.516)"/>
+    <path id="Tracé_3455" data-name="Tracé 3455" class="cls-1" d="M152-110.4a16.763,16.763,0,0,0,12.3-5.1,16.533,16.533,0,0,0,5.1-12.1,16.763,16.763,0,0,0-5.1-12.3A16.763,16.763,0,0,0,152-145a16.533,16.533,0,0,0-12.1,5.1,16.763,16.763,0,0,0-5.1,12.3,16.533,16.533,0,0,0,5.1,12.1A16.533,16.533,0,0,0,152-110.4ZM166.744-1.253A5.163,5.163,0,0,0,167.8-4.6v-84.4s.2-3.8-1.622-5.8S160.525-97,160.525-97H146.1s-4.891.167-7.317,2.8-2.387,7.732-2.387,7.732V-6.591s-.182,3.621,1.4,5.269S142.746,0,142.746,0h20.475A6.231,6.231,0,0,0,166.744-1.253Zm130.162-.5c2.2-1.778,3.011-5.364,3.011-5.364L327.88-92.949s.738-1.925,0-2.938S324.926-97,324.926-97H302.113a8.712,8.712,0,0,0-3.818,1.113,5.151,5.151,0,0,0-1.792,2.841L285.676-45.3a1.478,1.478,0,0,1-1.531,1.429,1.478,1.478,0,0,1-1.531-1.429L270.8-92.243a6.42,6.42,0,0,0-1.879-3.643,7.68,7.68,0,0,0-4.2-1.113H242.978a8.845,8.845,0,0,0-4.06,1.113,5.149,5.149,0,0,0-1.784,3.05l-9.2,44.235s-.213,1.2-2.768,2.041-3.5-2.041-3.5-2.041l-9.779-43.51s-.312-4.106-2.534-5.735-6.353-.78-6.353-.78L188.87-94.519s-4.51,1.1-6.014,3.812,0,7.019,0,7.019L207.17-7.6s.641,3.954,3.141,5.855S217.169,0,217.169,0h13.64s3.62-.012,5.709-1.749,2.647-5.2,2.647-5.2L250.631-47.5a2.736,2.736,0,0,1,2.768-2.381,2.847,2.847,0,0,1,2.844,2.381L267.781-7.66s.468,4,3.092,5.911S278.279,0,278.279,0H291.1S294.7.029,296.906-1.749ZM357.2-110.4a16.762,16.762,0,0,0,12.3-5.1,16.533,16.533,0,0,0,5.1-12.1,16.763,16.763,0,0,0-5.1-12.3,16.763,16.763,0,0,0-12.3-5.1,16.533,16.533,0,0,0-12.1,5.1,16.763,16.763,0,0,0-5.1,12.3,16.533,16.533,0,0,0,5.1,12.1A16.533,16.533,0,0,0,357.2-110.4ZM371.326-1.749C373.259-3.477,373-6.91,373-6.91V-90.436s-.11-3.058-1.541-4.7A7.042,7.042,0,0,0,367.277-97H348.615s-3.556.212-5.31,1.978-1.7,5.084-1.7,5.084V-8.3s-.307,4.473,1.314,6.546S348.085,0,348.085,0h17.184S369.393-.021,371.326-1.749ZM485.84-95.233c.863,1.373.863,6.905.863,6.905L486.4,3.8a38.992,38.992,0,0,1-6.5,22.4,41.1,41.1,0,0,1-18.4,14.7Q449.6,46,434,46q-8,0-21.2-3a74.246,74.246,0,0,1-16.5-5.607,5.014,5.014,0,0,1-2.827-3.655,7.006,7.006,0,0,1,.628-4.314l4.138-9.684a6.978,6.978,0,0,1,3.656-3.64c2.566-.928,4.017-1.092,6.61-.073A64.9,64.9,0,0,0,432.2,20.8q10.2,0,16.5-4.7A14.831,14.831,0,0,0,455,3.6s.809-5.015-3.641-5.365S444.809,2.115,437.2,2.2q-22.6,0-36-13.2T387.8-48.4q0-24.2,13.6-37.9t37-13.7a38.162,38.162,0,0,1,13.8,2.7c4.667,1.8,8.45,7.575,13,7.7s-.373-7.168,5.2-7.2c3.383-.019,7.234-.007,11.084,0C483.469-96.8,484.977-96.606,485.84-95.233ZM440.6-22.8c4.4,0,8-.854,11.6-5.134S455-39.917,455-39.917v-16.46s1-8.867-2.8-13.473-7.067-4.95-12.4-4.95a16.918,16.918,0,0,0-14.2,7.2q-5.4,7.2-5.4,19,0,12,5.4,18.9T440.6-22.8Zm169-25.6q0,15.6-6.9,27A45.743,45.743,0,0,1,583.6-3.9q-12.2,6.1-27.8,6.1Q540,2.2,528-3.7a43.275,43.275,0,0,1-18.7-17.4q-6.7-11.5-6.7-27.7,0-15.6,6.9-27.2a46.151,46.151,0,0,1,19-17.8q12.1-6.2,27.7-6.2,15.8,0,27.9,6.1a44.223,44.223,0,0,1,18.8,17.7Q609.6-64.6,609.6-48.4ZM556-23.6q9.6,0,15.4-6.8t5.8-18q0-11.2-5.7-18.4A18.3,18.3,0,0,0,556.4-74q-9.8,0-15.6,6.9T535-48.8q0,11.4,5.7,18.3T556-23.6Z" transform="translate(735 591.516)"/>
+    <path id="Tracé_3467" data-name="Tracé 3467" class="cls-2" d="M36.12,0h64.088a36.12,36.12,0,0,1,36.12,36.12v84.911L131.486,131.4l-10.5,4.93H36.12A36.12,36.12,0,0,1,0,100.208V36.12A36.12,36.12,0,0,1,36.12,0Z" transform="translate(577 592.285) rotate(-90)"/>
+    <path id="Tracé_3469" data-name="Tracé 3469" class="cls-2" d="M24.641,0C38.167,0,49.59,10.892,49.59,24.418S38.167,48.983,24.641,48.983-36.4,9.469-35.316,9.463s-27.4-.076,9.176,0S8.9.355,24.641,0Z" transform="translate(663.719 446.516)"/>
+    <circle id="Ellipse_69" data-name="Ellipse 69" class="cls-3" cx="8.557" cy="8.557" r="8.557" transform="translate(680.344 461.978)"/>
+    <circle id="Ellipse_67" data-name="Ellipse 67" class="cls-3" cx="40.426" cy="40.426" r="40.426" transform="translate(604.738 483.695)"/>
+    <circle id="Ellipse_68" data-name="Ellipse 68" class="cls-1" cx="28.623" cy="28.623" r="28.623" transform="translate(616.541 495.499)"/>
+  </g>
+</svg>

themes/standard_pages/js/identification_register.js

@@ -0,0 +1,115 @@
+let modeCookie = getCookie("mode"); 
+if("" != modeCookie)
+{
+  toggle_mode(modeCookie);
+}
+
+jQuery( document ).ready(function() {
+  jQuery("#selected-language").textContent = selected_language;
+
+  //Override empty input message
+    jQuery("form").on("submit", function (e) {
+      let isValid = true;
+  
+      jQuery(".column-flex").each(function () {
+        let input = jQuery(this).find("input");
+        let errorMessage = jQuery(this).find(".error-message");
+        if (!input.val().trim()) {
+          
+          e.preventDefault(); 
+          input[0].setCustomValidity(""); // Override browser tooltip (empty space hides it)
+          errorMessage.show(); 
+          isValid = false;
+        } else {
+          input[0].setCustomValidity("");
+          errorMessage.hide();
+        }
+      });
+  
+      return isValid;
+    });
+  
+    // Hide error message and reset validation on input
+    jQuery(".column-flex input").on("input", function () {
+      let errorMessage = jQuery(this).closest(".column-flex").find(".error-message");
+      jQuery(this)[0].setCustomValidity(""); // Reset browser tooltip
+      errorMessage.hide();
+    });
+  
+
+  // Hide error message when user starts typing
+  jQuery(".column-flex input").on("input", function () {
+    jQuery(this).closest(".column-flex").find(".error-message").hide();
+  });
+
+});
+
+function toggle_mode(mode) {
+  setCookie("mode",mode,30);
+  if ("dark" == mode)
+  {
+    //Dark mode
+    jQuery( "#toggle_mode_light" ).hide(); 
+    jQuery( "#toggle_mode_dark" ).show(); 
+    jQuery( "#mode" ).addClass("dark");
+    jQuery( "#mode" ).removeClass("light"); 
+    jQuery( "#piwigo-logo" ).attr("src", url_logo_dark);
+  }
+  else
+  {
+    //Light mode
+    jQuery( "#toggle_mode_dark" ).hide();
+    jQuery( "#toggle_mode_light" ).show();
+    jQuery( "#mode" ).addClass("light");
+    jQuery( "#mode" ).removeClass("dark"); 
+    jQuery( "#piwigo-logo" ).attr("src", url_logo_light);
+  }
+}
+
+function setCookie(cname, cvalue, exdays) {
+  const d = new Date();
+  d.setTime(d.getTime() + (exdays*24*60*60*1000));
+  let expires = "expires="+ d.toUTCString();
+  document.cookie = cname + "=" + cvalue + ";" + expires + ";path=/";
+  if (cname == "lang")
+  {
+    location.reload();
+  }
+}
+
+function getCookie(cname) {
+  let name = cname + "=";
+  let decodedCookie = decodeURIComponent(document.cookie);
+  let ca = decodedCookie.split(';');
+  for(let i = 0; i <ca.length; i++) {
+    let c = ca[i];
+    while (c.charAt(0) == ' ') {
+      c = c.substring(1);
+    }
+    if (c.indexOf(name) == 0) {
+      return c.substring(name.length, c.length);
+    }
+  }
+  return "";
+}
+
+jQuery(".togglePassword").click(function(e){
+  var toggle = jQuery(e.target);
+  var input = (jQuery(toggle).siblings('input'))[0];
+  if (input.type === "password") {
+    input.type = "text";
+    jQuery(toggle).css("color", "#ff7700");
+  } else {
+    input.type = "password";
+    jQuery(toggle).css("color","#898989");
+  }
+});
+
+jQuery("#other-languages a").click(function(e){
+  let clickedUrl = new URL(jQuery(e.target).attr('href'));
+  let selectedLang = clickedUrl.searchParams.get("lang");
+
+  if (selectedLang) {
+    setCookie('lang',selectedLang,1);
+  }
+});

themes/standard_pages/template/footer.tpl

@@ -0,0 +1,6 @@
+<!-- BEGIN get_combined -->
+{get_combined_scripts load='footer'}
+<!-- END get_combined -->
+
+</body>
+</html>

themes/standard_pages/template/identification.tpl

@@ -0,0 +1,114 @@
+{combine_css id='identification_register' path="themes/standard_pages/css/identification_register.css" order=100}
+{combine_css path="themes/default/vendor/fontello/css/gallery-icon.css" order=-10}
+
+<script>
+  var selected_language = `{$language_options[$current_language]}`;
+  var url_logo_light = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg`;
+  var url_logo_dark = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo_dark.svg`;
+</script>
+{combine_script id='identification_register' load='async' require='jquery' path='themes/standard_pages/js/identification_register.js'}
+
+<container id="mode" class="light">
+
+  <section id="header-options">
+    <div>
+      <i class="gallery-icon-moon toggle-mode" id="toggle_mode_light" onclick="toggle_mode('dark')"></i>
+      <i class="gallery-icon-sun toggle-mode" id="toggle_mode_dark" onclick="toggle_mode('light')"></i>
+    </div>
+    <div>
+      <a href="{$HELP_LINK}" target="_blank">{'Help'|translate}</a>
+{if isset($errors['login_page_error'])}
+      <div class="error_block_container">
+  {foreach from=$errors['login_page_error'] item=error}
+        <div class="error_block"> 
+          <i class="gallery-icon-cancel"></i>
+          <p>{$error}</p>
+        </div>
+  {/foreach}
+      </div>
+{/if}
+    </div>
+  </section>
+
+  <section id="logo-section">
+    <img id="piwigo-logo" src="{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg">
+  </section>
+
+  <section id="login-form">
+    <div class="">
+      <h1 class="">
+        {'Login'|translate}
+      </h1>
+        
+      <form class="properties" action="{$F_LOGIN_ACTION}" method="post" name="login_form">
+
+        <div class="column-flex">
+          <label for="username">{'Username'|translate}</label>
+          <div class="row-flex input-container">
+            <i class="gallery-icon-user-2"></i>
+            <input type="text" class="" type="text" name="username" id="username" size="25" autofocus>
+          </div>
+          <p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
+        </div>
+
+        <div class="column-flex">
+          <label for="password">{'Password'|translate}</label>
+          <div class="row-flex input-container">
+            <i class="gallery-icon-lock"></i>
+            <input type="password" class="" name="password" id="password" size="25">
+            <i class="gallery-icon-eye togglePassword"></i>
+          </div>
+          <p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
+        </div>
+
+{if $authorize_remembering }
+        <div class="column-flex">
+          <div class="row-flex remember-me-container">
+          <label for="remember_me">
+            <input tabindex="3" type="checkbox" name="remember_me" id="remember_me" value="1">
+            <span class="gallery-icon-checkmark"></span>
+            {'Auto login'|@translate}</label>
+          </div>
+        </div>
+{/if}
+            
+        <div class="column-flex">
+          <input tabindex="4" type="submit" name="login" value="{'Login'|translate}" class="btn btn-main ">
+{if isset($errors['login_form_error'])}
+          <p class="error-message" style="display:block;bottom:-20px;"><i class="gallery-icon-attention-circled"></i> {$errors['login_form_error']}</p>
+{/if}
+        </div>
+      </form>
+
+      <div class="secondary-links">
+        
+{if isset($U_REGISTER)}
+        <p>{'Don\'t have an account yet ?'|translate} <a href="register.php" title="{'Register'|translate}">{'Create an account'|translate}</a></p>
+        <span id="separator"></span>
+{/if}
+        <a href="password.php" title="{'Forgot your password?'|translate}">{'Forgot your password?'|translate}</a>
+
+      </div>
+            
+    </div>
+  </section>
+
+  <a href="index.php" id="return-to-gallery"><i class="gallery-icon-left"></i> {'Return to the gallery'|translate}</a>
+
+{if count($language_options) > 1}
+  <section id="language-switch">
+    <div id="lang-select">
+      <span id="other-languages">
+  {foreach from=$language_options key=$code item=$lang}
+          <span id="lang={$code}" onclick="setCookie('lang','{$code}',30)">{$lang}</span>
+  {/foreach}
+      </span>
+      <div id="selected-language-container">
+        <i class="gallery-icon-left-chevron"></i><span id="selected-language">{$language_options[$current_language]}</span>
+      </div>
+
+    </div>
+  </section>
+{/if}
+
+</container>

themes/standard_pages/template/password.tpl

@@ -0,0 +1,155 @@
+{combine_css id='identification_register' path="themes/standard_pages/css/identification_register.css" order=100}
+{combine_css path="themes/default/vendor/fontello/css/gallery-icon.css" order=-10}
+
+<script>
+  var selected_language = `{$language_options[$current_language]}`;
+  var url_logo_light = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg`;
+  var url_logo_dark = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo_dark.svg`;
+</script>
+{combine_script id='identification_register' load='async' require='jquery' path='themes/standard_pages/js/identification_register.js'}
+
+<container id="mode" class="light">
+
+  <section id="header-options">
+    <div>
+      <i class="gallery-icon-moon toggle-mode" id="toggle_mode_light" onclick="toggle_mode('dark')"></i>
+      <i class="gallery-icon-sun toggle-mode" id="toggle_mode_dark" onclick="toggle_mode('light')"></i>
+    </div>
+    <div>
+      <a href="{$HELP_LINK}" target="_blank">{'Help'|translate}</a>
+{if isset($errors['password_page_error'])}
+      <div class="error_block_container">
+  {foreach from=$errors['password_page_error'] item=error}
+        <div class="error_block"> 
+          <i class="gallery-icon-cancel"></i>
+          <p>{$error}</p>
+        </div>
+  {/foreach}
+      </div>
+{/if}
+  </section>
+
+  <section id="logo-section">
+    <img id="piwigo-logo" src="{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg">
+  </section>
+
+
+  <section id="password-form">
+    <div class="">
+
+{if $action eq 'lost' or $action eq 'reset'}
+<h1 class="">{if !isset($is_first_login)}{'Forgot your password?'|translate}{else}{'Welcome !'|translate}<br>{'It\'s your first login !'|translate}{/if}</h1>
+    <form id="lostPassword" class="properties" action="{$form_action}?action={$action}{if isset($key)}&amp;key={$key}{/if}" method="post">
+
+      <input type="hidden" name="pwg_token" value="{$PWG_TOKEN}">
+  {if $action eq 'lost'}
+
+      <p class="form-instructions">{'Please enter your username or email address.'|@translate}<br>{'You will receive a link to create a new password via email.'|@translate}</p>
+
+      <div class="column-flex">
+        <label for="username">{'Username or email'|@translate}</label>
+        <div class="row-flex input-container">
+          <i class="gallery-icon-user-2"></i>
+          <input type="text" id="username_or_email" name="username_or_email" size="100" maxlength="100"{if isset($username_or_email)} value="{$username_or_email}"{/if} autofocus>
+        </div>
+        <p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
+      </div>
+
+      <div class="column-flex">
+        <input tabindex="4" type="submit" name="submit" value="{'Change my password'|@translate}" class="btn btn-main ">
+    {if isset($errors['password_form_error'])}
+        <p class="error-message" style="display:block;bottom:-20px;"><i class="gallery-icon-attention-circled"></i> {$errors['password_form_error']}</p>
+    {/if}
+      </div>
+
+ {elseif $action eq 'reset'}
+    <p class="intro-paragraph">
+    {if !isset($is_first_login)}
+      {'Hello <em>%s</em>, enter your new password below.'|@translate:$username}
+    {else}
+      {'Let\'s set your password below.'|translate}
+    {/if}
+    </p>
+
+    {if isset($is_first_login)}
+    <div class="column-flex">
+      <label for="username">{'Username'|translate}</label>
+      <div class="row-flex input-container">
+        <i class="gallery-icon-user-2"></i>
+        <input type="text" class="" type="text" name="username" id="username" size="25" value={$username} disabled  >
+      </div>
+    </div>
+    {/if}
+      
+    <div class="column-flex">
+      <label for="password">{if isset($is_first_login)}{'Password'|translate}{else}{'New password'|translate}{/if}</label>
+      <div class="row-flex input-container">
+        <i class="gallery-icon-lock"></i>
+        <input type="password" class="" name="use_new_pwd" id="use_new_pwd" size="25" autofocus >
+        <i class="gallery-icon-eye togglePassword"></i>
+      </div>
+      <p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
+    </div>
+
+    <div class="column-flex">
+      <label for="passwordConf">{if isset($is_first_login)}{'Confirm Password'|translate}{else}{'Confirm new password'|translate}{/if}</label>
+      <div class="row-flex input-container">
+        <i class="gallery-icon-lock"></i>
+        <input type="password" name="passwordConf" id="passwordConf" >
+        <i class="gallery-icon-eye togglePassword"></i>
+      </div>
+      <p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
+    </div>
+
+    <div class="column-flex">
+      <input tabindex="4" type="submit" name="submit" {if !isset($is_first_login)}value="{'Confirm my new password'|@translate}"{else}value="{'Set my password'|@translate}"{/if} class="btn btn-main ">
+    </div>
+
+  {/if}
+      </form>
+
+      <div class="secondary-links">
+        <p>{'Return to <a href="identification.php" title="Sign in">Sign in</a>'|translate}</p>
+      </div>
+{else}
+    {if $action eq 'lost_end'}
+      <span class="success-message"><i class="gallery-icon-ok-circled"></i>{'An email has been sent with a link to reset your password'|translate}</span>
+      <p>{'Check your inbox.'|translate}</p>
+    {elseif $action eq 'reset_end'}
+      {if isset($is_first_login)}{assign var="string" value=""}{else}{assign var="string" value="reset"}{/if}
+      <span class="success-message"><i class="gallery-icon-ok-circled"></i>
+        {if isset($is_first_login)}
+          {'Your password was successfully set'|translate}
+        {else}
+          {'Your password was successfully reset'|translate}
+        {/if}
+      </span>
+      <a href="identification.php" title="{'Login'|translate}" class="btn-main">{'Login'|translate}</a>
+    {else}
+      <p>{'An error has occured please got back to <a href="identification.php" title="Sign in">Sign in</a> or <a href="register.php">Register</a>'|translate}</p>
+    {/if}
+{/if}
+            
+    </div>
+  </section>
+
+  <a href="index.php" id="return-to-gallery"><i class="gallery-icon-left-chevron"></i> {'Return to the gallery'|translate}</a>
+
+{if count($language_options) > 1}
+  <section id="language-switch">
+    <div id="lang-select">
+      <span id="other-languages">
+  {foreach from=$language_options key=$code item=$lang}
+          <span id="lang={$code}" onclick="setCookie('lang','{$code}',30)">{$lang}</span>
+  {/foreach}
+      </span>
+      <div id="selected-language-container">
+        <i class="gallery-icon-left-chevron"></i><span id="selected-language">{$language_options[$current_language]}</span>
+      </div>
+
+    </div>
+  </section>
+{/if}
+  
+
+</container>

themes/standard_pages/template/register.tpl

@@ -0,0 +1,117 @@
+{combine_css id='identification_register' path="themes/standard_pages/css/identification_register.css" order=100}
+{combine_css path="themes/default/vendor/fontello/css/gallery-icon.css" order=-10}
+
+<script>
+  var selected_language = `{$language_options[$current_language]}`;
+  var url_logo_light = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg`;
+  var url_logo_dark = `{$ROOT_URL}themes/standard_pages/images/piwigo_logo_dark.svg`;
+</script>
+{combine_script id='identification_register' load='async' require='jquery' path='themes/standard_pages/js/identification_register.js'}
+
+<container id="mode" class="light">
+
+  <section id="header-options">
+  <div>
+    <i class="gallery-icon-moon toggle-mode" id="toggle_mode_light" onclick="toggle_mode('dark')"></i>
+    <i class="gallery-icon-sun toggle-mode" id="toggle_mode_dark" onclick="toggle_mode('light')"></i>
+  </div>
+    <div>
+      <a href="{$HELP_LINK}" target="_blank">{'Help'|translate}</a>
+{if isset($errors['register_page_error'])}
+      <div class="error_block_container">
+  {foreach from=$errors['register_page_error'] item=error}
+        <div class="error_block"> 
+          <i class="gallery-icon-cancel"></i>
+          <p>{$error}</p>
+        </div>
+  {/foreach}
+      </div>
+{/if}
+  </section>
+
+  <section id="logo-section">
+    <img id="piwigo-logo" src="{$ROOT_URL}themes/standard_pages/images/piwigo_logo.svg">
+  </section>
+
+
+  <section id="register-form">
+    <div class="">
+      <h1 class="">
+        {'Create an account'|translate}
+      </h1>
+        
+      <form class="properties" method="post" action="{$F_ACTION}" name="register_form" autocomplete="off">
+
+        <div class="column-flex">
+          <label for="mail_address">{'Email address'|translate}</label>
+          <div class="row-flex input-container">
+            <i class="gallery-icon-user-2"></i>
+            <input type="email" name="mail_address" id="login" value="{$F_EMAIL}">
+          </div>
+          <p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
+        </div>
+
+        <div class="column-flex">
+          <label for="username">{'Username'|translate}</label>
+          <div class="row-flex input-container">
+            <i class="gallery-icon-user-2"></i>
+            <input type="text" name="login" id="login" value="{$F_LOGIN}">
+          </div>
+          <p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
+        </div>
+
+        <div class="column-flex">
+          <label for="password">{'Password'|translate}</label>
+          <div class="row-flex input-container">
+            <i class="gallery-icon-lock"></i>
+            <input type="password" class="" name="password" id="password" size="25">
+            <i class="gallery-icon-eye togglePassword"></i>
+          </div>
+          <p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
+        </div>
+
+        <div class="column-flex">
+          <label for="password">{'Confirm Password'|translate}</label>
+          <div class="row-flex input-container">
+            <i class="gallery-icon-lock"></i>
+            <input type="password" class="" name="password_conf" id="password_conf" size="25">
+            <i class="gallery-icon-eye togglePassword"></i>
+          </div>
+          <p class="error-message"><i class="gallery-icon-attention-circled"></i> {'must not be empty'|translate}</p>
+        </div>
+
+        <div class="column-flex">
+          <input type="hidden" name="key" value="{$F_KEY}" >
+          <input tabindex="4" type="submit" name="submit" value="{'Register'|translate}" class="btn btn-main ">
+{if isset($errors['register_form_error'])}
+            <p class="error-message" style="display:block;bottom:-20px;"><i class="gallery-icon-attention-circled"></i> {$errors['register_form_error']}</p>
+{/if}
+        </div>
+      </form>
+
+      <div class="secondary-links">
+        <p>{'Already have an account ?'|translate} <a href="identification.php" title="{'Login'|translate}">{'Login'|translate}</a></p>
+      </div>
+            
+    </div>
+  </section>
+
+  <a href="index.php" id="return-to-gallery"><i class="gallery-icon-left"></i> {'Return to the gallery'|translate}</a>
+
+{if count($language_options) > 1}
+  <section id="language-switch">
+    <div id="lang-select">
+      <span id="other-languages">
+  {foreach from=$language_options key=$code item=$lang}
+          <span id="lang={$code}" onclick="setCookie('lang','{$code}',30)">{$lang}</span>
+  {/foreach}
+      </span>
+      <div id="selected-language-container">
+        <i class="gallery-icon-left-chevron"></i><span id="selected-language">{$language_options[$current_language]}</span>
+      </div>
+
+    </div>
+  </section>
+{/if}
+  
+</container>

themes/standard_pages/themeconf.inc.php

@@ -0,0 +1,8 @@
+<?php
+$themeconf = array(
+  'name' => 'standard_pages',
+  'parent' => 'default',
+  'load_parent_css' => false,
+  'img_dir' => 'themes/standard_pages/images',
+);
+?>