From 8d2aa68bc18c04c2b03cbdd01f008a89e4c8c1c6 Mon Sep 17 00:00:00 2001
From: Christian Kollmann <christian.kollmann@a-sit.at>
Date: Tue, 7 Dec 2021 07:51:10 +0100
Subject: Unify HTML templates across test, main, basicConfig

---
 .../config/templates/other_login_method.html       | 202 ++-------------------
 1 file changed, 14 insertions(+), 188 deletions(-)

(limited to 'connector/src/test/resources/config/templates/other_login_method.html')

diff --git a/connector/src/test/resources/config/templates/other_login_method.html b/connector/src/test/resources/config/templates/other_login_method.html
index 56c368c6..c233c5c4 100644
--- a/connector/src/test/resources/config/templates/other_login_method.html
+++ b/connector/src/test/resources/config/templates/other_login_method.html
@@ -7,179 +7,7 @@
     <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="$contextPath/static/css/css_country.css" th:href="@{/static/css/css_country.css}"/>
-    <title th:text="#{gui.countryselection.title}">eIDAS-Login Login-Auswahl</title>
-    <script type="text/javascript">
-    </script>
-    <style>
-        body {
-            background-image: none;
-            margin: 0px;
-            font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-        }
-
-        div.header {
-            background-color: #e9ecef;
-            padding-top: 28px;
-            padding-left: 137px;
-            padding-right: 137px;
-            padding-bottom: 12px;
-        }
-
-        div.titlebar {
-            padding: 0px;
-        }
-
-        div.titlebar div {
-        }
-
-        .hidden {
-            display: none;
-        }
-
-        ul.nav_oben {
-            padding: 0px;
-            margin: 0px;
-            text-align: right;
-            text-transform: uppercase;
-        }
-
-        li {
-            display: inline-block;
-        }
-
-        div.header a {
-            text-decoration: none;
-            color: black;
-        }
-
-        a {
-            text-decoration: none;
-            color: #a22c1c;
-        }
-
-        .block {
-            /* override country.css */
-            width: 200px;
-            padding-bottom: 20px;
-        }
-
-        @media only screen and (min-width: 1000px) {
-            div.header {
-                padding-left: 137px;
-                padding-right: 137px;
-            }
-
-            .content {
-                padding-left: 137px;
-                padding-right: 137px;
-            }
-
-            footer {
-                padding-left: 137px;
-                padding-right: 137px;
-            }
-        }
-
-        @media only screen and (max-width: 999px) {
-            div.header {
-                padding-left: 1em;
-                padding-right: 1em;
-            }
-
-            .content {
-                padding-left: 1em;
-                padding-right: 1em;
-            }
-
-            footer {
-                padding-left: 1em;
-                padding-right: 1em;
-            }
-        }
-
-        div.subtitle h1 {
-            padding: 0px;
-            margin: 0px;
-            font-size: 130%;
-            align: right;
-        }
-
-        div.subtitle h2 {
-            padding: 0px;
-            margin: 0px;
-            font-size: 115%;
-        }
-
-        footer {
-            left: 0;
-            padding-top: 1em;
-            bottom: 0;
-            width: 100%;
-            height: 2em;
-            background-color: rgb(162, 44, 28);
-            color: white;
-        }
-
-        .float {
-            float: left;
-        }
-
-        .floatright {
-            float: right;
-        }
-
-        .copyright {
-            width: 66%;
-            font-size: 80%;
-        }
-
-        #countries {
-            padding-bottom: 40px;
-        }
-
-        #country {
-            padding-bottom: 20px;
-        }
-
-        input[type=submit] {
-            width: inherit;
-            /*	text-align: left; */
-        }
-
-        form {
-            justify-content: center;
-        }
-    </style>
-    <script type="text/javascript">
-
-        /* Element.closest polyfill - https://developer.mozilla.org/en-US/docs/Web/API/Element/closest License: public domain*/
-        if (!Element.prototype.matches)
-            Element.prototype.matches = Element.prototype.msMatchesSelector ||
-                Element.prototype.webkitMatchesSelector;
-
-        if (!Element.prototype.closest)
-            Element.prototype.closest = function (s) {
-                var el = this;
-                if (!document.documentElement.contains(el)) return null;
-                do {
-                    if (el.matches(s)) return el;
-                    el = el.parentElement || el.parentNode;
-                } while (el !== null && el.nodeType === 1);
-                return null;
-            };
-
-
-        function clickCountryFlag(element) {
-            if (!element) return false;
-
-            var form = element.closest("form");
-
-            if (!form) return false;
-
-            form.submit();
-            return false;
-        }
-    </script>
+    <title th:text="#{gui.otherlogin.title}">eIDAS-Login Other Login Methods</title>
 </head>
 <body>
 <div class="header container">
