WIP of modern login page:

- Fix mobile theme login page

pixelegg/login_mobile.tpl

@@ -2,13 +2,14 @@
 
 
 <div id="loginMainDiv">
-
     <div id="divAppIconBar" style="position:relative;">
-        <div id="divLogo"><a href="{logo_url}" target="_blank"><img src="{logo_file}" border="0" alt="{logo_title}" title="{logo_title}" /></a></div>
+        <div id="divLogo">
+			<a href="{logo_url}" target="_blank"><img src="{logo_file}" border="0" alt="{logo_title}" title="{logo_title}" /></a>
+			<div id="loginScreenMessage">{lang_message}</div>
+		</div>
     </div>
     <div id="centerBox">
 		<div id="loginAvatar">{login_avatar}</div>
-        <div id="loginScreenMessage">{lang_message}</div>
         <div id="loginCdMessage" class="{cd_class}">{cd}</div>
         <form name="login_form" method="post" action="{login_url}">
             <table class="divLoginbox divSideboxEntry" cellspacing="0" cellpadding="2" border="0" align="center">
@@ -20,27 +21,8 @@
                         <input type="hidden" name="passwd_type" value="text" />
                         <input type="hidden" name="account_type" value="u" />
                     </td>
-                    <td rowspan="6">
-                        <img src="{template_set}/images/password.svg" class="passwordImage" />
-                    </td>
                 </tr>
-                <!-- BEGIN language_select -->
-                <tr>
-                    <td>{select_language}</td>
-                </tr>
-                <!-- END language_select -->
-                <!-- BEGIN domain_selection -->
-                <tr>
-                    <td>{select_domain}</td>
-                </tr>
-                <!-- END domain_selection -->
-                <!-- BEGIN remember_me_selection -->
-                <tr>
-                    <td align="right">{lang_remember_me}:&nbsp;</td>
-                    <td>{select_remember_me}</td>
-                </tr>
-                <!-- END remember_me_selection -->
-                <tr>
+				<tr>
                     <td><input name="login" tabindex="4" value="{login}" size="30" {autofocus_login} placeholder="{lang_username}"/></td>
                 </tr>
                 <tr>
@@ -54,6 +36,22 @@
                     <td><input name="new_passwd2" tabindex="7" type="password" size="30" placeholder="{lang_repeat_password}"/></td>
                 </tr>
                <!-- END change_password -->
+                <!-- BEGIN language_select -->
+                <tr>
+                    <td>{select_language}</td>
+                </tr>
+                <!-- END language_select -->
+                <!-- BEGIN domain_selection -->
+                <tr>
+                    <td>{select_domain}</td>
+                </tr>
+                <!-- END domain_selection -->
+                <!-- BEGIN remember_me_selection -->
+                <tr>
+                    <td>{select_remember_me}</td>
+                </tr>
+                <!-- END remember_me_selection -->
+
                 <tr>
                     <td>
                         <input tabindex="8" type="submit" value="  {lang_login}  " name="submitit" />
@@ -71,4 +69,9 @@
             </table>
         </form>
     </div>
+	<div id="login_footer">
+		<a href="http://www.egroupware.org" class="logo_footer">
+			<img src="pixelegg/images/login/logo.png">
+		</a>
+	</div>
 </div>

pixelegg/mobile/fw_mobile.css

@@ -6887,10 +6887,11 @@ form[id^="tracker-"] .dialogHeadbar {
   }
   div#loginMainDiv {
     background-color: #486F93;
-    width: 101%;
+    overflow: auto;
   }
   div#loginMainDiv #divAppIconBar {
-    background: white;
+    max-height: 25%;
+    height: 25%;
   }
   div#loginMainDiv #divAppIconBar #divLogo img[src$="svg"] {
     width: 40%;
@@ -6898,10 +6899,6 @@ form[id^="tracker-"] .dialogHeadbar {
     background: white;
   }
   div#loginMainDiv div#centerBox {
