Accessibility updates

asset-bundles.json

@@ -1,5 +1,20 @@
 {
     "bundle": {
+        "css/main": {
+            "styles" : [
+                "uf-tweaks/css/uf-tweaks.css"
+            ],
+            "options": {
+                "result": {
+                    "type": {
+                        "styles": "plain"
+                    }
+                },
+                "sprinkle": {
+                    "onCollision": "merge"
+                }
+            }
+        },
         "js/admin": {
             "scripts": [
                 "uf-tweaks/js/handlebars-helpers.js",

assets/uf-tweaks/css/uf-tweaks.css

@@ -0,0 +1,16 @@
+.form-group-label {
+  display: inline-block;
+  max-width: 100%;
+  margin-bottom: 5px;
+  font-weight: 700;
+}
+
+.login-box header {
+  display: block;
+  box-sizing: border-box;
+  line-height: 38.5px;
+}
+
+.login-box header h1 {
+  font-size: 26pt;
+}

composer.json

@@ -6,5 +6,8 @@
         "psr-4": {
             "UserFrosting\\Sprinkle\\UFTweaks\\": "src/"
         }
+    },
+    "require": {
+      "mobiledetect/mobiledetectlib": "^3.74"
     }
 }

config/default.php

@@ -61,4 +61,14 @@ return [
     'php' => [
         'timezone'        => 'Europe/London',
     ],
+
+    /*
+    * ----------------------------------------------------------------------
+    * Retry Mailer settings
+    * ----------------------------------------------------------------------
+    */
+    'retry_mailer' => [
+        'enabled' => true,
+        'max_retries' => 5,
+    ],
 ];

routes/routes.php

@@ -16,4 +16,6 @@ $app->group('/account', function () {
     $this->get('/register', 'UserFrosting\Sprinkle\UFTweaks\Controller\AccountController:pageRegister')
         ->add('checkEnvironment')
         ->setName('register');
+        
+    $this->post('/forgot-password', 'UserFrosting\Sprinkle\UFTweaks\Controller\AccountController:forgotPassword');
 })->add(new NoCache());

src/Controller/AccountController.php

@@ -9,6 +9,7 @@
 
 namespace UserFrosting\Sprinkle\UFTweaks\Controller;
 
+
 use Carbon\Carbon;
 use Illuminate\Database\Capsule\Manager as Capsule;
 use Psr\Http\Message\ResponseInterface as Response;
@@ -18,6 +19,9 @@ use UserFrosting\Fortress\RequestDataTransformer;
 use UserFrosting\Fortress\RequestSchema;
 use UserFrosting\Fortress\ServerSideValidator;
 use UserFrosting\Sprinkle\Account\Controller\AccountController as UFAccountController;
+use UserFrosting\Sprinkle\Account\Facades\Password;
+use UserFrosting\Sprinkle\Core\Mail\EmailRecipient;
+use UserFrosting\Sprinkle\Core\Mail\TwigMailMessage;
 use UserFrosting\Support\Exception\BadRequestException;
 use UserFrosting\Support\Exception\ForbiddenException;
 use UserFrosting\Support\Exception\NotFoundException;
@@ -29,6 +33,111 @@ use UserFrosting\Support\Exception\NotFoundException;
  */
 class AccountController extends UFAccountController
 {
+    /**
+     * Processes a request to email a forgotten password reset link to the user.
+     *
+     * Processes the request from the form on the "forgot password" page, checking that:
+     * 1. The rate limit for this type of request is being observed.
+     * 2. The provided email address belongs to a registered account;
+     * 3. The submitted data is valid.
+     * Note that we have removed the requirement that a password reset request not already be in progress.
+     * This is because we need to allow users to re-request a reset, even if they lose the first reset email.
+     * This route is "public access".
+     *
+     * @todo require additional user information
+     * @todo prevent password reset requests for root account?
+     *
+     * AuthGuard: false
+     * Route: /account/forgot-password
+     * Route Name: {none}
+     * Request type: POST
+     *
+     * @param Request  $request
+     * @param Response $response
+     * @param array    $args
+     */
+    public function forgotPassword(Request $request, Response $response, $args)
+    {
+        /** @var \UserFrosting\Sprinkle\Core\Alert\AlertStream $ms */
+        $ms = $this->ci->alerts;
+
+        /** @var \UserFrosting\Sprinkle\Core\Util\ClassMapper $classMapper */
+        $classMapper = $this->ci->classMapper;
+
+        /** @var \UserFrosting\Support\Repository\Repository $config */
+        $config = $this->ci->config;
+
+        // Get POST parameters
+        $params = $request->getParsedBody();
+
+        // Load the request schema
+        $schema = new RequestSchema('schema://requests/forgot-password.yaml');
+
+        // Whitelist and set parameter defaults
+        $transformer = new RequestDataTransformer($schema);
+        $data = $transformer->transform($params);
+
+        // Validate, and halt on validation errors.  Failed validation attempts do not count towards throttling limit.
+        $validator = new ServerSideValidator($schema, $this->ci->translator);
+        if (!$validator->validate($data)) {
+            $ms->addValidationErrors($validator);
+
+            return $response->withJson([], 400);
+        }
+
+        // Throttle requests
+        /** @var \UserFrosting\Sprinkle\Core\Throttle\Throttler $throttler */
+        $throttler = $this->ci->throttler;
+
+        $throttleData = [
+            'email' => $data['email'],
+        ];
+        $delay = $throttler->getDelay('password_reset_request', $throttleData);
+
+        if ($delay > 0) {
+            $ms->addMessageTranslated('danger', 'RATE_LIMIT_EXCEEDED', ['delay' => $delay]);
+
+            return $response->withJson([], 429);
+        }
+
+        // Load the user, by email address
+        $user = $classMapper->getClassMapping('user')::where('email', $data['email'])->first();
+
+        if ($user) {
+            if (!$user->flag_verified) {
+                $ms->addMessageTranslated('danger', 'ACCOUNT.UNVERIFIED');
+                return $response->withJson([], 400);
+            }
+        }
+
+        // All checks passed!  log events/activities, update user, and send email
+        // Begin transaction - DB will be rolled back if an exception occurs
+        Capsule::transaction(function () use ($classMapper, $data, $throttler, $throttleData, $config, $user) {
+            // Log throttleable event
+            $throttler->logEvent('password_reset_request', $throttleData);
+
+            // Check that the email exists.
+            // If there is no user with that email address, we should still pretend like we succeeded, to prevent account enumeration
+            if ($user) {
+                // Try to generate a new password reset request.
+                // Use timeout for "reset password"
+                $passwordReset = $this->ci->repoPasswordReset->create($user, $config['password_reset.timeouts.reset']);
+
+                // Create and send email
+                $message = new TwigMailMessage($this->ci->view, 'mail/password-reset.html.twig');
+                $message->from($config['address_book.admin'])
+                        ->addEmailRecipient(new EmailRecipient($user->email, $user->full_name))
+                        ->addParams([
+                            'user'         => $user,
+                            'token'        => $passwordReset->getToken(),
+                            'request_date' => Carbon::now()->format('Y-m-d H:i:s'),
+                        ]);
+
+                $this->ci->mailer->send($message);
+            }
+        });
+    }
+
     /**
      * Account settings page.
      *

src/Jobs/RetryEmail.php

@@ -0,0 +1,133 @@
+<?php
+
+/*
+ * AVSDev UF Tweaks (https://avsdev.uk)
+ *
+ * @link      https://git.avsdev.uk/avsdev/sprinkle-uf-tweaks
+ * @license   https://git.avsdev.uk/avsdev/sprinkle-uf-tweaks/blob/master/LICENSE.md (LGPL-3.0 License)
+ */
+
+namespace UserFrosting\Sprinkle\UFTweaks\Jobs;
+
+use Psr\Container\ContainerInterface;
+use UserFrosting\Sprinkle\Worker\Jobs\JobBase;
+use UserFrosting\Sprinkle\Core\Mail\StaticMailMessage;
+use UserFrosting\Sprinkle\Core\Mail\EmailRecipient;
+
+/**
+ * Retry email job class
+ *
+ * @author Craig Williams (https://avsdev.uk)
+ */
+class RetryEmail extends JobBase
+{
+    protected $message = null;
+
+    protected $retries = 0;
+
+
+    /**
+     * Constructor.
+     *
+     * @param StaticMailMessage $mailMessage
+     */
+    public function __construct(StaticMailMessage $mailMessage = null)
+    {
+        if ($mailMessage) {
+            $this->message = $mailMessage;
+        }
+    }
+
+
+    /**
+     * {@inheritdoc}
+     */
+    public function setParams(array $params)
+    {
+        $mailMessage = new StaticMailMessage();
+        $mailMessage->setFromEmail($params['from_email']);
+        $mailMessage->setFromName($params['from_name']);
+        $mailMessage->setReplyEmail($params['reply_email']);
+        $mailMessage->setReplyName($params['reply_name']);
+
+        foreach ($params['recipients'] as $recipient) {
+            $mailRecipient = new EmailRecipient(
+                $recipient['email'],
+                $recipient['name'],
+                $recipient['params']
+            );
+            foreach ($recipient['ccs'] as $cc) {
+                $mailRecipient->cc($cc['email'], $cc['name']);
+            }
+            foreach ($recipient['bccs'] as $bcc) {
+                $mailRecipient->bcc($bcc['email'], $bcc['name']);
+            }
+            $mailMessage->addEmailRecipient($mailRecipient);
+        }
+
+        $mailMessage->setSubject($params['subject']);
+        $mailMessage->setBody($params['body']);
+
+        $this->message = $mailMessage;
+        $this->retries = $params['retries'];
+    }
+
+    /**
+     * {@inheritdoc}
+     */
+    public function getParams()
+    {
+        $recipients = [];
+        foreach ($this->message->getRecipients() as $recipient) {
+            $recipients[] = [
+                'email' => $recipient->getEmail(),
+                'name' => $recipient->getName(),
+                'params' => $recipient->getParams(),
+                'ccs' => $recipient->getCCs(),
+                'bccs' => $recipient->getBCCs(),
+            ];
+        }
+
+        return [
+            'from_email' => $this->message->getFromEmail(),
+            'from_name' => $this->message->getFromName(),
+            'reply_email' => $this->message->getReplyEmail(),
+            'reply_name' => $this->message->getReplyName(),
+            'recipients' => $recipients,
+            'subject' => $this->message->renderSubject(),
+            'body' => $this->message->renderBody(),
+            'retries' => $this->retries,
+        ];
+    }
+
+    /**
+     * Attempt to re-send the email up to a maximum number of times specified in the config
+     */
+    public function run() {
+        try {
+            static::$ci->mailer->send($this->message, false, true);
+        } catch (\PHPMailer\PHPMailer\Exception $e) {
+            $this->retries = $this->retries + 1;
+            
+            if ($this->retries < static::$ci->config['retry_mailer.max_retries']) {
+                $this->queue();
+            } else {
+                $allParams = $this->getParams();
+                $allParams['body'] = null;
+                static::$ci->errorLogger->error(
+                    "Maximum retries exceeded when attempting to send email:",
+                    $allParams
+                );
+            }
+        }
+
+        return true;
+    }
+
+    /**
+     * Terminate the current job
+     */
+    public function terminate() {
+        // Nothing to do
+    }
+}

src/Mail/RetryMailer.php

@@ -0,0 +1,122 @@
+<?php
+
+/*
+ * AVSDev UF Tweaks (https://avsdev.uk)
+ *
+ * @link      https://git.avsdev.uk/avsdev/sprinkle-uf-tweaks
+ * @license   https://git.avsdev.uk/avsdev/sprinkle-uf-tweaks/blob/master/LICENSE.md (LGPL-3.0 License)
+ */
+
+namespace UserFrosting\Sprinkle\UFTweaks\Mail;
+
+use UserFrosting\Sprinkle\Core\Mail\EmailRecipient;
+use UserFrosting\Sprinkle\Core\Mail\Mailer;
+use UserFrosting\Sprinkle\Core\Mail\MailMessage;
+use UserFrosting\Sprinkle\Core\Mail\StaticMailMessage;
+use UserFrosting\Sprinkle\UFTweaks\Jobs\RetryEmail;
+
+/**
+ * Extends UF Mailer class to add retry function to sending mail via scheduler.
+ *
+ * This class should *only* be used in production once it is confirmed that email configuration works.
+ * 
+ * @author Craig Williams (craig@avsdev.uk)
+ */
+class RetryMailer extends Mailer
+{
+    protected function queueRetry(MailMessage $message, EmailRecipient $recipient = null) {
+        // Queue for resending
+        $retryMailMessage = new StaticMailMessage();
+        $retryMailMessage->setFromEmail($message->getFromEmail());
+        $retryMailMessage->setFromName($message->getFromName());
+        $retryMailMessage->setReplyEmail($message->getReplyEmail());
+        $retryMailMessage->setReplyName($message->getReplyName());
+        if ($recipient) {
+            $retryMailMessage->addEmailRecipient($recipient);
+            $retryMailMessage->setSubject($message->renderSubject($recipient->getParams()));
+            $retryMailMessage->setBody($message->renderBody($recipient->getParams()));
+        } else {
+            foreach ($message->getRecipients() as $recipientLoop) {
+                $retryMailMessage->addEmailRecipient($recipientLoop);
+            }
+            $retryMailMessage->setSubject($message->renderSubject());
+            $retryMailMessage->setBody($message->renderBody());
+        }
+
+        $retry = new RetryEmail($retryMailMessage);
+        $retry->queue();
+    }
+
+    /**
+     * Send a MailMessage message.
+     *
+     * Sends a single email to all recipients, as well as their CCs and BCCs.
+     * Since it is a single-header message, recipient-specific template data will not be included.
+     *
+     * @param MailMessage $message
+     * @param bool        $clearRecipients Set to true to clear the list of recipients in the message after calling send().  This helps avoid accidentally sending a message multiple times.
+     *
+     * @throws phpmailerException The message could not be sent.
+     */
+    public function send(MailMessage $message, $clearRecipients = true, $disableRetry = false)
+    {
+        try {
+            return parent::send($message, $clearRecipients);
+        } catch(\PHPMailer\PHPMailer\Exception $e) {
+            if (!$disableRetry) {
+                $this->queueRetry($message);
+            } else {
+                throw $e;
+            }
+        } finally {
+            // Clear recipients from the PHPMailer object for this iteration,
+            // so that we can send a separate email to the next recipient.
+            $this->phpMailer->clearAllRecipients();
+        }
+            
+        // Clear out the MailMessage's internal recipient list if requested
+        if ($clearRecipients) {
+            $message->clearRecipients();
+        }
+    }
+
+    /**
+     * Send a MailMessage message, sending a separate email to each recipient.
+     *
+     * If the message object supports message templates, this will render the template with the corresponding placeholder values for each recipient.
+     *
+     * @param MailMessage $message
+     * @param bool        $clearRecipients Set to true to clear the list of recipients in the message after calling send().  This helps avoid accidentally sending a message multiple times.
+     *
+     * @throws phpmailerException The message could not be sent.
+     */
+    public function sendDistinct(MailMessage $message, $clearRecipients = true, $disableRetry = false)
+    {
+        $allRecipients = $message->getRecipients();
+        $message->clearRecipients();
+
+        foreach ($allRecipients as $recipient) {
+            $message->addEmailRecipient($recipient);
+            try {
+                return parent::sendDistinct($message, $clearRecipients);
+            } catch (\PHPMailer\PHPMailer\Exception $e) {
+                if (!$disableRetry) {
+                    $this->queueRetry($message, $recipient);
+                } else {
+                    throw $e;
+                }
+            } finally {
+                // Clear recipients from the PHPMailer object for this iteration,
+                // so that we can send a separate email to the next recipient.
+                $this->phpMailer->clearAllRecipients();
+            }
+            $message->clearRecipients();
+        }
+
+        if (!$clearRecipients) {
+            foreach ($allRecipients as $recipient) {
+                $message->addEmailRecipient($recipient);
+            }
+        }
+    }
+}

src/Scheduler/Tasks/CleanupSessions.php

@@ -0,0 +1,43 @@
+<?php
+
+/*
+ * AVSDev UF Tweaks (https://avsdev.uk)
+ *
+ * @link      https://git.avsdev.uk/avsdev/sprinkle-uf-tweaks
+ * @license   https://git.avsdev.uk/avsdev/sprinkle-uf-tweaks/blob/master/LICENSE.md (LGPL-3.0 License)
+ */
+
+namespace UserFrosting\Sprinkle\UFTweaks\Scheduler\Tasks;
+
+use Carbon\Carbon;
+use Illuminate\Database\Capsule\Manager as Capsule;
+use UserFrosting\Sprinkle\Scheduler\Scheduler\BaseTask;
+use UserFrosting\Sprinkle\Core\Database\Models\Session;
+
+
+/**
+ * Daily task to clean expired sessions from the database
+ *
+ * @author Craig Williams (https://avsdev.uk)
+ */
+class CleanupSessions extends BaseTask
+{
+    /**
+     * Function used to specify the schedule for the task.
+     */
+    public function schedule()
+    {
+        $this->daily()->at("23:00");
+    }
+
+    /**
+     * Function used to specify what the task does.
+     */
+    public function run()
+    {
+        // Remove sessions over 2 days old
+        Session::where('last_activity', '<', time()-(60*60*48))->delete();
+
+        return true;
+    }
+}

src/ServicesProvider/ServicesProvider.php

@@ -9,6 +9,7 @@
 
 namespace UserFrosting\Sprinkle\UFTweaks\ServicesProvider;
 
+use Illuminate\Database\Capsule\Manager as Capsule;
 use Monolog\Formatter\LineFormatter;
 use Monolog\Handler\StreamHandler;
 use Monolog\Logger;
@@ -17,6 +18,9 @@ use Psr\Http\Message\ResponseInterface as Response;
 use Psr\Http\Message\ServerRequestInterface as Request;
 use UserFrosting\Sprinkle\Core\Log\MixedFormatter;
 use UserFrosting\Sprinkle\UFTweaks\Twig\HasRoleExtension;
+use UserFrosting\Sprinkle\UFTweaks\Twig\LocaleOverrideExtension;
+use UserFrosting\Sprinkle\UFTweaks\Twig\MobileDetectExtension;
+use UserFrosting\Sprinkle\UFTweaks\Mail\RetryMailer;
 
 
 /**
@@ -150,6 +154,25 @@ class ServicesProvider
                 }
             );
 
+            /*
+             * Check if the specified user (by user_id) has a particular permission.
+             *
+             * @param  int  $user_id the id of the user.
+             * @param  int  $permission_slug slug of the permission to check.
+             * @return bool true if the user has the permission, false otherwise.
+             */
+            $authorizer->addCallback(
+                'has_permission',
+                function ($user_id, $permission_slug) {
+                    return Capsule::table('role_users')
+                        ->join('permission_roles', 'role_users.role_id', '=', 'permission_roles.role_id')
+                        ->join('permissions', 'permission_roles.permission_id', '=', 'permissions.id')
+                        ->where('user_id', $user_id)
+                        ->where('slug', $permission_slug)
+                        ->count() > 0;
+                }
+            );
+
             return $authorizer;
         });
 
@@ -162,6 +185,8 @@ class ServicesProvider
             $twig = $view->getEnvironment();
 
             $twig->addExtension(new HasRoleExtension($c));
+            $twig->addExtension(new MobileDetectExtension($c));
+            $twig->addExtension(new LocaleOverrideExtension($c));
 
             return $view;
         });
