diff --git a/src/plainui/jinja2/plainui/header.html.j2 b/src/plainui/jinja2/plainui/header.html.j2
index 37fec65dd280f992405d50c8e0b7e7efdb7869d7..c4037c976469fb5cb8121f92ce3126d550d4aab7 100644
--- a/src/plainui/jinja2/plainui/header.html.j2
+++ b/src/plainui/jinja2/plainui/header.html.j2
@@ -5,7 +5,6 @@
{% set view_name = request.resolver_match.view_name %}
<nav class="navbar navbar-expand-lg border-bottom border-bottom">
<div class="container-fluid">
- {% set base_url = "" %}
{{ logoMacro.logo(base_url, conf.name + " logo", conf.name + " logo") }}
<button class="navbar-toggler"
type="button"
diff --git a/src/plainui/jinja2/plainui/login.html.j2 b/src/plainui/jinja2/plainui/login.html.j2
index 96d2fd675ad60d67fbf1b0f7fc06dd6714cb3fbc..60a9a3a3e2a1e78ea85f6aa0d0f4e0a29fc109a1 100644
--- a/src/plainui/jinja2/plainui/login.html.j2
+++ b/src/plainui/jinja2/plainui/login.html.j2
@@ -8,13 +8,13 @@
{% endblock title %}
{% block fullpage %}
- <article class="container">
- <figure class="hub-landing__logo">
- {{ logoMacro.logo(url('plainui:index') , conf.name + " logo", conf.name + "
- logo", "rounded mx-auto d-block") }}
- </figure>
- <div class="mw-320 mx-auto">
- <h2>{{ _("Login") }}</h2>
+ <article class="hub-content hub-content__landing">
+ <div class="text-center d-md-none mb-5">
+ {{ logoMacro.logo(conf, base_url, conf.name + " logo", conf.name + " logo") }}
+ </div>
+
+ <div class="hub-card mw-md-22rem pt-2 mx-auto">
+ <h1 class="h3">{{ _("Login") }}</h1>
{% if not archive_mode %}
<form method="post" id="login" class="hub-landing__form">
<!--<h1 class="text-center bg-secondary p-2 text-dark h3 m-0">{{ _("login") }}</h1>-->
@@ -29,15 +29,16 @@
<div class="d-grid gap-2 my-3">
<button type="submit" class="btn btn-primary" form="login">{{ _("Login") }}</button>
- <span class="text-center">oder</span>
+ <div class="text-center">{{ _("or") }}</div>
<a href="{{ url('plainui:password_reset') }}"
- class="btn btn-secondary"
+ class="btn btn-outline-secondary"
title="{{ _('Reset Password') }}">{{ _('Reset Password') }}</a>
</div>
<p class="mb-2 text-white">{{ _("login--cookie_info") }}</p>
<hr class="hub-spacer">
- <h3>{{ _("New here?") }}</h3>
+
+ <h1 class="h3 mb-3">{{ _("New here?") }}</h1>
<div class="d-grid">
<a href="{{ url('plainui:signup') }}"
class="btn btn-primary"
@@ -46,11 +47,9 @@
</div>
</form>
{% else %}
- <p class="mb-2 text-white">{{ _("archive_mode_no_login") }}</p>
+ <p class="my-5">{{ _("archive_mode_no_login") }}</p>
{% endif %}
</div>
-
- <hr class="hub-spacer">
</article>
{% endblock fullpage %}
diff --git a/src/plainui/jinja2/plainui/password_change.html.j2 b/src/plainui/jinja2/plainui/password_change.html.j2
index 9ab7f71e0e207bbe7cbd49316ee46de04f78c649..68a327b1f21af449e485bb55bdf73e547e047280 100644
--- a/src/plainui/jinja2/plainui/password_change.html.j2
+++ b/src/plainui/jinja2/plainui/password_change.html.j2
@@ -6,25 +6,22 @@
{% endblock title %}
{% block content %}
- <div class="row justify-content-center px-6 mt-11 mb-8">
- <div class="col-auto">{{ logoMacro.logo(url('plainui:index') , conf.name + " logo", conf.name + " logo") }}</div>
- </div>
+ <article class="hub-content hub-content__landing">
+ <div class="text-center d-md-none mb-5">
+ {{ logoMacro.logo(conf, base_url, conf.name + " logo", conf.name + " logo") }}
+ </div>
- <form method="post"
- class="mw-810 border p-0 mx-auto mb-11{% if error %} border-danger{% endif %} mt-6">
- <h2 class="bg-secondary text-center text-dark m-0 px-3 py-1">{{ _("Change password") }}</h2>
- <div class="p-3">
+ <form method="post" class="hub-content hub-content__landing">
+ <h1 class="h3">{{ _("Change password") }}</h1>
{{ csrf_input }}
{{ form_elements.password(form, 'old_password') }}
{{ form_elements.password(form, 'new_password1') }}
{{ form_elements.password(form, 'new_password2') }}
- <ul class="d-flex justify-content-center list-unstyled mb-0 pt-3">
- <li class="mx-2">
- <button type="submit" class="btn btn-primary">{{ _("Change Password") }}</button>
- </li>
- </ul>
{{ form_elements.errors(form) }}
- </div>
- </form>
+ <div class="mt-3">
+ <button type="submit" class="btn btn-primary">{{ _("Change Password") }}</button>
+ </div>
+ </form>
+ </article>
{% endblock content %}
diff --git a/src/plainui/jinja2/plainui/password_reset_complete.html.j2 b/src/plainui/jinja2/plainui/password_reset_complete.html.j2
index 3b8305dd52d98fa86f500e4d5744b32004706dff..5820bf182ce192aa06fca797131491e5312803da 100644
--- a/src/plainui/jinja2/plainui/password_reset_complete.html.j2
+++ b/src/plainui/jinja2/plainui/password_reset_complete.html.j2
@@ -5,23 +5,17 @@
{% endblock title %}
{% block fullpage %}
- <article class="hub-landing">
- <figure class="hub-landing__logo">
- {{ logoMacro.logo(url('plainui:index') , conf.name + " logo", conf.name + " logo") }}
- </figure>
-
- <div class="mw-664 border p-0 mx-auto">
- <h2 class="text-center bg-secondary m-0 text-dark py-1">{{ title }}</h2>
- <div class="p-3">
- <p class="mt-5 mb-3 text-white text-center">{{ _("Your password has been set. You may go ahead and log in now.") }}</p>
- <p class="text-center">
- <a href="{{ url('plainui:login') }}"
- title="{{ _('Login') }}"
- class="btn btn-primary">{{ _('Login') }}</a>
- </p>
- </div>
+ <article class="hub-content hub-content__landing">
+ <div class="text-center d-md-none mb-5">
+ {{ logoMacro.logo(conf, base_url, conf.name + " logo", conf.name + " logo") }}
</div>
- <hr class="hub-spacer">
+ <div class="hub-card mw-md-22rem pt-2 mx-auto">
+ <h1 class="h3">{{ title }}</h1>
+ <p class="mb-3">{{ _("Your password has been set. You may go ahead and log in now.") }}</p>
+ <a href="{{ url('plainui:login') }}"
+ title="{{ _('Login') }}"
+ class="btn btn-primary">{{ _('Login') }}</a>
+ </div>
</article>
{% endblock fullpage %}
diff --git a/src/plainui/jinja2/plainui/password_reset_confirm.html.j2 b/src/plainui/jinja2/plainui/password_reset_confirm.html.j2
index e58765772532d17c50cf4a61ba6cd69494621b7b..69bc22a64376693ea0ac14b2730adbcd1eafdb9f 100644
--- a/src/plainui/jinja2/plainui/password_reset_confirm.html.j2
+++ b/src/plainui/jinja2/plainui/password_reset_confirm.html.j2
@@ -6,32 +6,30 @@
{% endblock title %}
{% block fullpage %}
- <article class="hub-landing">
- <figure class="hub-landing__logo">
- {{ logoMacro.logo(url('plainui:index') , conf.name + " logo", conf.name + " logo") }}
- </figure>
+ <article class="hub-content hub-content__landing">
+ <div class="text-center d-md-none mb-5">
+ {{ logoMacro.logo(conf, base_url, conf.name + " logo", conf.name + " logo") }}
+ </div>
- <form method="post" id="login-change" class="mw-664 hub-landing__form">
- <!--<h1 class="text-center bg-secondary p-3 text-dark h3">{{ _("enter new password") }}</h1>-->
- <div>
- <input type="hidden" name="next" value="{{ next }}">
- {{ csrf_input }}
- {{ form_elements.password(form, 'new_password1') }}
- {{ form_elements.password(form, 'new_password2') }}
- <ul class="d-flex justify-content-center list-unstyled mb-0">
- <li class="mx-2 mb-3 mb-lg-0">
- <a href="{{ url('plainui:login') }}"
- title="{{ _('Login') }}"
- class="btn btn-transparent">{{ _('Login') }}</a>
- </li>
- <li class="mx-2">
- <button type="submit" class="btn btn-primary" form="login-change">{{ _("Change Password") }}</button>
- </li>
- </ul>
- {{ form_elements.errors(form) }}
+ <form method="post"
+ id="login-change"
+ class="hub-card mw-md-44rem pt-2 mx-auto">
+ <h1 class="h3">{{ _("enter new password") }}</h1>
+ <input type="hidden" name="next" value="{{ next }}">
+ {{ csrf_input }}
+ {{ form_elements.password(form, 'new_password1') }}
+ {{ form_elements.password(form, 'new_password2') }}
+ {{ form_elements.errors(form) }}
+
+ <div class="d-flex flex-column flex-sm-row align-items-center gap-3 mt-3">
+ <button type="submit"
+ class="btn btn-primary w-100 w-sm-auto"
+ form="login-change">{{ _("Change Password") }}</button>
+ <div>{{ _("or") }}</div>
+ <a href="{{ url('plainui:login') }}"
+ title="{{ _('Login') }}"
+ class="btn btn-outline-secondary w-100 w-sm-auto">{{ _('Login') }}</a>
</div>
</form>
-
- <hr class="hub-spacer">
</article>
{% endblock fullpage %}
diff --git a/src/plainui/jinja2/plainui/password_reset_done.html.j2 b/src/plainui/jinja2/plainui/password_reset_done.html.j2
index 404a9cc02653be8532b42fb899d8140249a122b0..dff38c4b7725879e8098c117d5a750ee43149c91 100644
--- a/src/plainui/jinja2/plainui/password_reset_done.html.j2
+++ b/src/plainui/jinja2/plainui/password_reset_done.html.j2
@@ -5,30 +5,23 @@
{% endblock title %}
{% block fullpage %}
- <article class="hub-landing">
- <figure class="hub-landing__logo">
- {{ logoMacro.logo(url('plainui:index') , conf.name + " logo", conf.name + " logo") }}
- </figure>
-
- <h1 class="text-center hub-landing__title">welcome to {{ conf.name }}</h1>
+ <article class="hub-content hub-content__landing">
+ <div class="text-center d-md-none mb-5">
+ {{ logoMacro.logo(conf, base_url, conf.name + " logo", conf.name + " logo") }}
+ </div>
- <div class="mw-664 border p-0 mx-auto">
- <h2 class="text-center bg-secondary m-0 text-dark py-1">{{ title }}</h2>
- <div class="p-3">
- <p class="mt-5 mb-3 text-white text-center">
- {{ _("We’ve emailed you instructions for setting your password, if an account exists with the email you entered. You should receive them shortly.") }}
- </p>
- <p class="mb-5 text-white text-center">
- {{ _("If you don’t receive an email, please make sure you’ve entered the address you registered with, and check your spam folder.") }}
- </p>
- <p class="text-center">
- <a href="{{ url('plainui:login') }}"
- title="{{ _('Login') }}"
- class="btn btn-primary">{{ _('Login') }}</a>
- </p>
- </div>
+ <div class="hub-card mw-md-22rem mx-auto">
+ <h1 class="h3 mb-3">{{ title }}</h1>
+ <p>
+ {{ _("We’ve emailed you instructions for setting your password, if an account exists with the email you entered. You should receive them shortly.") }}
+ </p>
+ <p>
+ {{ _("If you don’t receive an email, please make sure you’ve entered the address you registered with, and check your spam folder.") }}
+ </p>
+ <a href="{{ url('plainui:login') }}"
+ title="{{ _('Login') }}"
+ class="btn btn-primary w-100">{{ _('Login') }}</a>
</div>
- <hr class="hub-spacer">
</article>
{% endblock fullpage %}
diff --git a/src/plainui/jinja2/plainui/registration/password_reset_form.html.j2 b/src/plainui/jinja2/plainui/registration/password_reset_form.html.j2
index dc1720129f5eea5898c203ec84d42aaa56546e3c..fcee3858ba048b8ea4da46dc2e2303ec4884b528 100644
--- a/src/plainui/jinja2/plainui/registration/password_reset_form.html.j2
+++ b/src/plainui/jinja2/plainui/registration/password_reset_form.html.j2
@@ -5,14 +5,15 @@
{{ _("%(conf)s - Reset Password", conf=conf.name) }}
{% endblock title %}
{% block fullpage %}
- <article class="hub-landing">
- <figure class="hub-landing__logo">
- {{ logoMacro.logo(url('plainui:index') , conf.name + " logo", conf.name + " logo") }}
- </figure>
+ <article class="hub-content hub-content__landing">
+ <div class="text-center d-md-none mb-5">
+ {{ logoMacro.logo(conf, base_url, conf.name + " logo", conf.name + " logo") }}
+ </div>
- <h1 class="text-center hub-landing__title">{{ _("reset password") }}</h1>
-
- <form method="post" id="login-reset" class="mw-664 hub-landing__form">
+ <form method="post"
+ id="login-reset"
+ class="hub-card mw-md-22rem pt-2 mx-auto">
+ <h1 class="h3">{{ _("reset password") }}</h1>
<div>
{% if retry %}
<ul class="list-unstyled text-left mb-2">
@@ -26,20 +27,16 @@
{{ formElements.text(form, 'email') }}
<p class="mb-2 text-white">{{ _("You will receive an e-mail with a reset link.") }}</p>
<p class="mb-2 text-white">{{ _("If you have no configured e-mail address, revisit your ticket activation link") }}</p>
- <ul class="d-flex justify-content-center list-unstyled mb-0">
- <li class="ml-3 mb-3 md-md-0">
- <a href="{{ url('plainui:login') }}"
- title="{{ _('Login') }}"
- class="btn btn-transparent">{{ _('Login') }}</a>
- </li>
- <li class="ml-3">
- <button type="submit" class="btn btn-primary" form="login-reset">{{ _("Reset Password") }}</button>
- </li>
- </ul>
+
+ <div class="d-flex flex-column justify-content-center gap-2 mb-0">
+ <button type="submit" class="btn btn-primary" form="login-reset">{{ _("Reset Password") }}</button>
+ <div class="text-center">{{ _("or") }}</div>
+ <a href="{{ url('plainui:login') }}"
+ title="{{ _('Login') }}"
+ class="btn btn-outline-secondary">{{ _('Login') }}</a>
+ </div>
{{ formElements.errors(form) }}
</div>
</form>
-
- <hr class="hub-spacer">
</article>
{% endblock fullpage %}
diff --git a/src/plainui/jinja2/plainui/signup.html.j2 b/src/plainui/jinja2/plainui/signup.html.j2
index 8403e466121a7cd9b8b1b25572c76284cecc1486..0a687a8f5712331e2a22f819d6c84dc923379d82 100644
--- a/src/plainui/jinja2/plainui/signup.html.j2
+++ b/src/plainui/jinja2/plainui/signup.html.j2
@@ -6,16 +6,17 @@
{% endblock title %}
{% block fullpage %}
- <article class="container">
- <figure class="hub-landing__logo">
- {{ logoMacro.logo(url('plainui:index') , conf.name + " logo", conf.name + " logo", "rounded mx-auto d-block") }}
- </figure>
- <h2>{{ _("Registration") }}</h2>
-
- <p>{{ _("Registration Info Text") }}</p>
+ <article class="hub-content hub-content__landing">
+ <div class="text-center d-md-none mb-5">
+ {{ logoMacro.logo(conf, base_url, conf.name + " logo", conf.name + " logo") }}
+ </div>
{% if not archive_mode %}
- <form method="post" id="registration" class="mw-664 hub-landing__form">
+ <form method="post"
+ id="registration"
+ class="hub-card mw-md-44rem pt-2 mx-auto">
+ <h1 class="h3">{{ _("Registration") }}</h1>
+ <p>{{ _("Registration Info Text") }}</p>
<div>
<input type="hidden" name="next" value="{{ next }}">
@@ -26,18 +27,14 @@
{{ formElementsMacro.password(form, 'password2') }}
{{ formElementsMacro.input(form, 'email', 'email') }}
- <ul class="d-flex flex-column flex-sm-row justify-content-center list-unstyled mb-0">
- <li class="mx-2">
- <button type="submit" class="btn btn-block btn-primary" form="registration">{{ _("Create Account") }}</button>
- </li>
- </ul>
+ <button type="submit"
+ class="btn btn-block btn-primary mt-3"
+ form="registration">{{ _("Create Account") }}</button>
</div>
</form>
{% else %}
- <p class="mb-2 text-white">{{ _("archive_mode_no_login") }}</p>
+ <p class="my-5 text-white">{{ _("archive_mode_no_login") }}</p>
{% endif %}
-
- <hr class="hub-spacer">
</article>
{% endblock fullpage %}
diff --git a/src/plainui/jinja2/plainui/signup_done.html.j2 b/src/plainui/jinja2/plainui/signup_done.html.j2
index 01ab9bdcd3a5e626299cb13be6bd2387da890432..c52341a0419eb0c8e196a7b19fdd73fe4d0366d3 100644
--- a/src/plainui/jinja2/plainui/signup_done.html.j2
+++ b/src/plainui/jinja2/plainui/signup_done.html.j2
@@ -6,15 +6,14 @@
{% endblock title %}
{% block fullpage %}
- <article class="container">
- <figure class="hub-landing__logo">
- {{ logoMacro.logo(url('plainui:index') , conf.name + " logo", conf.name + " logo", "rounded mx-auto d-block") }}
- </figure>
- <h2>{{ _("SignUp Complete") }}</h2>
+ <article class="hub-content hub-content__landing">
+ <div class="text-center d-md-none mb-5">
+ {{ logoMacro.logo(conf, base_url, conf.name + " logo", conf.name + " logo") }}
+ </div>
- <p>{{ _("SignUp Mail sent") }}</p>
-
- <hr class="hub-spacer">
+ <div class="hub-card mw-md-22rem pt-2 mx-auto">
+ <h1 class="h3">{{ _("SignUp Complete") }}</h1>
+ <p>{{ _("SignUp Mail sent") }}</p>
+ </div>
</article>
-
{% endblock fullpage %}
diff --git a/src/plainui/styles/components/_landingpage.scss b/src/plainui/styles/components/_landingpage.scss
index 8aa1dceb7f0c8f9acfad865566cd198c27a57988..3e5779cb869ed607d20947b744b34b1fa22da1c7 100644
--- a/src/plainui/styles/components/_landingpage.scss
+++ b/src/plainui/styles/components/_landingpage.scss
@@ -1,48 +1,9 @@
-.hub-landing {
- position: relative;
- overflow: hidden;
- min-height: calc(100vh - 72px);
- max-width: 51.875rem;
- margin: 0 auto;
- display: flex;
- flex-flow: column nowrap;
- justify-content: center;
- align-items: center;
- padding: 1rem;
+.hub-landing__logo {
+ .hub-logo {
+ max-width: none;
- &__logo {
- .hub-logo {
- max-width: none;
-
- img {
- width: 12rem;
- }
- }
- }
-
- &__content {
- position: absolute;
- top: map-get($spacers, 10);
- left: 50%;
- width: 100%;
- text-align: center;
- padding: $spacer;
- z-index: 6;
- transform: translate(-50%, 0);
- }
-
- &__title {
- font-size: 3.5rem;
- }
-
- @include media-breakpoint-up("md") {
- width: 90%;
- &__title {
- font-size: 7rem;
+ img {
+ width: 12rem;
}
}
-
- @include media-breakpoint-up("xxl") {
- max-width: 59.188rem;
- }
}
diff --git a/src/plainui/styles/utils/_layout.scss b/src/plainui/styles/utils/_layout.scss
index 625a13ce0b5f354c0f24135f8e26624a5875e684..2ca0e4301cc5bdcfc80ab45d5d9155e1251a7bf7 100644
--- a/src/plainui/styles/utils/_layout.scss
+++ b/src/plainui/styles/utils/_layout.scss
@@ -107,16 +107,26 @@
.hub-hlayout-l {
flex-direction: row;
}
-}
-.mw-320 {
- max-width: 20rem;
+ .mw-md-22rem {
+ max-width: 22rem;
+ }
+
+ .mw-md-44rem {
+ max-width: 44rem;
+ }
}
.w-100px {
width: 6.25rem;
}
+@include media-breakpoint-up(sm) {
+ .w-sm-auto {
+ width: auto !important;
+ }
+}
+
.hub-content {
padding: map-get($spacers, 2) map-get($spacers, 3);
padding-top: $hub-mobile-navbar-height;
@@ -128,6 +138,10 @@
padding: map-get($spacers, 3) map-get($spacers, 5);
}
+ .hub-content__landing {
+ padding-top: $hub-mobile-navbar-height;
+ }
+
.hub-main {
height: 100vh;
}