@@ -198,8 +26,10 @@
                 </div>
             </li>
             &nbsp; &nbsp;
-            <li><a href="https://www.bmi.gv.at/" target="_blank" th:text="#{gui.countryselection.link.bmi}"> Startseite
-                BMI </a></li>
+            <li>
+                <a href="https://www.bmi.gv.at/" target="_blank" th:text="#{gui.countryselection.link.bmi}">Startseite
+                    BMI </a>
+            </li>
         </ul>
     </div>
 </div>
@@ -209,35 +39,31 @@
         <h2 th:text="#{gui.countryselection.header3}"> Betrieben durch das Bundesministerium für Inneres </h2>
     </div>
 
-    <h1 th:text="#{gui.countryselection.header.selection}"> Wählen Sie Ihr Land / Select your country </h1>
+    <h1 th:text="#{gui.otherlogin.header.selection}"> Select an alternative login method </h1>
 
-    <div id="country">
-        <!-- Active countries -->
+    <div id="otherlogin">
         <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
             <input type="submit" role="button" value="Handy-Signatur / Mobile Signature"
-                   th:attr="value=#{gui.countryselection.country.de}"/>
-            <input type="hidden" name="selectedCountry" value="HS">
+                   th:attr="value=#{gui.otherlogin.hs}"/>
+            <input type="hidden" name="loginSelection" value="MOBILE_PHONE_SIGNATURE_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
         <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Andere eIDAS ID"
-                   th:attr="value=#{gui.countryselection.country.de}"/>
-            <input type="hidden" name="selectedCountry" value="EIDAS">
+            <input type="submit" role="button" value="Andere eIDAS ID" th:attr="value=#{gui.otherlogin.eidas}"/>
+            <input type="hidden" name="loginSelection" value="EIDAS_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
         <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Keine weitere HS / eIDAS"
-                   th:attr="value=#{gui.countryselection.country.de}"/>
-            <input type="hidden" name="selectedCountry" value="NONE">
+            <input type="submit" role="button" value="Keine weitere HS / eIDAS" th:attr="value=#{gui.otherlogin.none}"/>
+            <input type="hidden" name="loginSelection" value="NO_OTHER_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
-        <!-- todo wohnsitz -->
     </div>
 
     <!-- Abbrechen Button -->
     <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
         <input type="submit" class="btn btn-outline-primary btn-block" value="Abbrechen/Cancel"
-               th:attr="value=#{gui.countryselection.cancel}">
+               th:attr="value=#{gui.otherlogin.cancel}">
         <input type="hidden" name="stopAuthProcess" value="true">
         <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}">
     </form>
-- 
cgit v1.2.3


From 514f99284299882ce9b3e7741094eb55561b503e Mon Sep 17 00:00:00 2001
From: Christian Kollmann <christian.kollmann@a-sit.at>
Date: Tue, 7 Dec 2021 08:41:16 +0100
Subject: Rework styling of other login method template

---
 .../config/templates/other_login_method.html       | 35 +++++++++++++++-------
 1 file changed, 24 insertions(+), 11 deletions(-)

(limited to 'connector/src/test/resources/config/templates/other_login_method.html')