@@ -187,5 +212,26 @@ class ServicesProvider
 
             return $logger;
         };
+
+        /*
+         * Mail service.
+         *
+         * @return \UserFrosting\Sprinkle\Core\Mail\Mailer
+         * @return \UserFrosting\Sprinkle\UFTweaks\Mail\RetryMailer
+         */
+        $container->extend('mailer', function ($mailer, $c) {
+            if (!$c->config['retry_mailer.enabled']) {
+                return $mailer;
+            }
+
+            $retryMailer = new RetryMailer($c->mailLogger, $c->config['mail']);
+
+            // Use UF debug settings to override any service-specific log settings.
+            if (!$c->config['debug.smtp']) {
+                $retryMailer->getPhpMailer()->SMTPDebug = 0;
+            }
+
+            return $retryMailer;
+        });
     }
 }

src/Twig/HasRoleExtension.php

@@ -63,7 +63,7 @@ class HasRoleExtension extends AbstractExtension implements GlobalsInterface
         ];
     }
 
-    public function getGlobals()
+    public function getGlobals(): array
     {
         return [];
     }

src/Twig/LocaleOverrideExtension.php

@@ -0,0 +1,52 @@
+<?php
+
+/*
+ * AVSDev UF Tweaks (https://avsdev.uk)
+ *
+ * @link      https://git.avsdev.uk/avsdev/sprinkle-uf-tweaks
+ * @license   https://git.avsdev.uk/avsdev/sprinkle-uf-tweaks/blob/master/LICENSE.md (LGPL-3.0 License)
+ */
+
+namespace UserFrosting\Sprinkle\UFTweaks\Twig;
+
+use Psr\Container\ContainerInterface;
+use Twig\Extension\AbstractExtension;
+use Twig\Extension\GlobalsInterface;
+
+/**
+ * Overrides the page language to 'en' only
+ */
+class LocaleOverrideExtension extends AbstractExtension implements GlobalsInterface
+{
+    /**
+     * @var ContainerInterface
+     */
+    protected $services;
+
+    /**
+     * @var Config
+     */
+    protected $config;
+
+    /**
+     * @param ContainerInterface $services
+     */
+    public function __construct(ContainerInterface $services)
+    {
+        $this->services = $services;
+    }
+
+    /**
+     * Adds Twig global variable 'currentLocale'
+     *
+     * @return array[mixed]
+     */
+    public function getGlobals(): array
+    {
+        $locale = $this->services->locale->getLocaleIndentifier();
+        $parts = explode('_', $locale) ?: [];
+        return [
+            'currentLocale' => $parts[0]
+        ];
+    }
+}

