Add modern theme

1 files changed, 92 insertions, 0 deletions

diff --git a/src/application/templates/modern/register.twig b/src/application/templates/modern/register.twig
new file mode 100644
index 0000000..8e7dfe5
--- /dev/null
+++ b/src/application/templates/modern/register.twig
@@ -0,0 +1,92 @@
+{% set title = __("Register") %}
+{% set formId = "register" %}
+{% set formError = getAndClearFormError(formId) %}
+
+{% extends "base.twig" %}
+
+{% block content %}
+
+<div class="page-header">
+    <h1>{{ __("Register") }}</h1>
+</div>
+
+<div class="main-form">
+    {% if formError %}
+        {% include "components/alert_error.twig" with { message: formError } %}
+    {% endif %}
+    <form action="{{ g.server.REQUEST_URI }}" method="post">
+        <input type="hidden" name="form_id" value="{{ formId }}">
+
+        <div class="form-group" id="group0">
+            <label for="i_username">{{ __("Username:") }}</label>
+            <input class="form-control" id="i_username" type="text" name="username" value="" required>
+        </div>
+
+        <div class="form-group" id="group1">
+            <label for="i_username">{{ __("Username:") }}</label>
+            <input class="form-control" id="i_username" type="text" name="df82a9bc21" value="{{ lastFormField(formId, "df82a9bc21") }}" required autofocus>
+        </div>
+
+        <div class="form-group" id="group2">
+            <label for="i_display_name">{{ __("Display name:") }}</label>
+            <input class="form-control" id="i_display_name" type="text" name="display_name" value="{{ lastFormField(formId, "display_name") }}" required>
+        </div>
+
+        <div class="form-group" id="group3">
+            <label for="i_password">{{ __("Choose password:") }}</label>
+            <input class="form-control" id="i_password" type="password" name="password" required>
+        </div>
+
+        <div class="form-group" id="group4">
+            <label for="i_password_retype">{{ __("Repeat password:") }}</label>
+            <input class="form-control" id="i_password_retype" type="password" name="password_retype" required>
+        </div>
+
+        <div class="form-group" id="group5">
+            <label for="i_email">{{ __("Email address:") }}</label>
+            <input class="form-control" id="i_email" type="email" name="email" value="{{ lastFormField(formId, "email") }}" required>
+        </div>
+
+        <div class="form-group" id="group6">
+            <label for="i_email">{{ __("CAPTCHA:") }}</label>
+            <div class="text-center">
+                <img src="?_action=captcha&amp;t={{ "now"|date("Uv") }}" alt="CAPTCHA" width="192" height="48" id="captcha-img">
+            </div>
+            <div class="spring-row">
+                <div class="spring-fill">
+                    <input type="text" name="captcha" id="i_captcha" class="form-control" required>
+                </div>
+                <div class="spring-fit">
+                    <button class="btn btn-iconic" type="button" id="btn-refresh-captcha" title="{{ __("New CAPTCHA") }}">
+                        <svg viewBox="0 0 24 24" class="icon"><path d="M21 12a9 9 0 0 0-9-9 9.75 9.75 0 0 0-6.74 2.74L3 8"/><path d="M3 3v5h5"/><path d="M3 12a9 9 0 0 0 9 9 9.75 9.75 0 0 0 6.74-2.74L21 16"/><path d="M16 16h5v5"/></svg>
+                    </button>
+                </div>
+            </div>
+        </div>
+
+        <div class="form-group form-actions">
+            <button class="btn btn-primary" type="submit">{{ __("Register now") }}</button>
+        </div>
+
+        <div class="form-group form-additional">
+            {{ __("Already have an account? %link%Sign in now%/link%", {
+                "link": '<a href="?_action=auth">',
+                "/link": '</a>',
+            }) }}
+        </div>
+    </form>
+</div>
+
+<script>
+document.addEventListener("DOMContentLoaded", function() {
+    document.querySelector("#btn-refresh-captcha").addEventListener("click", function() {
+        document.querySelector("#captcha-img").src = "?_action=captcha&t=" + new Date().getTime().toString();
+    });
+    (function($$) {
+        $$.disabled = true;
+        $$.required = false;
+    })(document.querySelector("#i_username"));
+});
+</script>
+
+{% endblock %}