diff --git a/connector/src/test/resources/config/templates/other_login_method.html b/connector/src/test/resources/config/templates/other_login_method.html
index c233c5c4..ea15864e 100644
--- a/connector/src/test/resources/config/templates/other_login_method.html
+++ b/connector/src/test/resources/config/templates/other_login_method.html
@@ -8,6 +8,16 @@
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="$contextPath/static/css/css_country.css" th:href="@{/static/css/css_country.css}"/>
     <title th:text="#{gui.otherlogin.title}">eIDAS-Login Other Login Methods</title>
+    <style>
+        .block {
+            width: 100%;
+        }
+        button {
+            padding: 0.5em;
+            margin: 0.5em;
+            width: 20em;
+        }
+    </style>
 </head>
 <body>
 <div class="header container">
@@ -41,29 +51,32 @@
 
     <h1 th:text="#{gui.otherlogin.header.selection}"> Select an alternative login method </h1>
 
-    <div id="otherlogin">
-        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Handy-Signatur / Mobile Signature"
-                   th:attr="value=#{gui.otherlogin.hs}"/>
+    <div id="otherlogin" class="block">
+        <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <button type="submit" role="button" value="Handy-Signatur / Mobile Signature"
+                    th:text="#{gui.otherlogin.hs}">A
+            </button>
             <input type="hidden" name="loginSelection" value="MOBILE_PHONE_SIGNATURE_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
-        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Andere eIDAS ID" th:attr="value=#{gui.otherlogin.eidas}"/>
+        <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <button type="submit" role="button" value="Andere eIDAS ID" th:text="#{gui.otherlogin.eidas}">B
+            </button>
             <input type="hidden" name="loginSelection" value="EIDAS_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
-        <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-            <input type="submit" role="button" value="Keine weitere HS / eIDAS" th:attr="value=#{gui.otherlogin.none}"/>
+        <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+            <button type="submit" role="button" value="Keine weitere HS / eIDAS"
+                    th:text="#{gui.otherlogin.none}">C
+            </button>
             <input type="hidden" name="loginSelection" value="NO_OTHER_LOGIN">
             <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}"/>
         </form>
     </div>
 
     <!-- Abbrechen Button -->
-    <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
-        <input type="submit" class="btn btn-outline-primary btn-block" value="Abbrechen/Cancel"
-               th:attr="value=#{gui.otherlogin.cancel}">
+    <form method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">
+        <button type="submit" value="Abbrechen/Cancel" th:text="#{gui.otherlogin.cancel}"></button>
         <input type="hidden" name="stopAuthProcess" value="true">
         <input type="hidden" name="pendingid" value="$pendingid" th:attr="value=${pendingid}">
     </form>
-- 
cgit v1.2.3


From a017ebff96d2cc12943801c933e5733b4e827b3b Mon Sep 17 00:00:00 2001
From: Christian Kollmann <christian.kollmann@a-sit.at>
Date: Tue, 7 Dec 2021 09:00:22 +0100
Subject: Use relative paths in templates to enable preview in browser

If Thymeleaf is active (i.e. the template is rendered by the Webapp),
the path gets replaced anyway.
---
 connector/src/test/resources/config/templates/other_login_method.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'connector/src/test/resources/config/templates/other_login_method.html')

diff --git a/connector/src/test/resources/config/templates/other_login_method.html b/connector/src/test/resources/config/templates/other_login_method.html
index ea15864e..8f846f84 100644
--- a/connector/src/test/resources/config/templates/other_login_method.html
+++ b/connector/src/test/resources/config/templates/other_login_method.html
@@ -6,7 +6,7 @@
 <head>
     <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
     <meta name="viewport" content="width=device-width, initial-scale=1">
-    <link rel="stylesheet" href="$contextPath/static/css/css_country.css" th:href="@{/static/css/css_country.css}"/>
+    <link rel="stylesheet" href="../webcontent/css/css_country.css" th:href="@{/static/css/css_country.css}"/>
     <title th:text="#{gui.otherlogin.title}">eIDAS-Login Other Login Methods</title>
     <style>
         .block {
-- 
cgit v1.2.3