src/Twig/MobileDetectExtension.php

@@ -0,0 +1,60 @@
+<?php
+
+/*
+ * AVSDev UF Tweaks (https://avsdev.uk)
+ *
+ * @link      https://git.avsdev.uk/avsdev/sprinkle-uf-tweaks
+ * @license   https://git.avsdev.uk/avsdev/sprinkle-uf-tweaks/blob/master/LICENSE.md (LGPL-3.0 License)
+ */
+
+namespace UserFrosting\Sprinkle\UFTweaks\Twig;
+
+use Detection\MobileDetect;
+use Psr\Container\ContainerInterface;
+use Twig\Extension\AbstractExtension;
+use Twig\Extension\GlobalsInterface;
+use Twig\TwigFunction;
+
+/**
+ * Extends Twig functionality for mobile detection.
+ *
+ * @author Craig Williams (https://avsdev.uk)
+ */
+class MobileDetectExtension extends AbstractExtension implements GlobalsInterface
+{
+    /**
+     * @param ContainerInterface $services
+     */
+    public function __construct(ContainerInterface $services)
+    {
+    }
+
+    public function getName()
+    {
+        return 'avsdev/uf-tweaks-mobileDetect';
+    }
+
+    public function getFunctions()
+    {
+        return [
+            // Add Twig function for checking permissions during dynamic menu rendering
+            new TwigFunction('isMobile', function () {
+                $detect = new MobileDetect();
+                return $detect->isMobile();
+            }),
+            new TwigFunction('isTablet', function () {
+                $detect = new MobileDetect();
+                return $detect->isTablet();
+            }),
+            new TwigFunction('isDesktop', function () {
+                $detect = new MobileDetect();
+                return !$detect->isTablet() && !$detect->isMobile();
+            }),
+        ];
+    }
+
+    public function getGlobals(): array
+    {
+        return [];
+    }
+}

