From 6a1ce9c9c0960850401dde26b474d36f70944f54 Mon Sep 17 00:00:00 2001
From: Andreas Neustifter <andreas.neustifter@gmail.com>
Date: Mon, 23 Apr 2018 20:03:29 +0000
Subject: [PATCH] Fix login dialog layout for frio.

Rearrange login dialog distinguish better between logging und registering.
---
 view/theme/frio/css/style.css       | 37 +++++++++++++++++++++++++----
 view/theme/frio/templates/login.tpl | 13 +++++++---
 2 files changed, 42 insertions(+), 8 deletions(-)

diff --git a/view/theme/frio/css/style.css b/view/theme/frio/css/style.css
index 1614547b85..55ccff4d74 100644
--- a/view/theme/frio/css/style.css
+++ b/view/theme/frio/css/style.css
@@ -3136,12 +3136,25 @@ section .profile-match-wrapper {
  * Login page
  */
 #login-submit-wrapper {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
-    align-items: center;
+    float: right;
 }
 #lost-password-link { flex-grow: 2; }
+#login-lost-password-link {
+    margin-bottom: 10px;
+    float: right;
+}
+#div_id_remember {
+    float: left;
+}
+#id_password_wrapper {
+    margin-bottom: unset;
+}
+#login_openid {
+    clear: both;
+}
+#register-link {
+    width: 100%;
+}
 
 .mod-home.is-not-singleuser,
 .mod-login {
@@ -3166,12 +3179,21 @@ section .profile-match-wrapper {
     margin-top: 2.5%;
 }
 
+.mod-home.is-not-singleuser .login-form > #login-form,
+.mod-home.is-not-singleuser .login-form > #login-extra-links,
+.mod-login #content #login-form {
+    overflow: hidden;
+}
+.mod-home.is-not-singleuser .login-form > #login-extra-links {
+    margin-top: 4em;
+    margin-bottom: 1em;
+}
+
 .mod-home.is-not-singleuser .login-form > #login-form label,
 .mod-login #content #login-form label {
     color: #eee;
 }
 
-
 .mod-home.is-not-singleuser .login-panel-content,
 .mod-login .login-panel-content {
     background-color: rgba(255,255,255,.85);
@@ -3185,12 +3207,17 @@ section .profile-match-wrapper {
     }
 
     .mod-home.is-not-singleuser .login-form > #login-form,
+    .mod-home.is-not-singleuser .login-form > #login-extra-links,
     .mod-login #content #login-form {
         background-color: #fff;
         padding: 1em;
         position: relative;
         margin-top: 4em;
     }
+    .mod-home.is-not-singleuser .login-form > #login-extra-links {
+        margin-top: unset;
+        background-color: #8ad0a1;
+    }
 
     .mod-home.is-not-singleuser .login-form > #login-form label,
     .mod-login #content #login-form label {
diff --git a/view/theme/frio/templates/login.tpl b/view/theme/frio/templates/login.tpl
index aaa42d24b4..332ac70df5 100644
--- a/view/theme/frio/templates/login.tpl
+++ b/view/theme/frio/templates/login.tpl
@@ -8,6 +8,9 @@
 		<div id="login_standard">
 			{{include file="field_input.tpl" field=$lname}}
 			{{include file="field_password.tpl" field=$lpassword}}
+			<div id="login-lost-password-link">
+				<a href="lostpass" title="{{$lostpass|escape:'html'}}" id="lost-password-link" >{{$lostlink}}</a>
+			</div>
 		</div>
 
 		{{if $openid}}
@@ -19,10 +22,7 @@
 		{{include file="field_checkbox.tpl" field=$lremember}}
 
 		<div id="login-submit-wrapper">
-			<a href="lostpass" title="{{$lostpass|escape:'html'}}" id="lost-password-link">{{$lostlink}}</a>
-
 			<div class="pull-right" >
-				{{if $register}}<a href="register" title="{{$register.title|escape:'html'}}" id="register-link" class="btn btn-default">{{$register.desc}}</a>{{/if}}
 				<button type="submit" name="submit" id="login-submit-button" class="btn btn-primary" value="{{$login|escape:'html'}}">{{$login|escape:'html'}}</button>
 			</div>
 		</div>
@@ -35,4 +35,11 @@
 	</div>
 </form>
 
+{{if $register}}
+<div id="login-extra-links">
+	<h3 id="login-head" class="sr-only">{{$register.title|escape:'html'}}</h3>
+	<a href="register" title="{{$register.title|escape:'html'}}" id="register-link" class="btn btn-default">{{$register.desc}}</a>
+</div>
+{{/if}}
+
 <script type="text/javascript"> $(document).ready(function() { $("#id_{{$lname.0}}").focus();} );</script>