diff options
Diffstat (limited to 'basicConfig/templates/countrySelection.html')
| -rw-r--r-- | basicConfig/templates/countrySelection.html | 179 | 
1 files changed, 38 insertions, 141 deletions
| diff --git a/basicConfig/templates/countrySelection.html b/basicConfig/templates/countrySelection.html index bfa30669..275d20f6 100644 --- a/basicConfig/templates/countrySelection.html +++ b/basicConfig/templates/countrySelection.html @@ -2,136 +2,20 @@  <html xmlns:th="http://www.thymeleaf.org"        xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"        layout:decorator="fragments/base" -      th:with="lang=${#locale.language}" th:lang="${lang}"> +      th:with="lang=${#locale.language}" th:lang="${lang}">        <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="../webcontent/css/css_country.css" th:href="@{/static/css/css_country.css}"/> +<!--  <link rel="stylesheet" href="$contextPath/css/css_country.css" th:href="@{/css/css_country.css}"/> --> +  <link rel="stylesheet" href="/static/common.css"/>    <title th:text="#{gui.countryselection.title}">eIDAS-Login Länderauswahl</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.matches = Element.prototype.msMatchesSelector ||                                   Element.prototype.webkitMatchesSelector;  if (!Element.prototype.closest) @@ -141,7 +25,7 @@ if (!Element.prototype.closest)          do {              if (el.matches(s)) return el;              el = el.parentElement || el.parentNode; -        } while (el !== null && el.nodeType === 1); +        } while (el !== null && el.nodeType === 1);           return null;      }; @@ -149,7 +33,7 @@ if (!Element.prototype.closest)  function clickCountryFlag(element) {  	if (!element) return false; -	var form = element.closest("form"); +	var form = element.closest("form");   	if (!form) return false; @@ -162,11 +46,11 @@ function clickCountryFlag(element) {    <div class="header container">      <div class="titlebar">        <div> -	     <a href="https://www.bmi.gv.at/" target="_blank" title="Home"> -	       <img class="toplogo img-responsive" src="/static/BMI.png" alt="Logo BMI" -              th:attr="alt=#{gui.countryselection.logo.bmi.alt}"> -	       <h1 class="hidden" th:text="#{gui.countryselection.header1}"> Bundesministerium für Inneres </h1> -	     </a> +	    <a href="https://www.bmi.gv.at/" target="_blank" title="Home"> +	      <img class="toplogo img-responsive" src="/static/BMI.png" alt="Logo BMI" +               th:attr="alt=#{gui.countryselection.logo.bmi.alt}"> + 	      <h1 class="hidden" th:text="#{gui.countryselection.header1}"> Bundesministerium für Inneres </h1> +  	    </a>        </div>        <ul class="nav_oben">          <li> @@ -187,44 +71,57 @@ function clickCountryFlag(element) {      <h1 th:text="#{gui.countryselection.header.selection}"> Wählen Sie Ihr Land / Select your country </h1> -    <div id="country">      <!-- Active countries --> + +    <div id="country" th:with="countries=${ {'be', 'dk', 'de', 'ee', 'el', 'it', 'hr', 'lt', 'lv', 'lu', 'nl', 'pt', 'sk', 'si', 'es', 'cz' }}"> +            <form th:each="country : ${countries}" class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}"> +                <a onclick='clickCountryFlag(this)'><img class="countryimage" +                        th:attr="src=@{#{gui.countryselection.country.__${country}__.img}},alt=#{gui.countryselection.country.__${country}__.logo.alt}"/></a> + +                <input type="submit" class="country-button" role="button" value="?countryname?" th:attr="value=#{gui.countryselection.country.__${country}__}" /> +                <input type="hidden" name="selectedCountry" th:value="${#strings.toUpperCase(country)}"> +                <input  type="hidden" name="pendingid"  value="$pendingid" th:attr="value=${pendingid}" /> +            </form> +    </div> +<!--/* +    <div id="country">              <form class="block" method="post" action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">                  <a><img class="countryimage" src="$contextPath/img/countries/germany-eu_.png" alt="Germany-eID"                          th:attr="src=@{/img/countries/germany-eu_.png},alt=#{gui.countryselection.country.de.logo.alt}"/></a>                  <input type="submit" role="button" value="Deutschland / Germany" th:attr="value=#{gui.countryselection.country.de}" /> -                <input type="hidden" name="selectedCountry" value="XX"> +                <input type="hidden" name="selectedCountry" value="DE">                  <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.countryselection.cancel}"> +    <form   class="block" method="post"  action="$contextPath$submitEndpoint" th:attr="action=@{${submitEndpoint}}">  +      <input  type="submit" class="btn btn-outline-primary btn-block cancel-button" value="Abbrechen/Cancel" th:attr="value=#{gui.countryselection.cancle}">                                            <input  type="hidden" name="stopAuthProcess" value="true" >        <input  type="hidden" name="pendingid"  value="$pendingid" th:attr="value=${pendingid}">      </form> -    <p th:text="#{gui.countryselection.notsupportedinfo}" >Wenn Sie Ihr Land in dieser Aufzählung nicht entdecken ... </p> - +    <p th:text="#{gui.countryselection.notsupportedinfo}" >Wenn Sie Ihr Land in dieser Aufzählung nicht entdecken ... </p>  +     <h2 th:text="#{gui.countryselection.infos.general.header}" > Information zur Anmeldung über Europäische eIDs </h2>  <p> -  <span th:text="#{gui.countryselection.infos.general.part.1}"> first part </span> -  <a href="https://www.bmi.gv.at/" target="_blank" th:text="#{gui.countryselection.header1}" > Bundesministerium für Inneres </a> +  <span th:text="#{gui.countryselection.infos.general.part.1}"> first part </span>         +  <a href="https://www.bmi.gv.at/" target="_blank" th:text="#{gui.countryselection.header1}" > Bundesministerium für Inneres </a>     <span th:text="#{gui.countryselection.infos.general.part.2}"> second part </span>  </p> - +                                                                                                                 <p>    <span th:text="#{gui.countryselection.infos.general.part.3}"> third part </span> -  <a href="https://eur-lex.europa.eu/legal-content/DE/TXT/HTML/?uri=CELEX:32014R0910&from=DE" target="_blank" th:text="#{gui.countryselection.infos.general.link.1}"> eIDAS-Verordnung der Europäischen Union </a> +  <a href="https://eur-lex.europa.eu/legal-content/DE/TXT/HTML/?uri=CELEX:32014R0910&from=DE" target="_blank" th:text="#{gui.countryselection.infos.general.link.1}"> eIDAS-Verordnung der Europäischen Union </a>      <span th:text="#{gui.countryselection.infos.general.part.4}"> fourth part </span>  </p> -<p +<p>    <span th:text="#{gui.countryselection.infos.general.part.5}"> fived part </span> -  <a href="https://www.dsb.gv.at/-/das-erganzungsregister-fur-naturliche-personen-ernp-" target="_blank" th:text="#{gui.countryselection.infos.general.link.2}" ></a> -  <span th:text="#{gui.countryselection.infos.general.part.6}"> sixed part </span> +  <a href="http://ernp.bmi.gv.at/" target="_blank" th:text="#{gui.countryselection.infos.general.link.2}" ></a> +  <span th:text="#{gui.countryselection.infos.general.part.6}"> sixed part </span>    </p>    </div> | 