templates/forms/forgot-password.html.twig

@@ -0,0 +1,8 @@
+<form id="request-password-reset" role="form" action="{{site.uri.public}}/account/forgot-password" method="post" class="r-form" aria-label="Forgotten password">
+    {% include "forms/csrf.html.twig" %}
+    <div class="form-group">
+        <label class="sr-only" for="reset-form-email">{{translate("EMAIL")}}</label>
+        <input type="text" name="email" placeholder="{{translate("EMAIL")}}" class="form-control" id="reset-form-email" autocomplete="email">
+    </div>
+    <button type="submit" class="btn btn-block btn-primary">{{translate("PASSWORD.FORGET.EMAIL_SEND")}}</button>
+</form>

templates/forms/inputs/abstract/slug.html.twig

@@ -1,4 +1,4 @@
-{% if 'description' not in form.fields.hidden %}
+{% if 'slug' not in form.fields.hidden %}
     {% if col_width %}<div class="{{col_width}}">{% endif %}
         <div class="form-group">
             <label for="input-{{type}}-slug" class="control-label">{{field_name | default(translate('SLUG'))}}</label>
@@ -15,4 +15,6 @@
             </div>
         </div>
     {% if col_width %}</div>{% endif %}
+{% else %}
+<input type="hidden" id="input-{{type}}-slug" name="slug" value="{{current_value}}">
 {% endif %}

templates/forms/inputs/register-captcha.html.twig

@@ -4,7 +4,7 @@
             <label class="sr-only" for="input-register-captcha">{{translate('CAPTCHA.VERIFY')}}</label>
             <div class="row">
                 <div class="col-md-6">
-                    <input type="text" id="input-register-captcha" name="captcha" placeholder="{{translate('CAPTCHA.SPECIFY')}}" class="form-control">
+                    <input type="text" id="input-register-captcha" name="captcha" placeholder="{{translate('CAPTCHA.SPECIFY')}}" class="form-control" autocomplete="off">
                 </div>
                 <div class="col-md-6 form-col-captcha">
                     <img src="{{site.uri.public}}/account/captcha" id="captcha" data-target="#input-register-captcha">

templates/forms/inputs/register-name_email.html.twig

@@ -1,24 +1,24 @@
 {% if 'name_email' not in form.fields.hidden %}
     {% if col_width %}<div class="{{col_width}}">{% endif %}
-    <label for="input-register-first_name">{{translate('NAME_AND_EMAIL')}}</label>
+    <span class="form-group-label">{{translate('NAME_AND_EMAIL')}}</span>
     <div class="row">
         <div class="col-md-6">
             <div class="form-group">
                 <label class="sr-only control-label" for="input-register-first_name">{{translate('FIRST_NAME')}}</label>
-                <input type="text" id="input-register-first_name" name="first_name" placeholder="{{translate('FIRST_NAME')}}" class="form-control" autocomplete="off">
+                <input type="text" id="input-register-first_name" name="first_name" placeholder="{{translate('FIRST_NAME')}}" class="form-control" autocomplete="given-name">
             </div>
         </div>
         <div class="col-md-6">
             <div class="form-group">
                 <label class="sr-only control-label" for="input-register-last_name">{{translate('LAST_NAME')}}</label>
-                <input type="text" id="input-register-last_name" name="last_name" placeholder="{{translate('LAST_NAME')}}" class="form-control" autocomplete="off">
+                <input type="text" id="input-register-last_name" name="last_name" placeholder="{{translate('LAST_NAME')}}" class="form-control" autocomplete="family-name">
             </div>
         </div>
     </div>
     <div class="row">
         <div class="col-md-12">
             <div class="form-group">
-                <input type="text" id="input-register-email" name="email" placeholder="{% if site.registration.require_email_verification %}{{translate('EMAIL.VERIFICATION_REQUIRED')}}{% else %}{{translate('EMAIL.YOUR')}}{% endif %}" class="form-control">
+                <input type="text" id="input-register-email" name="email" placeholder="{% if site.registration.require_email_verification %}{{translate('EMAIL.VERIFICATION_REQUIRED')}}{% else %}{{translate('EMAIL.YOUR')}}{% endif %}" class="form-control" autocomplete="email">
             </div>
         </div>
     </div>

templates/forms/inputs/register-password.html.twig

