💄 Nudge people to the organisation login if OIDC enabled.

open-formulieren · Jun 3, 2024 · 30edf88 · 30edf88
1 parent 4c62dcf
commit 30edf88
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 2 deletions.
diff --git a/src/openforms/scss/admin/_app_overrides.scss b/src/openforms/scss/admin/_app_overrides.scss
@@ -97,6 +97,22 @@ $djai-padding--tablet: 30px;
   clear: both;
   padding-top: 1em;
 }
+.admin-login-divider {
+  text-align: center;
+  clear: both;
+  padding-top: 1em;
+
+  width: 100%;
+  text-align: center;
+  border-bottom: 1px solid #ccc;
+  line-height: 0.1em;
+  margin: 10px 0 20px;
+
+  span {
+    background: #fff;
+    padding: 0 10px;
+  }
+} 
 
 /* Styling for react-jsonschema-form */
 .rjsf {

diff --git a/src/openforms/templates/maykin_2fa/login.html b/src/openforms/templates/maykin_2fa/login.html
@@ -4,10 +4,17 @@
 {% block extra_login_options %}
     {% get_solo 'mozilla_django_oidc_db.OpenIDConnectConfig' as oidc_config %}
     {% if oidc_config.enabled %}
-        <div class="admin-login-option">{% trans "or" %}</div>
-        <div class="admin-login-option">
+        <div class="admin-login-option admin-login-password">
+            <a href="#" onclick="javascript: document.getElementById('login-form').style.display='block'; this.style.display='none';">{% trans "Login with application account" %}</a>
+        </div>
+        <div class="admin-login-divider"><span>{% trans "or" %}</span></div>
+        <div class="admin-login-option admin-login-oidc">
             <a href="{% url 'oidc_authentication_init' %}">{% trans "Login with organization account" %}</a>
         </div>
+        <style>
+            #login-form { display: none; }
+        </style>
+
     {% endif %}
 {% endblock %}