-    position: absolute;
-    margin: 0;
-    bottom: 0;
-    width: 100%;
     padding: 0;
     -webkit-border-top-right-radius: 0;
     -webkit-border-bottom-right-radius: 0;
@@ -6926,7 +6923,6 @@ form[id^="tracker-"] .dialogHeadbar {
   }
   div#loginMainDiv div#centerBox form table.divLoginbox {
     width: 100%;
-    float: left;
   }
   div#loginMainDiv div#centerBox form table.divLoginbox tr.hiddenCredential {
     display: none;
@@ -6934,11 +6930,12 @@ form[id^="tracker-"] .dialogHeadbar {
   div#loginMainDiv div#centerBox form table.divLoginbox input[type="submit"] {
     font-size: large;
     width: 100%;
+    padding-left: 0px;
+    border: none;
   }
   div#loginMainDiv div#centerBox form table.divLoginbox input,
   div#loginMainDiv div#centerBox form table.divLoginbox select {
     width: calc(100% - 14px);
-    height: 50px;
   }
   div#loginMainDiv div#centerBox form table.divLoginbox select {
     width: 100%;
@@ -6950,9 +6947,6 @@ form[id^="tracker-"] .dialogHeadbar {
   div#loginMainDiv div#centerBox form table.divLoginbox td.registration {
     font-size: 180%;
   }
-  div#loginMainDiv div#centerBox form table.divLoginbox td select {
-    background-size: 48px auto;
-  }
   div#loginMainDiv div#centerBox #loginCdMessage {
     font-size: 10pt !important;
     color: white;
@@ -6967,7 +6961,6 @@ form[id^="tracker-"] .dialogHeadbar {
   }
   body div#loginMainDiv div#centerBox form table.divLoginbox {
     width: 100%;
-    float: left;
   }
   body div#loginMainDiv div#centerBox form table.divLoginbox input[type="submit"] {
     font-size: large;
@@ -6976,7 +6969,6 @@ form[id^="tracker-"] .dialogHeadbar {
   body div#loginMainDiv div#centerBox form table.divLoginbox input,
   body div#loginMainDiv div#centerBox form table.divLoginbox select {
     width: calc(100% - 10px);
-    height: 50px;
   }
   body div#loginMainDiv div#centerBox form table.divLoginbox select {
     width: 100%;

pixelegg/mobile/fw_mobile.less

@@ -54,9 +54,10 @@
 	}
 	div#loginMainDiv{
 			.mob-bg-login;
-			width:101%;
+			overflow:auto;
 			#divAppIconBar {
-				background:white;
+				max-height:25%;
+				height:25%;
 				#divLogo img[src$="svg"] {
 					width:40%;
 					margin-top: 5px;
@@ -64,10 +65,6 @@
 				}
 			}
 			div#centerBox{
-				position:absolute;
-				margin: 0;
-				bottom:0;
-				width: 100%;
 				padding: 0;
 				-webkit-border-top-right-radius: 0;
 				-webkit-border-bottom-right-radius:0;
@@ -88,21 +85,20 @@
 				border-radius: 0;
 				form {
 					margin-top: 3em;
-
 					table.divLoginbox {
 						width:100%;
-						float:left;
 						tr.hiddenCredential {
 							display:none;
 						}
 						input[type="submit"] {
 							font-size: large;
 							width:100%;
+							padding-left: 0px;
+							border:none;
 
 						}
 						input, select {
 							width:~"calc(100% - 14px)";
-							height:50px;
 						}
 						select {width:100%;}
 						td {
@@ -111,9 +107,6 @@
 							&.registration{
 								font-size: 180%;
 							}
-							select {
-								background-size: 48px auto;
-							}
 						}
 					}
 				}
@@ -141,14 +134,12 @@
 				form {
 					table.divLoginbox {
 						width:100%;
-						float:left;
 						input[type="submit"] {
 							font-size: large;
 							width:100%;
 						}
 						input, select {
 							width:~"calc(100% - 10px)";
-							height:50px;
 						}
 						select {
 							width:100%;