@@ -2,11 +2,11 @@
     {% if col_width %}<div class="{{col_width}}">{% endif %}
         <div class="form-group">
             <label for="input-register-password" class="control-label">{{translate('PASSWORD')}}</label>
-            <input type="password" id="input-register-password" name="password" placeholder="{{translate('PASSWORD.BETWEEN', {min: site.password.length.min, max: site.password.length.max})}}" class="form-control">
+            <input type="password" id="input-register-password" name="password" placeholder="{{translate('PASSWORD.BETWEEN', {min: site.password.length.min, max: site.password.length.max})}}" class="form-control" autocomplete="new-password">
         </div>
         <div class="form-group">
             <label class="sr-only control-label" for="input-register-passwordc">{{translate('PASSWORD.CONFIRM')}}</label>
-            <input type="password" id="input-register-passwordc" name="passwordc" placeholder="{{translate('PASSWORD.CONFIRM')}}" class="form-control">
+            <input type="password" id="input-register-passwordc" name="passwordc" placeholder="{{translate('PASSWORD.CONFIRM')}}" class="form-control" autocomplete="new-password">
         </div>
     {% if col_width %}</div>{% endif %}
 {% endif %}

templates/forms/inputs/register-user_name.html.twig

@@ -3,7 +3,7 @@
         <div class="form-group">
             <label for="input-register-username" class="control-label">{{translate('USERNAME')}}</label>
             <span class="pull-right"><a href="#" id="input-register-username-suggest">[{{translate('SUGGEST')}}]</a></span>
-            <input type="text" id="input-register-username" name="user_name" placeholder="{{translate('USERNAME.CHOOSE')}}" class="form-control" autocomplete="off">
+            <input type="text" id="input-register-username" name="user_name" placeholder="{{translate('USERNAME.CHOOSE')}}" class="form-control" autocomplete="username">
         </div>
     {% if col_width %}</div>{% endif %}
 {% endif %}

templates/forms/inputs/user-current_password.html.twig

@@ -4,7 +4,7 @@
             <label for="input-user-passwordcheck" class="control-label">{{translate("PASSWORD.CURRENT")}}</label>
             <div class="input-group">
                 <span class="input-group-addon"><i class="fas fa-key"></i></span>
-                <input type="password" id="input-user-passwordcheck" class="form-control" name="passwordcheck" placeholder="{{translate("PASSWORD.CURRENT_EXPLAIN")}}" {% if 'password' in form.fields.disabled %}disabled{% endif %}>
+                <input type="password" id="input-user-passwordcheck" class="form-control" name="passwordcheck" placeholder="{{translate("PASSWORD.CURRENT_EXPLAIN")}}" {% if 'password' in form.fields.disabled %}disabled{% endif %} autocomplete="current-password">
             </div>
         </div>
     {% if col_width %}</div>{% endif %}

templates/forms/inputs/user-email.html.twig

@@ -4,7 +4,7 @@
             <label for="input-user-email" class="control-label">{{translate('EMAIL')}}</label>
             <div class="input-group js-copy-container">
                 <span class="input-group-addon"><i class="fas fa-envelope fa-fw"></i></span>
-                <input type="text" class="form-control js-copy-target" name="email" autocomplete="off" value="{{user.email}}" placeholder="{{translate('EMAIL')}}" {% if 'email' in form.fields.disabled %}disabled{% endif %}>
+                <input type="text" class="form-control js-copy-target" id="input-user-email" name="email" value="{{user.email}}" placeholder="{{translate('EMAIL')}}" {% if 'email' in form.fields.disabled %}disabled{% endif %} autocomplete="email">
                 {% if 'email' in form.fields.disabled %}
                     {% if 'copy' not in form.fields.disabled %}
                     <span class="input-group-btn">

templates/forms/inputs/user-first_name.html.twig

@@ -4,7 +4,7 @@
             <label for="input-user-first-name" class="control-label">{{translate('FIRST_NAME')}}</label>
             <div class="input-group">
                 <span class="input-group-addon"><i class="fas fa-edit fa-fw"></i></span>
-                <input type="text" id="input-user-first-name" name="first_name" class="form-control" autocomplete="off" value="{{user.first_name}}" placeholder="{{translate('FIRST_NAME')}}" {% if 'name' in form.fields.disabled %}disabled{% endif %}>
+                <input type="text" id="input-user-first-name" name="first_name" class="form-control" value="{{user.first_name}}" placeholder="{{translate('FIRST_NAME')}}" {% if 'name' in form.fields.disabled %}disabled{% endif %} autocomplete="given-name">
             </div>
         </div>
     {% if col_width %}</div>{% endif %}

templates/forms/inputs/user-last_name.html.twig

@@ -4,7 +4,7 @@
             <label for="input-user-last-name" class="control-label">{{translate('LAST_NAME')}}</label>
             <div class="input-group">
                 <span class="input-group-addon"><i class="fas fa-edit fa-fw"></i></span>
-                <input type="text" id="input-user-last-name" name="last_name" class="form-control" autocomplete="off" value="{{user.last_name}}" placeholder="{{translate('LAST_NAME')}}" {% if 'name' in form.fields.disabled %}disabled{% endif %}>
+                <input type="text" id="input-user-last-name" name="last_name" class="form-control" value="{{user.last_name}}" placeholder="{{translate('LAST_NAME')}}" {% if 'name' in form.fields.disabled %}disabled{% endif %} autocomplete="family-name">
             </div>
         </div>
     {% if col_width %}</div>{% endif %}

templates/forms/inputs/user-new_password.html.twig

@@ -4,14 +4,14 @@
             <label for="input-user-password" class="control-label">{{translate("PASSWORD.NEW")}}</label>
             <div class="input-group">
                 <span class="input-group-addon"><i class="fas fa-key"></i></span>
-                <input type="password" id="input-user-password" class="form-control" name="password" placeholder="{{translate("PASSWORD.BETWEEN", {min: site.password.length.min, max: site.password.length.max})}} ({{translate("OPTIONAL")}})" {% if 'password' in form.fields.disabled %}disabled{% endif %}>
+                <input type="password" id="input-user-password" class="form-control" name="password" placeholder="{{translate("PASSWORD.BETWEEN", {min: site.password.length.min, max: site.password.length.max})}} ({{translate("OPTIONAL")}})" {% if 'password' in form.fields.disabled %}disabled{% endif %} autocomplete="new-password">
             </div>
         </div>
         <div class="form-group">
             <label for="input-user-passwordc" class="control-label">{{translate("PASSWORD.CONFIRM_NEW")}}</label>
             <div class="input-group">
                 <span class="input-group-addon"><i class="fas fa-key"></i></span>
-                <input type="password" id="input-user-passwordc" class="form-control" name="passwordc" placeholder="{{translate("PASSWORD.CONFIRM_NEW_HELP")}}" {% if 'password' in form.fields.disabled %}disabled{% endif %}>
+                <input type="password" id="input-user-passwordc" class="form-control" name="passwordc" placeholder="{{translate("PASSWORD.CONFIRM_NEW_HELP")}}" {% if 'password' in form.fields.disabled %}disabled{% endif %} autocomplete="new-password">
             </div>
         </div>
     {% if col_width %}</div>{% endif %}

templates/forms/inputs/user-user_name.html.twig

@@ -4,7 +4,7 @@
             <label for="input-user-username" class="control-label">{{translate('USERNAME')}}</label>
             <div class="input-group">
                 <span class="input-group-addon"><i class="fas fa-edit fa-fw"></i></span>
-                <input type="text" id="input-user-username" class="form-control" name="user_name" autocomplete="off" value="{{user.user_name}}" placeholder="{{translate('USERNAME')}}" {% if 'user_name' in form.fields.disabled %}disabled{% endif %}>
+                <input type="text" id="input-user-username" class="form-control" name="user_name" value="{{user.user_name}}" placeholder="{{translate('USERNAME')}}" {% if 'user_name' in form.fields.disabled %}disabled{% endif %} autocomplete="username">
             </div>
         </div>
     {% if col_width %}</div>{% endif %}

templates/forms/register.html.twig

@@ -26,7 +26,7 @@
             {% endblock %}
 
             <div class="col-sm-12 collapse">
-                <label>Spiderbro: Don't change me bro, I'm tryin'a catch some flies!</label>
+                <label for="spiderbro">Spiderbro: Don't change me bro, I'm tryin'a catch some flies!</label>
                 <input name="spiderbro" id="spiderbro" value="http://"/>
             </div>
 
@@ -48,10 +48,4 @@
         <button type="submit" class="btn btn-block btn-primary">{{translate('REGISTER_ME')}}</button>
         {% endblock %}
     </div>
-    
-    <div style="padding-top: 10px;">
-        {{translate('SIGN_IN_HERE', {
-            'url' : site.uri.public ~'/account/sign-in'
-        }) | raw}}
-    </div>
 </form>

templates/forms/resend-verification.html.twig

@@ -0,0 +1,8 @@
+<form id="request-verification-email" role="form" action="{{site.uri.public}}/account/resend-verification" method="post" class="r-form">
+    {% include "forms/csrf.html.twig" %}
+    <div class="form-group">
+        <label class="sr-only" for="verification-form-email">{{translate("EMAIL")}}</label>
+        <input type="text" name="email" placeholder="{{translate("EMAIL")}}" class="form-control" id="verification-form-email" autocomplete="email">
+    </div>
+    <button type="submit" class="btn btn-block btn-primary">{{translate("ACCOUNT.VERIFICATION.SEND")}}</button>
+</form>

templates/forms/reset-password.html.twig

@@ -0,0 +1,16 @@
+<form id="set-or-reset-password" role="form" action="{{site.uri.public}}/account/set-password" method="post" class="r-form" aria-label="Reset password">
+    {% include "forms/csrf.html.twig" %}
+
+    <div class="form-group">
+        <label class="sr-only" for="form-password">{{translate("PASSWORD.NEW")}}</label>
+        <input type="password" name="password" placeholder="{{translate("PASSWORD.BETWEEN", {min: site.password.length.min, max: site.password.length.max})}}" class="form-control" id="form-password" autocomplete="new-password">
+    </div>
+
+    <div class="form-group">
+        <label class="sr-only" for="form-passwordc">{{translate("PASSWORD.CONFIRM_NEW")}}</label>
+        <input type="password" name="passwordc" placeholder="{{translate("PASSWORD.CONFIRM_NEW_EXPLAIN")}}" class="form-control" id="form-passwordc" autocomplete="new-password">
+    </div>
+    
+    <input type="hidden" name="token" value="{{token}}">
+    <button type="submit" class="btn btn-block btn-primary">{{translate("PASSWORD.RESET.SEND")}}</button>
+</form>

templates/forms/set-password.html.twig

@@ -0,0 +1,17 @@
+<form id="set-or-reset-password" role="form" action="{{site.uri.public}}/account/set-password" method="post" class="r-form">
+    {% include "forms/csrf.html.twig" %}
+    {# Prevent browsers from trying to autofill the password field.  See http://stackoverflow.com/a/23234498/2970321 #}
+    <input type="text" style="display:none" aria-label="hidden spider text">
+    <input type="password" style="display:none" aria-label="hidden spider password">
+
+    <div class="form-group">
+        <label class="sr-only" for="form-password">{{translate('PASSWORD')}}</label>
+        <input type="password" name="password" placeholder="{{translate('PASSWORD.BETWEEN', {min: site.password.length.min, max: site.password.length.max})}}" class="form-control" id="form-password">
+    </div>
+    <div class="form-group">
+        <label class="sr-only" for="form-passwordc">{{translate('PASSWORD.CONFIRM')}}</label>
+        <input type="password" name="passwordc" placeholder="{{translate('PASSWORD.CONFIRM')}}" class="form-control" id="form-passwordc">
+    </div>
+    <input type="hidden" name="token" value="{{token}}">
+    <button type="submit" class="btn btn-block btn-primary">{{translate('PASSWORD.CREATE.SET')}}</button>
+</form>

templates/forms/settings-account.html.twig

@@ -1,12 +1,13 @@
 <form id="account-settings" role="form" action="{{site.uri.public}}/account/settings" method="post">
     <div class="box-header">
-        <h3 class="box-title"><i class="fas fa-cog fa-fw"></i> {{translate("ACCOUNT.SETTINGS")}}</h3>
+        <h2 class="box-title"><i class="fas fa-cog fa-fw"></i> {{translate("ACCOUNT.SETTINGS")}}</h2>
     </div>
     <div class="box-body">
         {% include "forms/csrf.html.twig" %}
+
         <!-- Prevent browsers from trying to autofill the password field.  See http://stackoverflow.com/a/23234498/2970321 -->
-        <input type="text" style="display:none">
-        <input type="password" style="display:none">
+        <input type="text" style="display:none" aria-hidden=”true” role="none" aria-label="autocomplere username trap">
+        <input type="password" style="display:none" aria-hidden=”true” role="none" aria-label="autocomplere password trap">
 
         {% block settings_account %}
             <div class="row">

templates/forms/settings-profile.html.twig

@@ -1,6 +1,6 @@
 <form id="profile-settings" role="form" action="{{site.uri.public}}/account/settings/profile" method="post">
     <div class="box-header">
-        <h3 class="box-title"><i class="fas fa-user fa-fw"></i> {{translate("PROFILE.SETTINGS")}}</h3>
+        <h2 class="box-title"><i class="fas fa-user fa-fw"></i> {{translate("PROFILE.SETTINGS")}}</h2>
     </div>
     <div class="box-body">
         {% include "forms/csrf.html.twig" %}

templates/forms/sign-in.html.twig

@@ -0,0 +1,27 @@
+<form action="{{site.uri.public}}/account/login" id="sign-in" method="post" role="form" aria-label="Sign in">
+  {% include "forms/csrf.html.twig" %}
+  <div class="form-group has-feedback">
+    <label class="sr-only" for="username">{% if site.login.enable_email %}{{translate('EMAIL_OR_USERNAME')}}{% else %}{{translate('USERNAME')}}{% endif %}</label>
+    <input type="text" class="form-control" placeholder="{% if site.login.enable_email %}{{translate('EMAIL_OR_USERNAME')}}{% else %}{{translate('USERNAME')}}{% endif %}" name="user_name" id="username" autocomplete="username">
+    <i class="glyphicon glyphicon-user form-control-icon" aria-hidden="true"></i>
+  </div>
+  <div class="form-group has-feedback">
+    <label class="sr-only" for="password">{{translate('PASSWORD')}}</label>
+    <input type="password" class="form-control" placeholder="{{translate('PASSWORD')}}" name="password" id="password" autocomplete="current-password">
+    <i class="glyphicon glyphicon-lock form-control-icon" aria-hidden="true"></i>
+  </div>
+  <div class="row">
+    <div class="col-xs-8">
+      <div class="checkbox icheck">
+        <label>
+          <input type="checkbox" class="js-icheck" name="rememberme"> {{translate('REMEMBER_ME')}}
+        </label>
+      </div>
+    </div>
+    <!-- /.col -->
+    <div class="col-xs-4">
+      <button type="submit" class="btn btn-primary btn-block btn-flat">{{translate('LOGIN')}}</button>
+    </div>
+    <!-- /.col -->
+  </div>
+</form>

templates/modals/confirm-permanently-delete-user.html.twig

@@ -7,7 +7,7 @@
     {% include "forms/csrf.html.twig" %}
     <div class="js-form-alerts">
     </div>
-    <h4>{{translate("USER.PERMANENT_DELETE_CONFIRM", {user_name: user.user_name})}}</h4>
+    <p>{{translate("USER.PERMANENT_DELETE_CONFIRM", {user_name: user.user_name})}}</p>
     <br>
     <small>{{translate("ACTION_CANNOT_UNDONE")}}</small>
     <br>

templates/pages/abstract/dashboard.html.twig

@@ -0,0 +1,69 @@
+{% extends "@admin/pages/abstract/dashboard.html.twig" %}
+
+{% block content %}
+    {# This needs to be here (early in the body) to make sure the animation doesn't fire #}
+    <script>
+        (function () {
+          if (Boolean(sessionStorage.getItem('sidebar-toggle-collapsed'))) {
+            var body = document.getElementsByTagName('body')[0];
+            body.className = body.className + ' sidebar-collapse';
+          }
+        })();
+    </script>
+
+    <div class="wrapper">
+      {% block main_header %}
+      <header id="main-header" class="main-header">
+        <!-- Logo -->
+        {{ block('navbar_logo') }}
+
+        <!-- Header Navbar: style can be found in header.less -->
+        <nav class="navbar navbar-static-top">
+            <!-- Sidebar toggle button-->
+            <a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button">
+                <span class="sr-only">Toggle navigation</span>
+            </a>
+            <!-- Main nav buttons -->
+            {% include "navigation/navbar.html.twig" %}
+        </nav>
+      </header>
+      {% endblock %}
+
+      <!-- Left side column. contains the logo and sidebar -->
+      {% block main_sidebar %}
+      <aside id="main-sidebar" class="main-sidebar">
+        <!-- sidebar: style can be found in sidebar.less -->
+        <section class="sidebar">
+            {% include 'navigation/sidebar.html.twig' %}
+        </section>
+        <!-- /.sidebar -->
+      </aside>
+      {% endblock %}
+
+      <!-- Content Wrapper. Contains page content -->
+      {% block main_content %}
+      <main id="main-content" class="content-wrapper">
+        <!-- Content Header (Page header) -->
+        {% block content_header %}
+        <section class="content-header">
+          <h1>{% block header_title %}{{ block('page_title') }}{% endblock %}</h1>
+          {% if block('page_description') is not empty %}<p class="page-description">{% block header_description %}{{ block('page_description') }}{% endblock %}</p>{% endif %}
+          {% block breadcrumb %}{% include 'navigation/breadcrumb.html.twig' with {page_title: block('page_title')} %}{% endblock %}
+          <div id="alerts-page"></div>
+        </section>
+        {% endblock %}
+        <section class="content">
+            {% block body_matter %}{% endblock %}
+        </section>
+      </main>
+      {% endblock %}
+      <!-- /.content-wrapper -->
+
+    <!-- Footer -->
+    {% block main_footer %}
+    {{ block('footer') }}
+    {% endblock %}
+
+    </div>
+    <!-- ./wrapper -->
+{% endblock %}

templates/pages/abstract/loginBox-page.html.twig

@@ -0,0 +1,31 @@
+{% extends "pages/abstract/base.html.twig" %}
+
+{% block body_attributes %}
+    class="hold-transition login-page"
+{% endblock %}
+
+{% block content %}
+<div id="main-content" class="login-box">
+    <header class="login-logo">
+        <h1><a href="{{site.uri.public}}">{{site.title}}</a></h1>
+    </header>
+    <!-- /.login-logo -->
+
+    {% block loginBox %}
+    <main class="login-box-body login-form">
+        <h2 class="login-box-msg">{% block loginBox_title %}{% endblock %}</h2>
+        {% if block('loginBox_subtitle') is not empty %}<p class="login-box-msg">{% block loginBox_subtitle %}{% endblock %}</p>{% endif %}
+
+        <div class="form-alerts" id="alerts-page"></div>
+
+        {% block loginBox_content %}{% endblock %}
+
+        <div class="login-box-footer">
+          {% block loginBox_footer %}{% endblock %}
+        </div>
+    </main>
+    {% endblock %}
+    <!-- /.login-box-body -->
+</div>
+<!-- /.login-box -->
+{% endblock %}

templates/pages/dashboard.html.twig

@@ -1,6 +1,5 @@
-{% extends "@admin/pages/abstract/dashboard.html.twig" %}
+{% extends "pages/abstract/dashboard.html.twig" %}
 
-{# Overrides blocks in head of base template #}
 {% block page_title %}{{ translate("DASHBOARD") }}{% endblock %}
 {% block page_description %}{% endblock %}
 
@@ -301,5 +300,5 @@
 
     <!-- Include page-specific JS -->
     {{ assets.js('js/pages/dashboard') | raw }}
-
 {% endblock %}
+

templates/pages/forgot-password.html.twig

@@ -0,0 +1,21 @@
+{% extends "pages/abstract/loginBox-page.html.twig" %}
+
+{% block page_title %}{{translate("PASSWORD.FORGOTTEN")}}{% endblock %}
+{% block page_description %}{{translate("PASSWORD.FORGET.PAGE")}}{% endblock %}
+
+{% block loginBox_title %}{{translate("PASSWORD.FORGOTTEN")}}{% endblock %}
+{% block loginBox_subtitle %}{{translate("PASSWORD.FORGET.EMAIL")}}{% endblock %}
+{% block loginBox_content %}{% include "forms/forgot-password.html.twig" %}{% endblock %}
+{% block loginBox_footer %}
+    <a href="{{site.uri.public}}/account/sign-in">{{translate('BACK_TO_LOGIN')}}</a>
+{% endblock %}
+
+{% block scripts_page %}
+    <!-- Include validation rules -->
+    <script>
+    {% include "pages/partials/page.js.twig" %}
+    </script>
+
+    <!-- Include page-specific JS bundle -->
+    {{ assets.js('js/pages/forgot-password') | raw }}
+{% endblock %}

templates/pages/register.html.twig

@@ -1,19 +1,23 @@
-{% extends "@account/pages/register.html.twig" %}
+{% extends "pages/abstract/loginBox-page.html.twig" %}
 
-{% block content %}
-<div class="login-box">
-    <div class="login-logo">
-        <a href="{{site.uri.public}}">{{site.title}}</a>
+{% block page_title %}{{translate("REGISTER")}}{% endblock %}
+{% block page_description %}{{translate('PAGE.LOGIN.DESCRIPTION', {'site_name': site.title })}}{% endblock %}
+
+{% block loginBox_title %}{{translate("REGISTER")}}{% endblock %}
+{% block loginBox_content %}{% include "forms/register.html.twig" %}{% endblock %}
+{% block loginBox_footer %}
+    <div style="padding-top: 10px;">
+        {{translate('SIGN_IN_HERE', {'url' : site.uri.public ~'/account/sign-in'}) | raw}}
+        <a href="{{site.uri.public}}">{{translate('BACK_TO_HOMEPAGE')}}</a>
     </div>
-    <!-- /.login-logo -->
+{% endblock %}
 
-    <div class="login-box-body register-form">
-        <p class="login-box-msg"><strong>{{translate('REGISTER')}}</strong></p>
+{% block scripts_page %}
+    <!-- Include validation rules -->
+    <script>
+        {% include "pages/partials/page.js.twig" %}
+    </script>
 
-        {% include "forms/register.html.twig" %}
-    </div>
-    <!-- /.login-box-body -->
-
-</div>
-<!-- /.login-box -->
-{% endblock %}
+    <!-- Include page-specific JS -->
+    {{ assets.js('js/pages/register') | raw }}
+{% endblock %}

templates/pages/resend-verification.html.twig

@@ -0,0 +1,22 @@
+{% extends "pages/abstract/loginBox-page.html.twig" %}
+
+{% block page_title %}{{translate("ACCOUNT.VERIFICATION.RESEND")}}{% endblock %}
+{% block page_description %}{{translate("ACCOUNT.VERIFICATION.PAGE")}}{% endblock %}
+
+{% block loginBox_title %}{{translate("ACCOUNT.VERIFICATION.RESEND")}}{% endblock %}
+{% block loginBox_subtitle %}{{translate("ACCOUNT.VERIFICATION.EMAIL")}}{% endblock %}
+{% block loginBox_content %}{% include "forms/resend-verification.html.twig" %}{% endblock %}
+{% block loginBox_footer %}
+    <a href="{{site.uri.public}}/account/sign-in">{{translate('BACK_TO_LOGIN')}}</a>
+{% endblock %}
+
+{% block scripts_page %}
+    <!-- Include validation rules -->
+    <script>
+    {% include "pages/partials/page.js.twig" %}
+    </script>
+
+    <!-- Include page-specific JS -->
+    {{ assets.js('js/pages/resend-verification') | raw }}
+
+{% endblock %}

templates/pages/reset-password.html.twig

@@ -0,0 +1,20 @@
+{% extends "pages/abstract/loginBox-page.html.twig" %}
+
+{% block page_title %}{{translate("PASSWORD.RESET")}}{% endblock %}
+{% block page_description %}{{translate("PASSWORD.RESET.PAGE")}}{% endblock %}
+
+{% block loginBox_title %}{{translate("PASSWORD.RESET")}}{% endblock %}
+{% block loginBox_subtitle %}{{translate("PASSWORD.RESET.CHOOSE")}}{% endblock %}
+{% block loginBox_content %}{% include "forms/reset-password.html.twig" %}{% endblock %}
+{% block loginBox_footer %}{% endblock %}
+
+{% block scripts_page %}
+    <!-- Include validation rules -->
+    <script>
+    {% include "pages/partials/page.js.twig" %}
+    </script>
+
+    <!-- Include page-specific JS bundle -->
+    {{ assets.js('js/pages/set-or-reset-password') | raw }}
+
+{% endblock %}

templates/pages/set-password.html.twig

@@ -0,0 +1,20 @@
+{% extends "pages/abstract/loginBox-page.html.twig" %}
+
+{% block page_title %}{{translate("PASSWORD.CREATE")}}{% endblock %}
+{% block page_description %}{{translate("PASSWORD.CREATE.PAGE")}}{% endblock %}
+
+{% block loginBox_title %}{{translate("PASSWORD.CREATE")}}{% endblock %}
+{% block loginBox_subtitle %}{{translate("WELCOME_TO", {'title': site.title})}} {{translate("PASSWORD.CREATE.PAGE")}}{% endblock %}
+{% block loginBox_content %}{% include "forms/set-password.html.twig" %}{% endblock %}
+{% block loginBox_footer %}{% endblock %}
+
+{% block scripts_page %}
+    <!-- Include validation rules -->
+    <script>
+    {% include "pages/partials/page.js.twig" %}
+    </script>
+
+    <!-- Include page-specific JS bundle -->
+    {{ assets.js('js/pages/set-or-reset-password') | raw }}
+
+{% endblock %}

templates/pages/sign-in.html.twig

@@ -0,0 +1,39 @@
+{% extends "pages/abstract/loginBox-page.html.twig" %}
+
+{% block page_title %}{{translate('SIGNIN')}}{% endblock %}
+{% block page_description %}{{translate('PAGE.LOGIN.DESCRIPTION', {'site_name': site.title })}}{% endblock %}
+
+{% block loginBox_title %}{{translate('SIGNIN')}}{% endblock %}
+{% block loginBox_content %}{% include "forms/sign-in.html.twig" %}{% endblock %}
+{% block loginBox_footer %}
+    <a href="{{site.uri.public}}/account/forgot-password">{{translate('PASSWORD.FORGET')}}</a><br>
+    {% if site.registration.require_email_verification %}
+    <a href="{{site.uri.public}}/account/resend-verification">{{translate('ACCOUNT.VERIFICATION.RESEND')}}</a><br>
+    {% endif %}
+    {% if site.registration.enabled %}
+    <a href="{{site.uri.public}}/account/register">{{translate('REGISTER')}}</a><br>
+    {% endif %}
+    <a href="{{site.uri.public}}">{{translate('BACK_TO_HOMEPAGE')}}</a>
+{% endblock %}
+
+{% block scripts_page %}
+    <!-- Include validation rules -->
+    <script>
+        {% include "pages/partials/page.js.twig" %}
+    </script>
+
+    <script>
+    site = $.extend(
+        true,               // deep extend
+        {
+            "registration" : {
+                "enabled" : "{{site.registration.enabled}}"
+            }
+        },
+        site
+    );
+    </script>
+
+    <!-- Include page-specific JS -->
+    {{ assets.js('js/pages/sign-in') | raw }}
+{% endblock %}

templates/tables/columns/abstract/generic-text.html.twig

@@ -0,0 +1,7 @@
+<script id="{{table.id}}-column-{{column.name}}" type="text/x-handlebars-template">
+    {% verbatim %}
+    <td data-text="{{row.{% endverbatim %}{{column.field}}{% verbatim %}}}">
+        {{row.{% endverbatim %}{{column.field}}{% verbatim %}}}
+    </td>
+    {% endverbatim %}
+</script>