IDEMPIERE-3518 Improvement For Mobile Compatibility

org.adempiere.base/src/org/compiere/model/MSysConfig.java

@@ -159,12 +159,15 @@ public class MSysConfig extends X_AD_SysConfig
     public static final String ZK_FOOTER_SERVER_DATETIME_FORMAT = "ZK_FOOTER_SERVER_DATETIME_FORMAT";
     public static final String ZK_FOOTER_SERVER_MSG = "ZK_FOOTER_SERVER_MSG";
     public static final String ZK_GRID_EDIT_MODELESS = "ZK_GRID_EDIT_MODELESS";
+    public static final String ZK_GRID_MOBILE_EDIT_MODELESS = "ZK_GRID_MOBILE_EDIT_MODELESS";
+    public static final String ZK_GRID_MOBILE_MAX_COLUMNS = "ZK_GRID_MOBILE_MAX_COLUMNS";
     public static final String ZK_INFO_NUM_PAGE_PRELOAD = "ZK_INFO_NUM_PAGE_PRELOAD";
     public static final String ZK_LOGIN_ALLOW_CHROME_SAVE_PASSWORD = "ZK_LOGIN_ALLOW_CHROME_SAVE_PASSWORD";
     public static final String ZK_LOGIN_ALLOW_REMEMBER_ME = "ZK_LOGIN_ALLOW_REMEMBER_ME";
     public static final String ZK_LOGO_LARGE = "ZK_LOGO_LARGE";
     public static final String ZK_LOGO_SMALL = "ZK_LOGO_SMALL";
     public static final String ZK_MAX_UPLOAD_SIZE = "ZK_MAX_UPLOAD_SIZE";
+    public static final String ZK_MOBILE_PAGING_SIZE = "ZK_MOBILE_PAGING_SIZE";
     public static final String ZK_PAGING_SIZE = "ZK_PAGING_SIZE";
     public static final String ZK_REPORT_FORM_OUTPUT_TYPE = "ZK_REPORT_FORM_OUTPUT_TYPE";
     public static final String ZK_REPORT_JASPER_OUTPUT_TYPE = "ZK_REPORT_JASPER_OUTPUT_TYPE";

org.adempiere.base/src/org/compiere/util/DisplayType.java

@@ -65,7 +65,6 @@ import java.util.logging.Level;
 
 import org.adempiere.base.IDisplayTypeFactory;
 import org.adempiere.base.Service;
-import org.compiere.model.MCurrency;
 
 /**
  *	System Display Types.
@@ -271,7 +270,7 @@ public final class DisplayType
 			|| displayType == TextLong || displayType == Memo
 			|| displayType == FilePath || displayType == FileName
 			|| displayType == URL || displayType == PrinterName
-			|| displayType == SingleSelectionGrid
+			|| displayType == SingleSelectionGrid || displayType == Color
 			|| displayType == MultipleSelectionGrid)
 			return true;
 		

org.adempiere.sdk-feature/adempiere.rmap

@@ -22,16 +22,16 @@
   <rm:locator pattern="^org\.eclipse\.jetty\.alpn\.server$" searchPathRef="bundles.maven"/>
   <rm:locator pattern="^org\.apache\.felix\.webconsole(\..+)?" searchPathRef="bundles.maven"/>
   <rm:locator pattern="^org\.apache\.felix\.inventory" searchPathRef="bundles.maven"/>
-  <rm:locator pattern="^org\.passay$" searchPathRef="bundles.maven" />
+  <rm:locator pattern="^org\.passay$" searchPathRef="bundles.maven"/>
-  <rm:locator pattern="^com\.itextpdf$" searchPathRef="bundles.maven" />
+  <rm:locator pattern="^com\.itextpdf$" searchPathRef="bundles.maven"/>
-  <rm:locator pattern="^bcpkix$" searchPathRef="bundles.maven" />
+  <rm:locator pattern="^bcpkix$" searchPathRef="bundles.maven"/>
-  <rm:locator pattern="^bcprov$" searchPathRef="bundles.maven" />
+  <rm:locator pattern="^bcprov$" searchPathRef="bundles.maven"/>
-  <rm:locator pattern="^com\.ibm\.icu$" searchPathRef="bundles.maven" />
+  <rm:locator pattern="^com\.ibm\.icu$" searchPathRef="bundles.maven"/>
-  <rm:locator pattern="^groovy-all$" searchPathRef="bundles.maven" />
+  <rm:locator pattern="^groovy-all$" searchPathRef="bundles.maven"/>
-  <rm:locator pattern="^joda-time$" searchPathRef="modify-bundle" />
+  <rm:locator pattern="^joda-time$" searchPathRef="modify-bundle"/>
-  <rm:locator pattern="^org\.cryptacular$" searchPathRef="bundles.maven" />
+  <rm:locator pattern="^org\.cryptacular$" searchPathRef="bundles.maven"/>
-  <rm:locator pattern="^net\.sf\.supercsv\.super-csv$" searchPathRef="bundles.maven" />
+  <rm:locator pattern="^net\.sf\.supercsv\.super-csv$" searchPathRef="bundles.maven"/>
-  <rm:locator pattern="^org\.atmosphere\.runtime$" searchPathRef="bundles.maven" />
+  <rm:locator pattern="^org\.atmosphere\.runtime$" searchPathRef="bundles.maven"/>
   <rm:locator pattern="^javax\.websocket\-api$" searchPathRef="bundles.maven"/>
   <rm:locator pattern="^javax\.annotation\-api$" searchPathRef="bundles.maven"/>
   <rm:locator pattern="^javax\.management\.j2ee\-api$" searchPathRef="bundles.maven"/>
@@ -63,7 +63,6 @@
   <rm:locator searchPathRef="extend.workspace" failOnError="false"/>
   <rm:locator searchPathRef="workspace.project" failOnError="false"/>
   <rm:locator searchPathRef="workspace.feature"/>
-
   <rm:searchPath name="equinox">
     <rm:provider componentTypes="osgi.bundle,eclipse.feature" readerType="p2" source="false" mutable="false">
       <rm:property key="buckminster.source" value="false"/>
@@ -155,26 +154,26 @@
         <maven:entry artifactId="org.apache.felix.inventory" groupId="org.apache.felix" name="org.apache.felix.inventory"/>
         <maven:entry artifactId="org.apache.felix.webconsole.plugins.packageadmin" groupId="org.apache.felix" name="org.apache.felix.webconsole.plugins.packageadmin"/>
         <maven:entry artifactId="javassist" groupId="org.javassist" name="javassist"/>
-        <maven:entry groupId="org.passay" artifactId="passay" name="org.passay" />
+        <maven:entry artifactId="passay" groupId="org.passay" name="org.passay"/>
-        <maven:entry groupId="com.itextpdf" artifactId="itextpdf" name="com.itextpdf" />
+        <maven:entry artifactId="itextpdf" groupId="com.itextpdf" name="com.itextpdf"/>
-        <maven:entry groupId="org.bouncycastle" artifactId="bcpkix-jdk15on" name="bcpkix" />
+        <maven:entry artifactId="bcpkix-jdk15on" groupId="org.bouncycastle" name="bcpkix"/>
-        <maven:entry groupId="org.bouncycastle" artifactId="bcprov-jdk15on" name="bcprov" />
+        <maven:entry artifactId="bcprov-jdk15on" groupId="org.bouncycastle" name="bcprov"/>
-        <maven:entry groupId="org.cryptacular" artifactId="cryptacular" name="org.cryptacular" />
+        <maven:entry artifactId="cryptacular" groupId="org.cryptacular" name="org.cryptacular"/>
-        <maven:entry groupId="net.sf.supercsv" artifactId="super-csv" name="net.sf.supercsv.super-csv" />
+        <maven:entry artifactId="super-csv" groupId="net.sf.supercsv" name="net.sf.supercsv.super-csv"/>
-        <maven:entry groupId="org.atmosphere" artifactId="atmosphere-runtime" name="org.atmosphere.runtime" />
+        <maven:entry artifactId="atmosphere-runtime" groupId="org.atmosphere" name="org.atmosphere.runtime"/>
         <maven:entry artifactId="jetty-alpn-server" groupId="org.eclipse.jetty" name="org.eclipse.jetty.alpn.server"/>
         <maven:entry artifactId="alpn-api" groupId="org.eclipse.jetty.alpn" name="org.eclipse.jetty.alpn.api"/>
-        <maven:entry groupId="org.codehaus.groovy" artifactId="groovy-all" name="groovy-all" />
+        <maven:entry artifactId="groovy-all" groupId="org.codehaus.groovy" name="groovy-all"/>
-        <maven:entry groupId="com.ibm.icu" artifactId="icu4j" name="com.ibm.icu" />
+        <maven:entry artifactId="icu4j" groupId="com.ibm.icu" name="com.ibm.icu"/>
-        <maven:entry groupId="joda-time" artifactId="joda-time" name="joda-time" />
+        <maven:entry artifactId="joda-time" groupId="joda-time" name="joda-time"/>
-	<maven:entry groupId="commons-configuration" artifactId="commons-configuration" name="org.apache.commons.configuration"/>
+        <maven:entry artifactId="commons-configuration" groupId="commons-configuration" name="org.apache.commons.configuration"/>
         <maven:entry artifactId="commons-collections4" groupId="org.apache.commons" name="org.apache.commons.collections4"/>
       </maven:mappings>
     </rm:provider>
   </rm:searchPath>
   <rm:searchPath name="zkoss.osgi">
-    <rm:provider componentTypes="osgi.bundle" readerType="p2" source="false" mutable="false">
+    <rm:provider componentTypes="osgi.bundle" readerType="p2" mutable="false">
-      <rm:property key="buckminster.source" value="false"/>
+      <rm:property key="buckminster.source" value="true"/>
       <rm:property key="buckminster.mutable" value="false"/>
       <rm:uri format="${url.zkoss.osgi}"/>
     </rm:provider>
@@ -191,61 +190,61 @@
       <rm:uri format="${extend.plugin.root}${extend.bundle.folder.1}/${buckminster.component}"/>
     </rm:provider>
     <rm:provider componentTypes="eclipse.feature" readerType="local">
-      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.1}/${buckminster.component}-feature" />
+      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.1}/${buckminster.component}-feature"/>
     </rm:provider>
     <rm:provider componentTypes="osgi.bundle,eclipse.feature" readerType="local">
       <rm:uri format="${extend.plugin.root}${extend.bundle.folder.2}/${buckminster.component}"/>
     </rm:provider>
     <rm:provider componentTypes="eclipse.feature" readerType="local">
-      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.2}/${buckminster.component}-feature" />
+      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.2}/${buckminster.component}-feature"/>
     </rm:provider>
     <rm:provider componentTypes="osgi.bundle,eclipse.feature" readerType="local">
       <rm:uri format="${extend.plugin.root}${extend.bundle.folder.3}/${buckminster.component}"/>
     </rm:provider>
     <rm:provider componentTypes="eclipse.feature" readerType="local">
-      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.3}/${buckminster.component}-feature" />
+      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.3}/${buckminster.component}-feature"/>
     </rm:provider>
     <rm:provider componentTypes="osgi.bundle,eclipse.feature" readerType="local">
       <rm:uri format="${extend.plugin.root}${extend.bundle.folder.4}/${buckminster.component}"/>
     </rm:provider>
     <rm:provider componentTypes="eclipse.feature" readerType="local">
-      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.4}/${buckminster.component}-feature" />
+      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.4}/${buckminster.component}-feature"/>
     </rm:provider>
     <rm:provider componentTypes="osgi.bundle,eclipse.feature" readerType="local">
       <rm:uri format="${extend.plugin.root}${extend.bundle.folder.5}/${buckminster.component}"/>
     </rm:provider>
     <rm:provider componentTypes="eclipse.feature" readerType="local">
-      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.5}/${buckminster.component}-feature" />
+      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.5}/${buckminster.component}-feature"/>
     </rm:provider>
     <rm:provider componentTypes="osgi.bundle,eclipse.feature" readerType="local">
       <rm:uri format="${extend.plugin.root}${extend.bundle.folder.6}/${buckminster.component}"/>
     </rm:provider>
     <rm:provider componentTypes="eclipse.feature" readerType="local">
-      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.6}/${buckminster.component}-feature" />
+      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.6}/${buckminster.component}-feature"/>
     </rm:provider>
     <rm:provider componentTypes="osgi.bundle,eclipse.feature" readerType="local">
       <rm:uri format="${extend.plugin.root}${extend.bundle.folder.7}/${buckminster.component}"/>
     </rm:provider>
     <rm:provider componentTypes="eclipse.feature" readerType="local">
-      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.7}/${buckminster.component}-feature" />
+      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.7}/${buckminster.component}-feature"/>
     </rm:provider>
     <rm:provider componentTypes="osgi.bundle,eclipse.feature" readerType="local">
       <rm:uri format="${extend.plugin.root}${extend.bundle.folder.8}/${buckminster.component}"/>
     </rm:provider>
     <rm:provider componentTypes="eclipse.feature" readerType="local">
-      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.8}/${buckminster.component}-feature" />
+      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.8}/${buckminster.component}-feature"/>
     </rm:provider>
     <rm:provider componentTypes="osgi.bundle,eclipse.feature" readerType="local">
       <rm:uri format="${extend.plugin.root}${extend.bundle.folder.9}/${buckminster.component}"/>
     </rm:provider>
     <rm:provider componentTypes="eclipse.feature" readerType="local">
-      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.9}/${buckminster.component}-feature" />
+      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.9}/${buckminster.component}-feature"/>
     </rm:provider>
     <rm:provider componentTypes="osgi.bundle,eclipse.feature" readerType="local">
       <rm:uri format="${extend.plugin.root}${extend.bundle.folder.10}/${buckminster.component}"/>
     </rm:provider>
     <rm:provider componentTypes="eclipse.feature" readerType="local">
-      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.10}/${buckminster.component}-feature" />
+      <rm:uri format="${extend.plugin.root}${extend.bundle.folder.10}/${buckminster.component}-feature"/>
     </rm:provider>
   </rm:searchPath>
 </rm:rmap>

org.adempiere.sdk-feature/materialize.properties

@@ -14,7 +14,7 @@ url.maven2.lib=http://central.maven.org
 
 url.maven.zkoss=http://mavensync.zkoss.org
 url.maven.zkoss.lib=http://mavensync.zkoss.org
-url.zkoss.osgi=http://downloads.sourceforge.net/project/idempiere/binary.file/jarfile/zk-p2/zk-8.0.1.1/
+url.zkoss.osgi=http://downloads.sourceforge.net/project/idempiere/binary.file/jarfile/zk-p2/zk-8.0.2.2/
 
 url.maven.restlet=http://maven.restlet.org
 

org.adempiere.ui.zk/META-INF/MANIFEST.MF

@@ -4,7 +4,8 @@ Bundle-Name: iDempiere Web Client
 Bundle-SymbolicName: org.adempiere.ui.zk;singleton:=true
 Bundle-Version: 4.1.0.qualifier
 Bundle-RequiredExecutionEnvironment: JavaSE-1.8
-Import-Package: javax.activation,
+Import-Package: groovy.transform.stc;version="2.4.7",
+ javax.activation,
  javax.annotation;version="1.2.0",
  javax.annotation.processing,
  javax.annotation.security;version="1.2.0",
@@ -90,3 +91,5 @@ Bundle-Activator: org.adempiere.webui.WebUIActivator
 Eclipse-ExtensibleAPI: true
 Web-ContextPath: webui
 Service-Component: OSGI-INF/reportviewerprovider.xml, OSGI-INF/defaultinfofactory.xml, OSGI-INF/defaulteditorfactory.xml, OSGI-INF/jrviewerprovider.xml, OSGI-INF/resourcefinder.xml, OSGI-INF/defaultpaymentformfactory.xml, OSGI-INF/processfactory.xml, OSGI-INF/defaultprintshippinglabel.xml, OSGI-INF/defaultcreatefromfactory.xml, OSGI-INF/defaultformfactory.xml, OSGI-INF/feedbackservice.xml, OSGI-INF/zulgadgetfactory.xml, OSGI-INF/jfgchartrenderer.xml
+Bundle-ActivationPolicy: lazy
+Eclipse-RegisterBuddy: org.idempiere.zk.extra

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/AdempiereWebUI.java

@@ -118,7 +118,6 @@ public class AdempiereWebUI extends Window implements EventListener<Event>, IWeb
 
     public AdempiereWebUI()
     {
-    	this.addEventListener(Events.ON_CLIENT_INFO, this);
     	this.setVisible(false);
 
     	userPreference = new UserPreference();
@@ -146,6 +145,7 @@ public class AdempiereWebUI extends Window implements EventListener<Event>, IWeb
         {
             loginDesktop = new WLogin(this);
             loginDesktop.createPart(this.getPage());
+            loginDesktop.getComponent().getRoot().addEventListener(Events.ON_CLIENT_INFO, this);
         }
         else
         {
@@ -176,6 +176,7 @@ public class AdempiereWebUI extends Window implements EventListener<Event>, IWeb
     {
     	if (loginDesktop != null)
     	{
+    		loginDesktop.getComponent().getRoot().removeEventListener(Events.ON_CLIENT_INFO, this);
     		loginDesktop.detach();
     		loginDesktop = null;
     	}
@@ -255,6 +256,7 @@ public class AdempiereWebUI extends Window implements EventListener<Event>, IWeb
 		appDesktop.setClientInfo(clientInfo);
 		appDesktop.createPart(this.getPage());
 		this.getPage().getDesktop().setAttribute(APPLICATION_DESKTOP_KEY, new WeakReference<IDesktop>(appDesktop));
+		appDesktop.getComponent().getRoot().addEventListener(Events.ON_CLIENT_INFO, this);
 		
 		//track browser tab per session
 		SessionContextListener.addDesktopId(mSession.getAD_Session_ID(), getPage().getDesktop().getId());
@@ -442,13 +444,15 @@ public class AdempiereWebUI extends Window implements EventListener<Event>, IWeb
 			clientInfo.desktopYOffset = c.getDesktopYOffset();
 			clientInfo.orientation = c.getOrientation();
 			clientInfo.timeZone = c.getTimeZone();			
-			IDesktop appDesktop = getAppDeskop();
-			if (appDesktop != null)
-				appDesktop.setClientInfo(clientInfo);
 			String ua = Servlets.getUserAgent((ServletRequest) Executions.getCurrent().getNativeRequest());
 			clientInfo.userAgent = ua;
 			ua = ua.toLowerCase();
-			clientInfo.tablet = Executions.getCurrent().getBrowser("mobile") !=null;
+			clientInfo.tablet = false;
+			if (Executions.getCurrent().getBrowser("mobile") !=null) {
+				clientInfo.tablet = true;
+			} else if (ua.contains("ipad") || ua.contains("iphone") || ua.contains("android")) {
+				clientInfo.tablet = true;
+			}
 			if (getDesktop() != null && getDesktop().getSession() != null) {
 				getDesktop().getSession().setAttribute(CLIENT_INFO, clientInfo);
 			}
@@ -457,6 +461,11 @@ public class AdempiereWebUI extends Window implements EventListener<Event>, IWeb
 			Env.setContext(Env.getCtx(), "#clientInfo_desktopHeight", clientInfo.desktopHeight);
 			Env.setContext(Env.getCtx(), "#clientInfo_orientation", clientInfo.orientation);
 			Env.setContext(Env.getCtx(), "#clientInfo_mobile", clientInfo.tablet);
+			
+			IDesktop appDesktop = getAppDeskop();
+			if (appDesktop != null)
+				appDesktop.setClientInfo(clientInfo);
+
 		}
 
 	}
@@ -469,6 +478,7 @@ public class AdempiereWebUI extends Window implements EventListener<Event>, IWeb
 		loginDesktop = new WLogin(this);
         loginDesktop.createPart(this.getPage());
         loginDesktop.changeRole(locale, properties);
+        loginDesktop.getComponent().getRoot().addEventListener(Events.ON_CLIENT_INFO, this);
 		
 	}
 

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/ClientInfo.java

@@ -19,6 +19,14 @@ package org.adempiere.webui;
 import java.io.Serializable;
 import java.util.TimeZone;
 
+import org.adempiere.webui.session.SessionManager;
+import org.compiere.util.Env;
+import org.zkoss.zk.ui.Component;
+import org.zkoss.zk.ui.event.Event;
+import org.zkoss.zk.ui.event.EventListener;
+import org.zkoss.zk.ui.event.Events;
+import org.zkoss.zk.ui.sys.ComponentCtrl;
+
 /**
  * 
  * @author Low Heng Sin
@@ -43,6 +51,16 @@ public class ClientInfo implements Serializable {
 	public boolean tablet;
 	public double devicePixelRatio;
 	
+	public static final int LARGE_WIDTH = 1200;
+	public static final int MEDIUM_WIDTH = 1000;
+	public static final int SMALL_WIDTH = 700;
+	public static final int EXTRA_SMALL_WIDTH = 500;
+	
+	public static final int LARGE_HEIGHT = 1000;
+	public static final int MEDIUM_HEIGHT = 700;
+	public static final int SMALL_HEIGHT = 500;
+	public static final int EXTRA_SMALL_HEIGHT = 360;
+	
 	@Override
 	public String toString() {
 		StringBuilder builder = new StringBuilder();
@@ -74,5 +92,69 @@ public class ClientInfo implements Serializable {
 		return builder.toString();
 	}
 
+	/**
+	 * @return true if mobile browser
+	 */
+	public static boolean isMobile() {
+		return "Y".equals(Env.getContext(Env.getCtx(), "#clientInfo_mobile"));
+	}
 
+	/**
+	 * @return the current clientinfo instance
+	 */
+	public static ClientInfo get() {
+		return SessionManager.getAppDesktop().getClientInfo();
+	}
+	
+	/**
+	 * 
+	 * @param minWidth
+	 * @return true if desktopWidth >= minWidth
+	 */
+	public static boolean minWidth(int minWidth) {
+		return ClientInfo.get().desktopWidth > 0 && ClientInfo.get().desktopWidth >= minWidth;
+	}
+	
+	/**
+	 * 
+	 * @param maxWidth
+	 * @return true if desktopWidth <= maxWidth
+	 */
+	public static boolean maxWidth(int maxWidth) {
+		return ClientInfo.get().desktopWidth > 0 && ClientInfo.get().desktopWidth <= maxWidth;
+	}	
+	
+	/**
+	 * 
+	 * @param minHeight
+	 * @return true if desktopHeight >= minHeight
+	 */
+	public static boolean minHeight(int minHeight) {
+		return ClientInfo.get().desktopHeight > 0 && ClientInfo.get().desktopHeight >= minHeight;
+	}
+	
+	/**
+	 * 
+	 * @param maxHeight
+	 * @return true if desktopHeight <= maxHeight
+	 */
+	public static boolean maxHeight(int maxHeight) {
+		return ClientInfo.get().desktopHeight > 0 && ClientInfo.get().desktopHeight <= maxHeight;
+	}
+
+	private static String AFTER_PAGE_DETACHED = "afterPageDetached";
+	
+	/**
+	 * Call runnable on client info update
+	 * @param component
+	 * @param runnable
+	 */
+	public static void onClientInfo(Component component, Runnable runnable) {
+		ComponentCtrl ctrl = (ComponentCtrl) component;		
+		EventListener<Event> eventListener = evt -> runnable.run();
+		
+		Component root = SessionManager.getAppDesktop().getComponent().getRoot();
+		root.addEventListener(Events.ON_CLIENT_INFO, eventListener);
+		ctrl.addCallback(AFTER_PAGE_DETACHED, t -> root.removeEventListener(Events.ON_CLIENT_INFO, eventListener));
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/LayoutUtils.java

@@ -14,6 +14,8 @@ package org.adempiere.webui;
 
 import java.io.IOException;
 import java.io.StringWriter;
+import java.util.ArrayList;
+import java.util.List;
 
 import org.adempiere.webui.component.Label;
 import org.adempiere.webui.component.Mask;
@@ -26,9 +28,18 @@ import org.zkoss.zk.au.out.AuScript;
 import org.zkoss.zk.ui.AbstractComponent;
 import org.zkoss.zk.ui.Component;
 import org.zkoss.zk.ui.HtmlBasedComponent;
+import org.zkoss.zk.ui.event.EventListener;
+import org.zkoss.zk.ui.event.Events;
+import org.zkoss.zk.ui.event.OpenEvent;
 import org.zkoss.zk.ui.util.Clients;
 import org.zkoss.zul.Borderlayout;
+import org.zkoss.zul.Cell;
 import org.zkoss.zul.Div;
+import org.zkoss.zul.Grid;
+import org.zkoss.zul.LayoutRegion;
+import org.zkoss.zul.Row;
+import org.zkoss.zul.Rows;
+import org.zkoss.zul.Space;
 import org.zkoss.zul.Window;
 import org.zkoss.zul.Window.Mode;
 
@@ -92,13 +103,21 @@ public final class LayoutUtils {
 		return div;
 	}
 
+	public static void openPopupWindow(Component ref, Window window) {
+		openPopupWindow(ref, window, 0);
+	}
+	
 	/**
 	 * open popup window overlapping the ref component
 	 * @param ref
 	 * @param window
 	 */
-	public static void openPopupWindow(Component ref, Window window) {
+	public static void openPopupWindow(Component ref, Window window, int delayMs) {
-		openPopupWindow(ref, window, "overlap");
+		openPopupWindow(ref, window, "overlap", delayMs);
+	}
+	
+	public static void openPopupWindow(Component ref, Window window, String position) {
+		openPopupWindow(ref, window, position, 0);
 	}
 	
 	/**
@@ -107,17 +126,24 @@ public final class LayoutUtils {
 	 * @param window
 	 * @param position
 	 */
-	public static void openPopupWindow(Component ref, Window window, String position) {
+	public static void openPopupWindow(Component ref, Window window, String position, int delayMs) {
 		if (window.getPage() == null)
 			window.setPage(ref.getPage());
 		StringBuilder script = new StringBuilder();
+		if (delayMs > 0) {
+			script.append("setTimeout(function() { ");
+		}
 		script.append("_idempiere_popup_window('#")
 			.append(ref.getUuid())
 			.append("','#")
 			.append(window.getUuid())
 			.append("','")
 			.append(position)
-			.append("');");
+			.append("'); ");
+		script.append("zk.Widget.$('#").append(window.getUuid()).append("').focus(); ");
+		if (delayMs > 0) {
+			script.append(" }, ").append(delayMs).append(");");
+		}
 		window.doPopup();
 		Clients.response("_openPopupWindow_", new AuScript(window, script.toString()));
 		window.focus();
@@ -318,4 +344,135 @@ public final class LayoutUtils {
 		}
 		return trueParent;
 	}
+	
+	/**
+	 * Compact grid to limit (for e.g, to max of 2 column)
+	 * Note: doesn't handle row span
+	 * @param grid
+	 * @param limit
+	 */
+	public static void compactTo(Grid grid, int limit) {
+		Rows rows = grid.getRows();
+		if (rows == null) return;
+		Row currentRow = (Row)rows.getFirstChild();
+		while (currentRow != null) {
+			int size = 0;
+			int extraStart = 0;
+			for (Component component : currentRow.getChildren()) {
+				if (component instanceof Cell) {
+					Cell cell = (Cell) component;
+					size += cell.getColspan();
+				} else {
+					size++;
+				}
+				if (size > limit && extraStart == 0)
+					extraStart = currentRow.getChildren().indexOf(component);
+			}
+			Row nextRow = (Row) currentRow.getNextSibling();
+			if (size > limit) {
+				List<Component> extras = new ArrayList<>();
+				for(int i = extraStart; i < currentRow.getChildren().size(); i++) {
+					extras.add(currentRow.getChildren().get(i));
+				}				
+				org.adempiere.webui.component.Row newRow = new org.adempiere.webui.component.Row();
+				int spanOffset = 0;
+				while (!extras.isEmpty()) {
+					Component component = extras.remove(0);
+					if (component instanceof Cell) {
+						spanOffset += (((Cell)component).getColspan()-1);
+					}
+					newRow.appendChild(component);
+					if (newRow.getChildren().size()+spanOffset >= limit) {
+						if (nextRow != null)
+							rows.insertBefore(newRow, nextRow);
+						else
+							rows.appendChild(newRow);
+						newRow = new org.adempiere.webui.component.Row();
+					}
+				}
+				if (newRow.getChildren().size() > 0) {
+					if (nextRow != null)
+						rows.insertBefore(newRow, nextRow);
+					else
+						rows.appendChild(newRow);
+				}				
+			}
+			currentRow = nextRow;
+		}
+	}
+	
+	public static void expandTo(Grid grid, int min) {
+		expandTo(grid, min, false);
+	}
+	
+	/**
+	 * Expand grid to min (for e.g, to min of 2 column)
+	 * Note: doesn't handle row span
+	 * @param grid
+	 * @param min
+	 * @param fillWithSpace if true, fill up row with space instead of 
+	 * moving element from next row
+	 */
+	public static void expandTo(Grid grid, int min, boolean fillWithSpace) {
+		Rows rows = grid.getRows();
+		if (rows == null) return;
+		Row currentRow = (Row)rows.getFirstChild();
+		while (currentRow != null) {
+			int size = 0;
+			for (Component component : currentRow.getChildren()) {
+				if (component instanceof Cell) {
+					Cell cell = (Cell) component;
+					size += cell.getColspan();
+				} else {
+					size++;
+				}
+			}
+			Row nextRow = (Row) currentRow.getNextSibling();
+			if (size < min) {
+				if (fillWithSpace) {
+					Cell cell = new Cell();
+					cell.setColspan(min-size);
+					cell.appendChild(new Space());
+					currentRow.appendChild(cell);
+				} else {
+					while (size < min && nextRow != null) {
+						List<Component> toAdd = new ArrayList<>();
+						for (Component c : nextRow.getChildren()) {
+							toAdd.add(c);
+							if (c instanceof Cell)
+								size += ((Cell)c).getColspan();
+							else
+								size++;
+							if (size >= min)
+								break;
+						}
+						for(Component c : toAdd) {
+							currentRow.appendChild(c);
+						}					
+					}
+					if (nextRow != null && nextRow.getChildren().isEmpty()) {
+						nextRow.detach();
+						continue;
+					}
+				}
+			}
+			currentRow = nextRow;
+		}
+	}
+	
+	private static final EventListener<OpenEvent> addSlideEventListener = (OpenEvent evt) -> {
+		if (evt.isOpen())
+			LayoutUtils.removeSclass("slide", (HtmlBasedComponent) evt.getTarget());
+		else
+			LayoutUtils.addSclass("slide", (HtmlBasedComponent) evt.getTarget());
+		evt.getTarget().invalidate();
+	};
+	
+	/**
+	 * enable slide sclass ( when slide out ) for collapsible region
+	 * @param region
+	 */
+	public static void addSlideSclass(LayoutRegion region) {
+		region.addEventListener(Events.ON_OPEN, addSlideEventListener);
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/ValuePreference.java

@@ -34,6 +34,7 @@ import org.adempiere.webui.component.Rows;
 import org.adempiere.webui.component.Textbox;
 import org.adempiere.webui.component.Window;
 import org.adempiere.webui.component.ZkCssHelper;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.adempiere.webui.window.FDialog;
 import org.compiere.model.GridField;
@@ -391,8 +392,11 @@ public class ValuePreference extends Window implements EventListener<Event>
 		setLayout.makeNoStrip();
 		setLayout.setOddRowSclass("even");
 			
-		ZKUpdateUtil.setWidth(this, "500px");
+		if (!ThemeManager.isUseCSSForWindowSize()) {			
+			ZKUpdateUtil.setWindowWidthX(this, 500);
+		}
 		this.setSizable(true);
+		this.setSclass("value-preference-dialog");
 	}   //  jbInit
 
 	/**

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/WLogin.java

@@ -17,11 +17,14 @@ package org.adempiere.webui;
 import java.util.Locale;
 import java.util.Properties;
 
+import javax.servlet.ServletRequest;
+
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.part.AbstractUIPart;
 import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.adempiere.webui.window.LoginWindow;
+import org.zkoss.web.servlet.Servlets;
 import org.zkoss.zhtml.Text;
 import org.zkoss.zk.ui.Component;
 import org.zkoss.zk.ui.Executions;
@@ -79,7 +82,15 @@ public class WLogin extends AbstractUIPart
         	browserWarningWindow.doOverlapped();
         }
         
-        boolean mobile = Executions.getCurrent().getBrowser("mobile") !=null;
+        boolean mobile = false;        
+		if (Executions.getCurrent().getBrowser("mobile") !=null) {
+			mobile = true;
+		} else {
+			String ua = Servlets.getUserAgent((ServletRequest) Executions.getCurrent().getNativeRequest());
+			ua = ua.toLowerCase();
+			if (ua.contains("ipad") || ua.contains("iphone") || ua.contains("android"))
+				mobile = true;
+		}
     	
         West west = layout.getWest();
         if (west.getFirstChild() != null && west.getFirstChild().getFirstChild() != null) {

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/acct/WAcctViewer.java

@@ -25,6 +25,7 @@ import java.util.List;
 import java.util.logging.Level;
 
 import org.adempiere.util.Callback;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Checkbox;
@@ -537,6 +538,8 @@ public class WAcctViewer extends Window implements EventListener<Event>
 		ZKUpdateUtil.setHflex(table, "1");
 		//ZKUpdateUtil.setVflex(table, "1");
 		table.addEventListener(Events.ON_DOUBLE_CLICK, this);
+		if (ClientInfo.isMobile())
+			table.setSizedByContent(true);
 
 		pagingPanel = new South();
 		resultPanel.appendChild(pagingPanel);

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/adwindow/ADTabpanel.java

@@ -17,6 +17,8 @@
 
 package org.adempiere.webui.adwindow;
 
+import java.math.RoundingMode;
+import java.text.DecimalFormat;
 import java.util.ArrayList;
 import java.util.HashMap;
 import java.util.Iterator;
@@ -176,13 +178,13 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
 
     private GridView		  listPanel;
 
-    private Map<String, List<Row>> fieldGroupContents = new HashMap<String, List<Row>>();
+    private Map<String, List<Row>> fieldGroupContents;
 
-    private Map<String, List<org.zkoss.zul.Row>> fieldGroupHeaders = new HashMap<String, List<org.zkoss.zul.Row>>();
+    private Map<String, List<org.zkoss.zul.Row>> fieldGroupHeaders;
 
 	private ArrayList<Row> rowList;
 
-	List<Group> allCollapsibleGroups = new ArrayList<Group>();
+	List<Group> allCollapsibleGroups;
 
 	private Borderlayout formContainer = null;
 
@@ -203,6 +205,8 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
 	/** DefaultFocusField		*/
 	private WEditor	defaultFocusField = null;
 
+	private int numberOfFormColumns;
+
 	public static final String ON_TOGGLE_EVENT = "onToggle";
 	
 	private static enum SouthEvent {
@@ -232,6 +236,8 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
 		});
         addEventListener(ON_POST_INIT_EVENT, this);
         addEventListener(ON_SAVE_OPEN_PREFERENCE_EVENT, this);
+        if (ClientInfo.isMobile())
+        	ClientInfo.onClientInfo(this, this::onClientInfo);
     }
 
     private void initComponents()
@@ -260,13 +266,10 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
 		South south = borderLayout.getSouth();
 		if (south == null) {			
 			south = new South();
+			LayoutUtils.addSlideSclass(south);
 			borderLayout.appendChild(south);
-			south.setWidgetOverride("doClick_", "function (evt){this.$supers('doClick_', arguments);" +
-					"var target = evt.domTarget;if (!target.id) target = target.parentNode;" +
-					"if(this.$n('colled') == target) {" +
-					"var se = new zk.Event(this, 'onSlide', null, {toServer: true}); zAu.send(se); } }");
 			south.addEventListener(Events.ON_OPEN, this);
-			south.addEventListener("onSlide", this);
+			south.addEventListener(Events.ON_SLIDE, this);
 			
 			south.addEventListener(Events.ON_SWIPE, new EventListener<SwipeEvent>() {
 
@@ -277,7 +280,8 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
 						South south = borderLayout.getSouth();
 						if (south.isOpen()) {
 							south.setOpen(false);
-							onSouthEvent(SouthEvent.CLOSE);
+							OpenEvent openEvent = new OpenEvent(Events.ON_OPEN, south, false);
+							Events.postEvent(openEvent);
 						}
 					}
 				}
@@ -290,6 +294,8 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
 		south.setSplittable(true);
 		south.setOpen(isOpenDetailPane());		
 		south.setSclass("adwindow-gridview-detail");
+		if (!south.isOpen())
+			LayoutUtils.addSclass("slide", south);
 		String height = heigthDetailPane();
 		if (! Util.isEmpty(height)) {
 			try {
@@ -367,6 +373,11 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
 			west.setSplittable(true);
 			west.setAutoscroll(true);
 			layout.appendChild(west);
+			LayoutUtils.addSlideSclass(west);
+			if (isMobile()) {
+				west.setOpen(false);
+				LayoutUtils.addSclass("slide", west);
+			}
 
 			Center center = new Center();
 			Vlayout div = new Vlayout();
@@ -416,26 +427,70 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
     @Override
     public void createUI()
     {
-    	if (uiCreated) return;
+    	createUI(false);
+    }
     
-    	uiCreated = true;
+    protected void createUI(boolean update)
+    {
+    	if (update) 
+    	{
+    		if (!uiCreated) return;
+    	}
+    	else
+    	{
+    		if (uiCreated) return;
+    		uiCreated = true;
+    	}
+    	
+    	fieldGroupContents = new HashMap<String, List<Row>>();
+    	fieldGroupHeaders = new HashMap<String, List<org.zkoss.zul.Row>>();
+    	allCollapsibleGroups = new ArrayList<Group>();
     	
     	int numCols=gridTab.getNumColumns();
     	if (numCols <= 0) {
-    		numCols=4;
+    		numCols=6;
     	}
 
+		//adapt layout for phone and tablet
+		int diff = 0;
+		if (isMobile())
+		{
+			if (ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH-1)) {
+	    		if (numCols > 3) {
+	    			diff = numCols - 3;
+	    			numCols=3;
+	    		}
+	    	} else if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1)) {
+	    		if (numCols > 6) {
+	    			diff = numCols - 6;
+	    			numCols=6;
+	    		}
+	    	}
+		}
+    	
+    	this.numberOfFormColumns = numCols;
+    	
+    	if (update)
+    		form.getColumns().detach();
     	// set size in percentage per column leaving a MARGIN on right
     	Columns columns = new Columns();    	
     	form.appendChild(columns);
-    	int equalWidth = 98 / numCols;
+    	double equalWidth = 95.00d / numCols;
+    	DecimalFormat decimalFormat = new DecimalFormat("0.00");
+    	decimalFormat.setRoundingMode(RoundingMode.DOWN);
+    	String columnWidth = decimalFormat.format(equalWidth);
 
     	for (int h=0;h<numCols;h++){
     		Column col = new Column();
-    		ZKUpdateUtil.setWidth(col, equalWidth + "%");
+    		ZKUpdateUtil.setWidth(col, columnWidth + "%");
     		columns.appendChild(col);
     	}
 
+    	if (update) {
+    		form.getRows().detach();
+    		rowList = null;
+    		currentGroup = null;
+    	}
     	Rows rows = form.newRows();
         GridField fields[] = gridTab.getFields();
         Row row = new Row();
@@ -449,17 +504,23 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
         		continue;
 
         	if (field.isToolbarButton()) {
-        		WButtonEditor editor = (WButtonEditor) WebEditorFactory.getEditor(gridTab, field, false);
+        		WButtonEditor editor = null;
+        		if (update)
+        			editor = (WButtonEditor) findEditor(field);
+        		else
+        			editor = (WButtonEditor) WebEditorFactory.getEditor(gridTab, field, false);
 
         		if (editor != null) {
-        			if (windowPanel != null)
+        			if (!update) {
-    					editor.addActionListener(windowPanel);
+	        			if (windowPanel != null)
-        			editor.setGridTab(this.getGridTab());
+	    					editor.addActionListener(windowPanel);
-        			editor.setADTabpanel(this);
+	        			editor.setGridTab(this.getGridTab());
-        			field.addPropertyChangeListener(editor);
+	        			editor.setADTabpanel(this);
-        			editors.add(editor);
+	        			field.addPropertyChangeListener(editor);
-        			editor.getComponent().setId(field.getColumnName());
+	        			editors.add(editor);
-        			toolbarButtonEditors.add(editor);
+	        			editor.getComponent().setId(field.getColumnName());
+	        			toolbarButtonEditors.add(editor);
+        			}
                 	if (field.isToolbarOnlyButton())
                 		continue;
         		}
@@ -522,8 +583,18 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
         		actualxpos = 0;
         	}
 
+        	int xpos = field.getXPosition();
+        	if (xpos > numCols && diff > 0)
+        	{
+        		xpos = xpos - diff;
+        		if (xpos <= 0)
+        			xpos = 1;
+        		if (xpos == 1 && (field.getDisplayType() == DisplayType.YesNo || field.getDisplayType() == DisplayType.Button || field.isFieldOnly()))
+        			xpos = 2;
+        	}
+        	
 			//normal field
-        	if (field.getXPosition() <= actualxpos) {
+        	if (xpos <= actualxpos) {
         		// Fill right part of the row with spacers until number of columns
         		if (numCols - actualxpos + 1 > 0)
         			row.appendCellChild(createSpacer(), numCols - actualxpos + 1);
@@ -535,29 +606,32 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
         		actualxpos = 0;
         	}
     		// Fill left part of the field
-        	if (field.getXPosition()-1 - actualxpos > 0)
+        	if (xpos-1 - actualxpos > 0)
-        		row.appendCellChild(createSpacer(), field.getXPosition()-1 - actualxpos);
+        		row.appendCellChild(createSpacer(), xpos-1 - actualxpos);
         	boolean paintLabel = ! (field.getDisplayType() == DisplayType.Button || field.getDisplayType() == DisplayType.YesNo || field.isFieldOnly()); 
         	if (field.isHeading())
-        		actualxpos = field.getXPosition();
+        		actualxpos = xpos;
         	else
-        		actualxpos = field.getXPosition() + field.getColumnSpan()-1 + (paintLabel ? 1 : 0);
+        		actualxpos = xpos + field.getColumnSpan()-1 + (paintLabel ? 1 : 0);
 
         	if (! field.isHeading()) {
 
-        		WEditor editor = WebEditorFactory.getEditor(gridTab, field, false);
+        		WEditor editor = update ? findEditor(field) : WebEditorFactory.getEditor(gridTab, field, false);
 
         		if (editor != null) // Not heading
         		{
-        			editor.getComponent().setWidgetOverride("fieldHeader", HelpController.escapeJavascriptContent(field.getHeader()));
+        			if (!update)
-        			editor.getComponent().setWidgetOverride("fieldDescription", HelpController.escapeJavascriptContent(field.getDescription()));
+        			{
-        			editor.getComponent().setWidgetOverride("fieldHelp", HelpController.escapeJavascriptContent(field.getHelp()));
+        				editor.getComponent().setWidgetOverride("fieldHeader", HelpController.escapeJavascriptContent(field.getHeader()));
-        			editor.getComponent().setWidgetListener("onFocus", "zWatch.fire('onFieldTooltip', this, null, this.fieldHeader(), this.fieldDescription(), this.fieldHelp());");
+        				editor.getComponent().setWidgetOverride("fieldDescription", HelpController.escapeJavascriptContent(field.getDescription()));
+        				editor.getComponent().setWidgetOverride("fieldHelp", HelpController.escapeJavascriptContent(field.getHelp()));
+        				editor.getComponent().setWidgetListener("onFocus", "zWatch.fire('onFieldTooltip', this, null, this.fieldHeader(), this.fieldDescription(), this.fieldHelp());");
         			
-        			editor.setGridTab(this.getGridTab());
+        				editor.setGridTab(this.getGridTab());
-        			field.addPropertyChangeListener(editor);
+        				field.addPropertyChangeListener(editor);
-        			editors.add(editor);
+        				editors.add(editor);
-        			editorComps.add(editor.getComponent());
+        				editorComps.add(editor.getComponent());
+        			}
         			if (paintLabel) {
         				Div div = new Div();
         				div.setSclass("form-label");
@@ -571,56 +645,70 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
         			//to support float/absolute editor
         			row.getLastCell().setStyle("position: relative; overflow: visible;");
 
-        			if (editor instanceof WButtonEditor)
+        			if (!update)
         			{
-        				if (windowPanel != null)
+	        			if (editor instanceof WButtonEditor)
-        					((WButtonEditor)editor).addActionListener(windowPanel);
+	        			{
-        			}
+	        				if (windowPanel != null)
-        			else
+	        					((WButtonEditor)editor).addActionListener(windowPanel);
-        			{
+	        			}
-        				editor.addValueChangeListener(dataBinder);
+	        			else
+	        			{
+	        				editor.addValueChangeListener(dataBinder);
+	        			}
         			}
         			
         			//	Default Focus
         			if (defaultFocusField == null && field.isDefaultFocus())
         				defaultFocusField = editor;
 
-        			//stretch component to fill grid cell
+        			if (!update)
-        			editor.fillHorizontal();
-        			
-        			Component fellow = editor.getComponent().getFellowIfAny(field.getColumnName());
-        			if (fellow == null) {
-        				editor.getComponent().setId(field.getColumnName());
-        			}
-
-        			//setup editor context menu
-        			WEditorPopupMenu popupMenu = editor.getPopupMenu();
-        			if (popupMenu == null) 
         			{
-        				popupMenu = new WEditorPopupMenu(false, false, false, false, false, false, null);
+	        			//stretch component to fill grid cell
-        				popupMenu.addSuggestion(field);
+	        			editor.fillHorizontal();
-        			}
-        			if (popupMenu != null)
-        			{
-        				if (editor instanceof ContextMenuListener)
-        					popupMenu.addMenuListener((ContextMenuListener)editor);
-        				popupMenu.setId(field.getColumnName()+"-popup");
-        				this.appendChild(popupMenu);
-        				if (!field.isFieldOnly())
-        				{
-        					Label label = editor.getLabel();
-        					if (popupMenu.isZoomEnabled() && editor instanceof IZoomableEditor)
-        					{
-        						label.addEventListener(Events.ON_CLICK, new ZoomListener((IZoomableEditor) editor));
-        					}
 	        			
-        					popupMenu.addContextElement(label);
+	        			Component fellow = editor.getComponent().getFellowIfAny(field.getColumnName());
-        					if (editor.getComponent() instanceof XulElement) 
+	        			if (fellow == null) {
-        					{
+	        				editor.getComponent().setId(field.getColumnName());
-        						popupMenu.addContextElement((XulElement) editor.getComponent());
+	        			}
-        					}
+	
-        				} 
+	        			//setup editor context menu
-        				popupMenu.addSuggestion(field);
+	        			WEditorPopupMenu popupMenu = editor.getPopupMenu();
+	        			if (popupMenu == null) 
+	        			{
+	        				popupMenu = new WEditorPopupMenu(false, false, false, false, false, false, null);
+	        				popupMenu.addSuggestion(field);
+	        			}
+	        			if (popupMenu != null)
+	        			{
+	        				if (editor instanceof ContextMenuListener)
+	        					popupMenu.addMenuListener((ContextMenuListener)editor);
+	        				popupMenu.setId(field.getColumnName()+"-popup");
+	        				this.appendChild(popupMenu);
+	        				if (!field.isFieldOnly())
+	        				{
+	        					Label label = editor.getLabel();
+	        					if (ClientInfo.isMobile())
+	        					{
+	        						WEditorPopupMenu finalPopupMenu = popupMenu;
+	        						label.addEventListener(Events.ON_CLICK, evt-> finalPopupMenu.open(label, "after_start"));
+	        					}
+	        					else
+	        					{
+		        					if (popupMenu.isZoomEnabled() && editor instanceof IZoomableEditor)
+		        					{
+		        						label.addEventListener(Events.ON_CLICK, new ZoomListener((IZoomableEditor) editor));
+		        					}
+		
+		        					popupMenu.addContextElement(label);
+		        					if (editor.getComponent() instanceof XulElement) 
+		        					{
+		        						popupMenu.addContextElement((XulElement) editor.getComponent());
+		        					}
+	        					}
+	        				} 
+	        				popupMenu.addSuggestion(field);
+	        			}      
         			}
         		}
         	}
@@ -643,10 +731,11 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
         if (rowList != null)
 			rowList.add(row);
 
-        loadToolbarButtons();
+        if (!update)
+        	loadToolbarButtons();
         		
         //create tree
-        if (gridTab.isTreeTab() && treePanel != null) {
+        if (!update && gridTab.isTreeTab() && treePanel != null) {
         	int AD_Tree_ID = Env.getContextAsInt (Env.getCtx(), getWindowNo(), "AD_Tree_ID", true);
         	int AD_Tree_ID_Default = MTree.getDefaultAD_Tree_ID (Env.getAD_Client_ID(Env.getCtx()), gridTab.getKeyColumnName());
         	
@@ -659,10 +748,18 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
     		}        	
         }
 
-        if (!gridTab.isSingleRow() && !isGridView())
+        if (!update && !gridTab.isSingleRow() && !isGridView())
         	switchRowPresentation();                
     }
 
+	private WEditor findEditor(GridField field) {
+		for(WEditor editor : editors) {
+			if (editor.getGridField() == field)
+				return editor;
+		}
+		return null;
+	}
+
 	private void loadToolbarButtons() {
 		//get extra toolbar process buttons
         MToolBarButton[] mToolbarButtons = MToolBarButton.getProcessButtonOfTab(gridTab.getAD_Tab_ID(), null);
@@ -1027,7 +1124,8 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
         } else {
         	if (activate) {
         		formContainer.setVisible(activate);
-        		focusToFirstEditor();
+        		if (!isMobile())
+        			focusToFirstEditor();
         	}
         }
 
@@ -1163,6 +1261,8 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
     }
     
     private boolean isOpenDetailPane() {
+    	if (isMobile())
+    		return false;
     	boolean open = true;
     	int windowId = getGridTab().getAD_Window_ID();
 		int adTabId = getGridTab().getAD_Tab_ID();
@@ -1517,7 +1617,7 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
 
 	@Override
 	public void focus() {
-		if (form.isVisible())
+		if (form.isVisible() && !isMobile())
 			this.focusToFirstEditor(true);
 		else
 			listPanel.focus();
@@ -1787,6 +1887,31 @@ DataStatusListener, IADTabpanel, IdSpace, IFieldEditorContainer
 		super.onPageDetached(page);
 	}
 	
+	protected void onClientInfo() {
+		if (!uiCreated || gridTab == null) return;
+		int numCols=gridTab.getNumColumns();
+    	if (numCols <= 0) {
+    		numCols=6;
+    	}
+
+    	if (ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH-1)) {
+    		if (numCols > 3) {
+    			numCols=3;
+    		}
+    	} else if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1)) {
+    		if (numCols > 6) {
+    			numCols=6;
+    		}
+    	}
+		if (numCols > 0 && numCols != numberOfFormColumns) {
+			createUI(true);
+			dynamicDisplay(0);
+		}
+	};
+	
+	protected boolean isMobile() {
+		return ClientInfo.isMobile();
+	}
 	@Override
 	public void editorTraverse(Callback<WEditor> editorTaverseCallback) {
 		editorTraverse(editorTaverseCallback, editors);

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/adwindow/ADWindowToolbar.java

@@ -26,6 +26,7 @@ import java.util.Map;
 import java.util.logging.Level;
 
 import org.adempiere.base.IServiceHolder;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.action.Actions;
 import org.adempiere.webui.action.IAction;
@@ -50,11 +51,15 @@ import org.zkoss.zk.au.out.AuScript;
 import org.zkoss.zk.ui.Component;
 import org.zkoss.zk.ui.Executions;
 import org.zkoss.zk.ui.Page;
+import org.zkoss.zk.ui.event.AfterSizeEvent;
 import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
 import org.zkoss.zk.ui.event.Events;
 import org.zkoss.zk.ui.event.KeyEvent;
+import org.zkoss.zk.ui.event.OpenEvent;
 import org.zkoss.zk.ui.util.Clients;
+import org.zkoss.zul.A;
+import org.zkoss.zul.Popup;
 import org.zkoss.zul.Separator;
 import org.zkoss.zul.Space;
 import org.zkoss.zul.Toolbarbutton;
@@ -132,6 +137,14 @@ public class ADWindowToolbar extends FToolbar implements EventListener<Event>
 
 	private KeyEvent prevKeyEvent;
 
+	private A overflowButton;
+
+	private ArrayList<ToolBarButton> overflows;
+
+	private Popup overflowPopup;
+	
+	private int prevWidth;
+
 	/**	Last Modifier of Action Event					*/
 //	public int 				lastModifiers;
 	//
@@ -144,6 +157,9 @@ public class ADWindowToolbar extends FToolbar implements EventListener<Event>
     public ADWindowToolbar(int windowNo) {
     	setWindowNo(windowNo);
         init();
+        if (ClientInfo.isMobile()) {
+        	mobileInit();
+        }
 	}
 
 	private void init()
@@ -673,6 +689,7 @@ public class ADWindowToolbar extends FToolbar implements EventListener<Event>
 	}
 
 	private boolean ToolBarMenuRestictionLoaded = false;
+
 	public void updateToolbarAccess(int xAD_Window_ID) {
 		if (ToolBarMenuRestictionLoaded)
 			return;
@@ -783,4 +800,112 @@ public class ADWindowToolbar extends FToolbar implements EventListener<Event>
 			SessionManager.getSessionApplication().getKeylistener().addEventListener(Events.ON_CTRL_KEY, this);
 		}
 	}
+	
+	private void mobileInit() {	
+		LayoutUtils.addSclass("mobile", this);
+		addEventListener("onOverflowButton", evt -> onOverflowButton(evt));
+		this.setWidgetOverride("toolbarScrollable", "function (wgt) {\n" + 
+				"	var total = jq(wgt.$n()).width();\n" + 
+				"	var w = wgt.firstChild;\n" + 
+				"\n" + 
+				"	// make sure all images are loaded.\n" + 
+				"	if (zUtl.isImageLoading()) {\n" + 
+				"		var f = arguments.callee;\n" + 
+				"		setTimeout(function () {\n" + 
+				"			return f(wgt);\n" + 
+				"		}, 20);\n" + 
+				"		return;\n" + 
+				"	}\n" + 
+				"	for (; w; w = w.nextSibling) {\n" + 
+				"		total -= jq(w.$n()).outerWidth(true);\n" + 
+				"		if (total < 0 && w.className == 'zul.wgt.Toolbarbutton') {\n" + 
+				"			break;\n" + 
+				"		}\n" + 
+				"	}\n" + 
+				"	if (w) {\n" + 
+				"       var event = new zk.Event(wgt, 'onOverflowButton', w.uuid, {toServer: true}); \n" +
+				"       zAu.send(event); \n" +
+				"	}\n" + 
+				"}");
+		addEventListener(Events.ON_AFTER_SIZE, (AfterSizeEvent evt) -> onAfterSize(evt));
+		
+	}
+
+	private void onAfterSize(AfterSizeEvent evt) {
+		int width = evt.getWidth();
+		if (width != prevWidth) {
+			prevWidth = width;
+			if (overflowButton != null)
+				overflowButton.detach();	
+			if (overflowPopup != null)
+				overflowPopup.detach();
+			if (overflows != null) {
+				for (ToolBarButton btn : overflows) {
+					appendChild(btn);
+				}
+				overflows = null;
+			}
+			Events.postEvent("onPostAfterSize", this, null);
+		}
+	}
+
+	private void onOverflowButton(Event evt) {
+		overflows = new ArrayList<>();
+		String uuid = (String) evt.getData();
+		boolean overflowStarted = false;
+		for(Component comp : getChildren()) {
+			if (comp instanceof ToolBarButton) {
+				if (overflowStarted) {
+					overflows.add((ToolBarButton) comp);
+				} else if (comp.getUuid().equals(uuid)) {
+					overflows.add((ToolBarButton) comp);
+					overflowStarted = true;
+				}
+			}
+		}
+		if (overflows.size() > 0) {
+			overflowButton = new A();
+			overflowButton.setIconSclass("z-icon-angle-double-down");
+			overflowButton.setStyle("position: absolute; right: 2px; bottom: 6px; font-size: 12px; font-weight: 500;");
+			appendChild(overflowButton);
+			overflowPopup = new Popup();
+			overflowPopup.addEventListener(Events.ON_OPEN, (OpenEvent oe) -> {
+				if (!oe.isOpen()) {
+					overflowPopup.setAttribute("popup.close", System.currentTimeMillis());
+				}
+			});
+			appendChild(overflowPopup);
+			for(ToolBarButton btn : overflows) {
+				overflowPopup.appendChild(btn);
+			}			
+			overflowButton.addEventListener(Events.ON_CLICK, e -> {
+				Long ts = (Long) overflowPopup.removeAttribute("popup.close");
+				if (ts != null) {
+					if (System.currentTimeMillis() - ts.longValue() < 500) {
+						return;
+					}
+				}
+				overflowPopup.open(overflowButton, "after_end");
+			});
+			
+			int cnt = 0;
+			for(Component c : getChildren()) {
+				if (c instanceof ToolBarButton)
+					cnt++;
+			}
+			if (overflows.size() >= cnt) {
+				String script = "var e = jq('#" + getUuid() + "');";
+				script = script + "var b=zk.Widget.$('#" + overflowPopup.getUuid() + "'); ";
+				script = script + "b.setWidth(e.css('width'));";
+				Clients.evalJavaScript(script);
+			} else {
+				overflowPopup.setWidth(null);
+			}
+		}
+	}
+	
+	public void onPostAfterSize() {
+		String script = "var w = zk.Widget.$('#" + getUuid() + "'); w.toolbarScrollable(w);";
+		Clients.evalJavaScript(script);
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/adwindow/AbstractADWindowContent.java

@@ -34,6 +34,7 @@ import java.util.logging.Level;
 import org.adempiere.util.Callback;
 import org.adempiere.webui.AdempiereIdGenerator;
 import org.adempiere.webui.AdempiereWebUI;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.WArchive;
 import org.adempiere.webui.WRequest;
@@ -758,7 +759,10 @@ public abstract class AbstractADWindowContent extends AbstractUIPart implements
 		findWindow.setBorder("none");	
 		findWindow.setStyle("position: absolute; border-bottom: 2px solid #484848; padding: 2px; background-color: #fff;");
 		ZKUpdateUtil.setWidth(findWindow, "100%");
-		ZKUpdateUtil.setHeight(findWindow, "60%");
+		if (ClientInfo.maxHeight(ClientInfo.MEDIUM_HEIGHT-1))
+			ZKUpdateUtil.setHeight(findWindow, "100%");
+		else
+			ZKUpdateUtil.setHeight(findWindow, "60%");
 		findWindow.setZindex(1000);
 		findWindow.setSizable(false);
 		findWindow.setContentStyle("background-color: #fff; width: 99%; margin: auto;");
@@ -3039,8 +3043,8 @@ public abstract class AbstractADWindowContent extends AbstractUIPart implements
 						onRefresh(true, false);						
 					}
 				});
-				showBusyMask(form);
+				form.setPage(getComponent().getPage());
-				LayoutUtils.openOverlappedWindow(getComponent(), form, "middle_center");
+				form.doHighlighted();
 				form.focus();
 			}
 			else {

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/adwindow/GridView.java

@@ -26,7 +26,7 @@ import org.adempiere.base.Core;
 import org.adempiere.model.MTabCustomization;
 import org.adempiere.util.Callback;
 import org.adempiere.util.GridRowCtx;
-import org.adempiere.webui.apps.AEnv;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.component.Checkbox;
 import org.adempiere.webui.component.Columns;
 import org.adempiere.webui.component.EditorBox;
@@ -83,6 +83,8 @@ public class GridView extends Vbox implements EventListener<Event>, IdSpace, IFi
 
 	private static final int DEFAULT_DETAIL_PAGE_SIZE = 10;
 
+	private static final int DEFAULT_MOBILE_PAGE_SIZE = 20;
+	
 	private static final int DEFAULT_PAGE_SIZE = 20;
 
 	private static final int MIN_COLUMN_WIDTH = 100;
@@ -158,10 +160,14 @@ public class GridView extends Vbox implements EventListener<Event>, IdSpace, IFi
 		ZKUpdateUtil.setVflex(gridFooter, "0");
 		
 		//default paging size
-		if (AEnv.isTablet())
+		if (ClientInfo.isMobile())
 		{
-			//anything more than 20 is very slow on a tablet
+			//Shoud be <= 20 on mobile
-			pageSize = 10;
+			pageSize = MSysConfig.getIntValue(MSysConfig.ZK_MOBILE_PAGING_SIZE, DEFAULT_MOBILE_PAGE_SIZE, Env.getAD_Client_ID(Env.getCtx()));
+			String limit = Library.getProperty(CustomGridDataLoader.GRID_DATA_LOADER_LIMIT);
+			if (limit == null || !(limit.equals(Integer.toString(pageSize)))) {
+				Library.setProperty(CustomGridDataLoader.GRID_DATA_LOADER_LIMIT, Integer.toString(pageSize));
+			}
 		}
 		else
 		{
@@ -173,7 +179,10 @@ public class GridView extends Vbox implements EventListener<Event>, IdSpace, IFi
 		}		
 		
 		//default true for better UI experience
-		modeless = MSysConfig.getBooleanValue(MSysConfig.ZK_GRID_EDIT_MODELESS, true);
+		if (ClientInfo.isMobile())
+			modeless = MSysConfig.getBooleanValue(MSysConfig.ZK_GRID_MOBILE_EDIT_MODELESS, false);
+		else
+			modeless = MSysConfig.getBooleanValue(MSysConfig.ZK_GRID_EDIT_MODELESS, true);
 		
 		appendChild(listbox);
 		appendChild(gridFooter);								
@@ -294,10 +303,16 @@ public class GridView extends Vbox implements EventListener<Event>, IdSpace, IFi
 		} else {
 			ArrayList<GridField> gridFieldList = new ArrayList<GridField>();
 			
+			//limit number of columns on mobile for better performance
+			int max = 0;
+			if (ClientInfo.isMobile())
+				max = MSysConfig.getIntValue(MSysConfig.ZK_GRID_MOBILE_MAX_COLUMNS, 10, Env.getAD_Client_ID(Env.getCtx()));
 			for(GridField field:tmpFields){
 				if(field.isDisplayedGrid() && !field.isToolbarOnlyButton()) {
 					gridFieldList.add(field);
 				}
+				if (max > 0 && gridFieldList.size() >= max)
+					break;
 			}
 			
 			Collections.sort(gridFieldList, new Comparator<GridField>() {
@@ -458,7 +473,7 @@ public class GridView extends Vbox implements EventListener<Event>, IdSpace, IFi
 		Columns columns = new Columns();
 		
 		//frozen not working well on tablet devices yet
-		if (!AEnv.isTablet())
+		if (!ClientInfo.isMobile())
 		{
 			Frozen frozen = new Frozen();
 			//freeze selection and indicator column

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/AEnv.java

@@ -34,9 +34,9 @@ import java.util.logging.Level;
 
 import javax.servlet.ServletRequest;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.adwindow.ADWindow;
 import org.adempiere.webui.component.Window;
-import org.adempiere.webui.desktop.IDesktop;
 import org.adempiere.webui.editor.WTableDirEditor;
 import org.adempiere.webui.info.InfoWindow;
 import org.adempiere.webui.session.SessionManager;
@@ -762,11 +762,11 @@ public final class AEnv
 	}
 	
 	/**
+	 * @deprecated replace by ClientInfo.isMobile()
 	 * @return true if running on a tablet
 	 */
 	public static boolean isTablet() {
-		IDesktop appDesktop = SessionManager.getAppDesktop();
+		return ClientInfo.isMobile();
-		return appDesktop != null ? appDesktop.getClientInfo().tablet : false;
 	}
 	
 	/**

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/AbstractProcessDialog.java

@@ -29,6 +29,7 @@ import org.adempiere.util.Callback;
 import org.adempiere.util.ContextRunnable;
 import org.adempiere.util.IProcessUI;
 import org.adempiere.util.ServerContext;
+import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Checkbox;
 import org.adempiere.webui.component.Column;
@@ -398,8 +399,9 @@ public abstract class AbstractProcessDialog extends Window implements IProcessUI
 			return;//if not a report not need show this pannel
 		
 		// option control
-		HtmlBasedComponent reportOptionLayout = new Hlayout();
+		Hlayout reportOptionLayout = new Hlayout();
 		reportOptionLayout.setSclass("report-option-container");
+		reportOptionLayout.setValign("middle");
 		bottomParameterLayout.appendChild(reportOptionLayout);
 		
 		freportType = new Listbox();
@@ -438,7 +440,7 @@ public abstract class AbstractProcessDialog extends Window implements IProcessUI
 	}
 	
 	protected void savePrameterLayout(HtmlBasedComponent bottomParameterLayout) {
-		HtmlBasedComponent savePrameterLayout = new Div();
+		HtmlBasedComponent savePrameterLayout = new Hlayout();
 		savePrameterLayout.setSclass("save-parameter-container");
 		bottomParameterLayout.appendChild(savePrameterLayout);
 		
@@ -456,6 +458,9 @@ public abstract class AbstractProcessDialog extends Window implements IProcessUI
 		bDelete.addActionListener(this);
 		savePrameterLayout.appendChild(bDelete);
 
+		LayoutUtils.addSclass("btn-small", bSave);
+		LayoutUtils.addSclass("btn-small", bDelete);
+		
 		querySaved();
 	}
 	
@@ -483,6 +488,7 @@ public abstract class AbstractProcessDialog extends Window implements IProcessUI
 		bOK.setId("Ok");
 		bOK.addEventListener(Events.ON_CLICK, this);
 		confParaPanel.appendChild(bOK);
+		confParaPanel.appendChild(new Space());
 		
 		bCancel = ButtonFactory.createNamedButton(ConfirmPanel.A_CANCEL, true, true);
 		bCancel.setId("Cancel");

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/FeedbackRequestWindow.java

@@ -59,8 +59,8 @@ import org.zkoss.zk.ui.event.Events;
 import org.zkoss.zk.ui.event.UploadEvent;
 import org.zkoss.zk.ui.util.Clients;
 import org.zkoss.zul.Borderlayout;
+import org.zkoss.zul.Center;
 import org.zkoss.zul.Div;
-import org.zkoss.zul.North;
 import org.zkoss.zul.South;
 
 /**
@@ -90,11 +90,20 @@ public class FeedbackRequestWindow extends Window implements EventListener<Event
 		
 		setTitle(Msg.getMsg(Env.getCtx(), "RequestNew"));
 		setAttribute(Window.MODE_KEY, Window.MODE_HIGHLIGHTED);
-		ZKUpdateUtil.setWidth(this, "400px");
+		if (!ThemeManager.isUseCSSForWindowSize()) {
-		this.setSclass("popup-dialog");
+			ZKUpdateUtil.setWindowWidthX(this, 400);
+			ZKUpdateUtil.setWindowHeightX(this, 600);
+		} else {
+			addCallback(AFTER_PAGE_ATTACHED, t -> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+			});
+		}
+		this.setSclass("popup-dialog feedback-request-dialog");
 		this.setBorder("normal");
 		this.setShadow(true);
 		this.setClosable(true);
+		this.setMaximizable(true);
 		
 		boolean readOnly = !MRole.getDefault().canUpdate(
 				Env.getAD_Client_ID(Env.getCtx()), Env.getAD_Org_ID(Env.getCtx()), 
@@ -144,7 +153,7 @@ public class FeedbackRequestWindow extends Window implements EventListener<Event
 		
 		
 		Grid grid = GridFactory.newGridLayout();
-		ZKUpdateUtil.setVflex(grid, "min");
+		ZKUpdateUtil.setVflex(grid, "1");
 		
 		Rows rows = new Rows();
 		grid.appendChild(rows);
@@ -196,14 +205,14 @@ public class FeedbackRequestWindow extends Window implements EventListener<Event
 		Borderlayout borderlayout = new Borderlayout();
 		this.appendChild(borderlayout);
 		ZKUpdateUtil.setHflex(borderlayout, "1");
-		ZKUpdateUtil.setVflex(borderlayout, "min");
+		ZKUpdateUtil.setVflex(borderlayout, "1");
 		
-		North northPane = new North();
+		Center centerPane = new Center();
-		northPane.setSclass("dialog-content");
+		centerPane.setSclass("dialog-content");
-		northPane.setAutoscroll(true);
+		centerPane.setAutoscroll(true);
-		borderlayout.appendChild(northPane);
+		borderlayout.appendChild(centerPane);
 		
-		northPane.appendChild(grid);
+		centerPane.appendChild(grid);
 		ZKUpdateUtil.setVflex(grid, "1");
 		ZKUpdateUtil.setHflex(grid, "1");
 

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/GlobalSearch.java

@@ -13,6 +13,7 @@
  *****************************************************************************/
 package org.adempiere.webui.apps;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.apps.DocumentSearchController.SearchResult;
 import org.adempiere.webui.component.Bandbox;
 import org.adempiere.webui.component.Tab;
@@ -76,7 +77,7 @@ public class GlobalSearch extends Div implements EventListener<Event> {
 		bandbox = new Bandbox();
 		bandbox.setSclass("global-search-box");
 		appendChild(bandbox);
-		ZKUpdateUtil.setWidth(bandbox, "100%");
+//		ZKUpdateUtil.setWidth(bandbox, "100%");
 		bandbox.setAutodrop(true);
 		bandbox.addEventListener(Events.ON_CHANGING, this);
 		bandbox.addEventListener(Events.ON_CHANGE, this);
@@ -84,7 +85,7 @@ public class GlobalSearch extends Div implements EventListener<Event> {
 		bandbox.addEventListener(Events.ON_CTRL_KEY, this);
 		
 		Bandpopup popup = new Bandpopup();
-		ZKUpdateUtil.setHeight(popup, "500px");
+		ZKUpdateUtil.setWindowHeightX(popup, ClientInfo.get().desktopHeight-50);
 		bandbox.appendChild(popup);		
 		
 		tabbox = new Tabbox();
@@ -209,4 +210,14 @@ public class GlobalSearch extends Div implements EventListener<Event> {
 		super.onPageAttached(newpage, oldpage);
 		Events.echoEvent(ON_CREATE_ECHO, this, null);		
 	}
+	
+	public void closePopup() {
+		if (bandbox != null) {
+			bandbox.close();
+		}
+	}
+	
+	public void onClientInfo() {
+		ZKUpdateUtil.setWindowHeightX(bandbox.getDropdown(), ClientInfo.get().desktopHeight-50);	
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WAllocation.java

@@ -25,8 +25,12 @@ import java.util.Calendar;
 import java.util.Vector;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
+import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Checkbox;
+import org.adempiere.webui.component.Column;
+import org.adempiere.webui.component.Columns;
 import org.adempiere.webui.component.DocumentLink;
 import org.adempiere.webui.component.Grid;
 import org.adempiere.webui.component.GridFactory;
@@ -64,12 +68,13 @@ import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
 import org.zkoss.zul.Borderlayout;
 import org.zkoss.zul.Center;
+import org.zkoss.zul.Div;
 import org.zkoss.zul.Hbox;
 import org.zkoss.zul.Hlayout;
 import org.zkoss.zul.North;
-import org.zkoss.zul.Separator;
 import org.zkoss.zul.South;
-import org.zkoss.zul.Space;
+
+import static org.adempiere.webui.ClientInfo.*;
 
 /**
  * Allocation Form
@@ -99,19 +104,22 @@ public class WAllocation extends Allocation
 			dynInit();
 			zkInit();
 			calculate();			
-			southPanel.appendChild(new Separator());
-			southPanel.appendChild(statusBar);
 		}
 		catch(Exception e)
 		{
 			log.log(Level.SEVERE, "", e);
 		}
+		
+		if (ClientInfo.isMobile()) 
+		{
+			ClientInfo.onClientInfo(form, this::onClientInfo);
+		}
 	}	//	init
 	
 	//
 	private Borderlayout mainLayout = new Borderlayout();
 	private Panel parameterPanel = new Panel();
-	private Panel allocationPanel = new Panel();
+	private Panel allocationPanel = new Panel(); //footer
 	private Grid parameterLayout = GridFactory.newGridLayout();
 	private Label bpartnerLabel = new Label();
 	private WSearchEditor bpartnerSearch = null;
@@ -145,8 +153,7 @@ public class WAllocation extends Allocation
 	private Checkbox autoWriteOff = new Checkbox();
 	private Label organizationLabel = new Label();
 	private WTableDirEditor organizationPick;
-	
+	private int noOfColumn;
-	private Panel southPanel = new Panel();
 	
 	/**
 	 *  Static Init
@@ -155,9 +162,16 @@ public class WAllocation extends Allocation
 	private void zkInit() throws Exception
 	{
 		//
-		form.appendChild(mainLayout);
+		Div div = new Div();
-		ZKUpdateUtil.setWidth(mainLayout, "99%");
+		div.setStyle("height: 100%; width: 100%; overflow: auto;");
-		ZKUpdateUtil.setHeight(mainLayout, "100%");
+		div.appendChild(mainLayout);
+		form.appendChild(div);
+		ZKUpdateUtil.setWidth(mainLayout, "100%");
+		
+		/////
+		mainLayout.setStyle("min-height: 600px");
+		/////
+		
 		dateLabel.setText(Msg.getMsg(Env.getCtx(), "Date"));
 		autoWriteOff.setSelected(false);
 		autoWriteOff.setText(Msg.getMsg(Env.getCtx(), "AutoWriteOff", true));
@@ -190,25 +204,114 @@ public class WAllocation extends Allocation
 		
 		organizationLabel.setText(Msg.translate(Env.getCtx(), "AD_Org_ID"));
 		
+		// parameters layout
 		North north = new North();
-		north.setStyle("border: none");
+		north.setBorder("none");
+		north.setSplittable(true);
+		north.setCollapsible(true);
 		mainLayout.appendChild(north);
 		north.appendChild(parameterPanel);
 		
+		layoutParameterAndSummary();
+		
+		// payment layout
+		paymentPanel.appendChild(paymentLayout);
+		ZKUpdateUtil.setWidth(paymentPanel, "100%");
+		ZKUpdateUtil.setWidth(paymentLayout, "100%");
+		ZKUpdateUtil.setVflex(paymentPanel, "1");
+		ZKUpdateUtil.setVflex(paymentLayout, "1");
+		
+		// invoice layout
+		invoicePanel.appendChild(invoiceLayout);
+		ZKUpdateUtil.setWidth(invoicePanel, "100%");
+		ZKUpdateUtil.setWidth(invoiceLayout, "100%");
+		ZKUpdateUtil.setVflex(invoicePanel, "1");
+		ZKUpdateUtil.setVflex(invoiceLayout, "1");
+		
+		// payment layout north - label
+		north = new North();
+		north.setBorder("none");
+		paymentLayout.appendChild(north);
+		north.appendChild(paymentLabel);
+		ZKUpdateUtil.setVflex(paymentLabel, "min");
+		// payment layout south - sum
+		South south = new South();
+		south.setBorder("none");
+		paymentLayout.appendChild(south);
+		south.appendChild(paymentInfo.rightAlign());
+		ZKUpdateUtil.setVflex(paymentInfo, "min");
+		//payment layout center - payment list
+		Center center = new Center();
+		paymentLayout.appendChild(center);
+		center.appendChild(paymentTable);
+		ZKUpdateUtil.setWidth(paymentTable, "100%");
+		ZKUpdateUtil.setVflex(paymentTable, "1");
+		center.setBorder("none");
+		
+		// invoice layout north - label
+		north = new North();
+		north.setBorder("none");
+		invoiceLayout.appendChild(north);
+		north.appendChild(invoiceLabel);
+		ZKUpdateUtil.setVflex(invoiceLabel, "min");
+		// invoice layout south - sum
+		south = new South();
+		south.setBorder("none");
+		invoiceLayout.appendChild(south);
+		south.appendChild(invoiceInfo.rightAlign());
+		ZKUpdateUtil.setVflex(invoiceInfo, "min");
+		// invoice layout center - invoice list
+		center = new Center();
+		invoiceLayout.appendChild(center);
+		center.appendChild(invoiceTable);
+		ZKUpdateUtil.setWidth(invoiceTable, "100%");
+		ZKUpdateUtil.setVflex(invoiceTable, "1");
+		center.setStyle("border: none");
+		
+		// mainlayout center - payment + invoice 
+		center = new Center();
+		mainLayout.appendChild(center);
+		center.appendChild(infoPanel);
+		ZKUpdateUtil.setHflex(infoPanel, "1");
+		ZKUpdateUtil.setVflex(infoPanel, "1");
+		
+		infoPanel.setStyle("border: none");
+		ZKUpdateUtil.setWidth(infoPanel, "100%");
+		
+		// north of mainlayout center - payment
+		north = new North();
+		north.setBorder("none");
+		infoPanel.appendChild(north);
+		north.appendChild(paymentPanel);
+		north.setAutoscroll(true);
+		north.setSplittable(true);
+		north.setSize("50%");
+		north.setCollapsible(true);
+
+		// center of mainlayout center - invoice
+		center = new Center();
+		center.setBorder("none");
+		infoPanel.appendChild(center);
+		center.appendChild(invoicePanel);
+		center.setAutoscroll(true);
+		infoPanel.setStyle("min-height: 300px;");
+	}   //  jbInit
+
+	protected void layoutParameterAndSummary() {
 		Rows rows = null;
 		Row row = null;
 		
-		ZKUpdateUtil.setWidth(parameterLayout, "80%");
+		setupParameterColumns();
+		
 		rows = parameterLayout.newRows();
 		row = rows.newRow();
 		row.appendCellChild(bpartnerLabel.rightAlign());
 		ZKUpdateUtil.setHflex(bpartnerSearch.getComponent(), "true");
-		row.appendCellChild(bpartnerSearch.getComponent(),2);
+		row.appendCellChild(bpartnerSearch.getComponent(),1);
 		bpartnerSearch.showMenu();
-		Hbox box = new Hbox();
+		row.appendChild(dateLabel.rightAlign());
-		box.appendChild(dateLabel.rightAlign());
+		row.appendChild(dateField.getComponent());
-		box.appendChild(dateField.getComponent());
+		
-		row.appendCellChild(box);
 		row.appendCellChild(organizationLabel.rightAlign());
 		ZKUpdateUtil.setHflex(organizationPick.getComponent(), "true");
 		row.appendCellChild(organizationPick.getComponent(),1);
@@ -219,102 +322,109 @@ public class WAllocation extends Allocation
 		ZKUpdateUtil.setHflex(currencyPick.getComponent(), "true");
 		row.appendCellChild(currencyPick.getComponent(),1);		
 		currencyPick.showMenu();
-		row.appendCellChild(multiCurrency,1);		
-		row.appendCellChild(autoWriteOff,2);
-		row.appendCellChild(new Space(),1);		
 		
+		Hbox cbox = new Hbox();
+		cbox.setWidth("100%");
+		if (noOfColumn == 6)
+			cbox.setPack("center");
+		else
+			cbox.setPack("end");
+		cbox.appendChild(multiCurrency);
+		cbox.appendChild(autoWriteOff);
+		row.appendCellChild(cbox, 2);		
+		if (noOfColumn < 6)		
+			LayoutUtils.compactTo(parameterLayout, noOfColumn);
+		else
+			LayoutUtils.expandTo(parameterLayout, noOfColumn, true);
+		
+		// footer/allocations layout
 		South south = new South();
-		south.setStyle("border: none");
+		south.setBorder("none");
 		mainLayout.appendChild(south);
-		south.appendChild(southPanel);
+		south.appendChild(allocationPanel);
-		southPanel.appendChild(allocationPanel);
 		allocationPanel.appendChild(allocationLayout);
-		ZKUpdateUtil.setHflex(allocationLayout, "min");
+		allocationPanel.appendChild(statusBar);
+		ZKUpdateUtil.setWidth(allocationLayout, "100%");
+		ZKUpdateUtil.setHflex(allocationPanel, "1");
+		ZKUpdateUtil.setVflex(allocationPanel, "min");
+		ZKUpdateUtil.setVflex(allocationLayout, "min");
+		ZKUpdateUtil.setVflex(statusBar, "min");
+		ZKUpdateUtil.setVflex(south, "min");
 		rows = allocationLayout.newRows();
 		row = rows.newRow();
-		row.appendCellChild(differenceLabel.rightAlign());
+		if (maxWidth(SMALL_WIDTH-1))
-		row.appendCellChild(allocCurrencyLabel.rightAlign());
+		{
+			Hbox box = new Hbox();
+			box.setWidth("100%");
+			box.setPack("end");
+			box.appendChild(differenceLabel.rightAlign());
+			box.appendChild(allocCurrencyLabel.rightAlign());
+			row.appendCellChild(box);
+		}
+		else
+		{
+			Hlayout box = new Hlayout();
+			box.setStyle("float: right");
+			box.appendChild(differenceLabel.rightAlign());
+			box.appendChild(allocCurrencyLabel.rightAlign());
+			row.appendCellChild(box);
+		}
 		ZKUpdateUtil.setHflex(differenceField, "true");
 		row.appendCellChild(differenceField);
+		if (maxWidth(SMALL_WIDTH-1))
+			row = rows.newRow();
 		row.appendCellChild(chargeLabel.rightAlign());
 		ZKUpdateUtil.setHflex(chargePick.getComponent(), "true");
 		row.appendCellChild(chargePick.getComponent());
+		if (maxWidth(SMALL_WIDTH-1))
+			row = rows.newRow();
 		row.appendCellChild(DocTypeLabel.rightAlign());
 		chargePick.showMenu();
 		ZKUpdateUtil.setHflex(DocTypePick.getComponent(), "true");
 		row.appendCellChild(DocTypePick.getComponent());
 		DocTypePick.showMenu();
-		ZKUpdateUtil.setHflex(allocateButton, "true");
+		if (maxWidth(SMALL_WIDTH-1))
-		row.appendCellChild(allocateButton);
+		{
-		row.appendCellChild(refreshButton);
+			row = rows.newRow();
+			Hbox box = new Hbox();
+			box.setWidth("100%");
+			box.setPack("end");
+			box.appendChild(allocateButton);
+			box.appendChild(refreshButton);
+			row.appendCellChild(box, 2);
+		}
+		else
+		{
+			Hbox box = new Hbox();
+			box.setPack("end");
+			box.appendChild(allocateButton);
+			box.appendChild(refreshButton);
+			ZKUpdateUtil.setHflex(box, "1");
+			row.appendCellChild(box, 2);
+		}
+	}
 
-		paymentPanel.appendChild(paymentLayout);
+	protected void setupParameterColumns() {
-		ZKUpdateUtil.setWidth(paymentPanel, "100%");
+		noOfColumn = 6;
-		ZKUpdateUtil.setHeight(paymentPanel, "100%");
+		if (maxWidth(MEDIUM_WIDTH-1))
-		ZKUpdateUtil.setWidth(paymentLayout, "100%");
+		{
-		ZKUpdateUtil.setHeight(paymentLayout, "100%");
+			if (maxWidth(SMALL_WIDTH-1))
-		paymentLayout.setStyle("border: none");
+				noOfColumn = 2;
-		
+			else
-		invoicePanel.appendChild(invoiceLayout);
+				noOfColumn = 4;
-		ZKUpdateUtil.setWidth(invoicePanel, "100%");
+		}
-		ZKUpdateUtil.setHeight(invoicePanel, "100%");
+		if (noOfColumn == 2)
-		ZKUpdateUtil.setWidth(invoiceLayout, "100%");
+		{
-		ZKUpdateUtil.setHeight(invoiceLayout, "100%");
+			Columns columns = new Columns();
-		invoiceLayout.setStyle("border: none");
+			Column column = new Column();
-		
+			column.setWidth("35%");
-		north = new North();
+			columns.appendChild(column);
-		north.setStyle("border: none");
+			column = new Column();
-		paymentLayout.appendChild(north);
+			column.setWidth("65%");
-		north.appendChild(paymentLabel);
+			columns.appendChild(column);
-		south = new South();
+			parameterLayout.appendChild(columns);
-		south.setStyle("border: none");
+		}
-		paymentLayout.appendChild(south);
+	}
-		south.appendChild(paymentInfo.rightAlign());
-		Center center = new Center();
-		paymentLayout.appendChild(center);
-		center.appendChild(paymentTable);
-		ZKUpdateUtil.setWidth(paymentTable, "99%");
-		//ZKUpdateUtil.setHeight(paymentTable, "99%");
-		center.setStyle("border: none");
-		
-		north = new North();
-		north.setStyle("border: none");
-		invoiceLayout.appendChild(north);
-		north.appendChild(invoiceLabel);
-		south = new South();
-		south.setStyle("border: none");
-		invoiceLayout.appendChild(south);
-		south.appendChild(invoiceInfo.rightAlign());
-		center = new Center();
-		invoiceLayout.appendChild(center);
-		center.appendChild(invoiceTable);
-		ZKUpdateUtil.setWidth(invoiceTable, "99%");
-		//ZKUpdateUtil.setHeight(invoiceTable, "99%");
-		center.setStyle("border: none");
-		//
-		center = new Center();
-		mainLayout.appendChild(center);
-		center.appendChild(infoPanel);
-		ZKUpdateUtil.setHflex(infoPanel, "1");
-		ZKUpdateUtil.setVflex(infoPanel, "1");
-		
-		infoPanel.setStyle("border: none");
-		ZKUpdateUtil.setWidth(infoPanel, "100%");
-		ZKUpdateUtil.setHeight(infoPanel, "100%");
-		
-		north = new North();
-		north.setStyle("border: none");
-		ZKUpdateUtil.setHeight(north, "49%");
-		infoPanel.appendChild(north);
-		north.appendChild(paymentPanel);
-		north.setSplittable(true);
-		center = new Center();
-		center.setStyle("border: none");
-		infoPanel.appendChild(center);
-		center.appendChild(invoicePanel);
-		ZKUpdateUtil.setHflex(invoicePanel, "1");
-		ZKUpdateUtil.setVflex(invoicePanel, "1");
-	}   //  jbInit
 
 	/**
 	 *  Dynamic Init (prepare dynamic fields)
@@ -373,6 +483,36 @@ public class WAllocation extends Allocation
 			
 	}   //  dynInit
 	
+	protected void onClientInfo()
+	{
+		if (ClientInfo.isMobile() && form.getPage() != null) 
+		{
+			if (noOfColumn > 0 && parameterLayout.getRows() != null)
+			{
+				int t = 6;
+				if (maxWidth(MEDIUM_WIDTH-1))
+				{
+					if (maxWidth(SMALL_WIDTH-1))
+						t = 2;
+					else
+						t = 4;
+				}
+				if (t != noOfColumn)
+				{
+					parameterLayout.getRows().detach();
+					if (parameterLayout.getColumns() != null)
+						parameterLayout.getColumns().detach();
+					if (mainLayout.getSouth() != null)
+						mainLayout.getSouth().detach();
+					if (allocationLayout.getRows() != null)
+						allocationLayout.getRows().detach();
+					layoutParameterAndSummary();
+					form.invalidate();
+				}
+			}
+		}
+	}
+	
 	/**************************************************************************
 	 *  Action Listener.
 	 *  - MultiCurrency

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WArchiveViewer.java

@@ -27,6 +27,7 @@ import java.util.Date;
 import java.util.logging.Level;
 
 import org.adempiere.util.Callback;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Checkbox;
 import org.adempiere.webui.component.Column;
@@ -47,6 +48,7 @@ import org.adempiere.webui.component.Tabpanel;
 import org.adempiere.webui.component.Tabpanels;
 import org.adempiere.webui.component.Tabs;
 import org.adempiere.webui.component.Textbox;
+import org.adempiere.webui.component.ToolBarButton;
 import org.adempiere.webui.editor.WSearchEditor;
 import org.adempiere.webui.panel.ADForm;
 import org.adempiere.webui.panel.CustomForm;
@@ -65,14 +67,20 @@ import org.compiere.util.KeyNamePair;
 import org.compiere.util.Msg;
 import org.compiere.util.Util;
 import org.zkoss.util.media.AMedia;
+import org.zkoss.util.media.Media;
 import org.zkoss.zk.ui.Page;
 import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
 import org.zkoss.zk.ui.event.Events;
+import org.zkoss.zk.ui.event.OpenEvent;
+import org.zkoss.zk.ui.ext.render.DynamicMedia;
 import org.zkoss.zul.Cell;
 import org.zkoss.zul.Hbox;
 import org.zkoss.zul.Iframe;
+import org.zkoss.zul.Popup;
 import org.zkoss.zul.Space;
+import org.zkoss.zul.impl.Utils;
+import org.zkoss.zul.impl.XulElement;
 
 /**
  * 	Archive Viewer
@@ -83,7 +91,52 @@ import org.zkoss.zul.Space;
 
 public class WArchiveViewer extends Archive implements IFormController, EventListener<Event>
 {
-	private CustomForm form = new CustomForm();	
+	private static final String ONCLOSE_TIMESTAMP_ATTR = "onclose.timestamp";
+
+	private class WArchiveViewerForm extends CustomForm
+	{
+		/**
+		 * generated serial id
+		 */
+		private static final long serialVersionUID = 4919349386488325L;
+		//-- ComponentCtrl --//
+		public Object getExtraCtrl() {
+			return new ExtraCtrl();
+		}
+		/** A utility class to implement {@link #getExtraCtrl}.
+		 * It is used only by component developers.
+		 */
+		protected class ExtraCtrl extends XulElement.ExtraCtrl
+		implements DynamicMedia {
+			//-- DynamicMedia --//
+			public Media getMedia(String pathInfo) {
+				return media;
+			}
+		}
+		
+		@Override
+		public void onPageAttached(Page newpage, Page oldpage) {
+			super.onPageAttached(newpage, oldpage);
+			if (newpage != null) {
+				try {
+					dynInit();
+					jbInit();
+					if (ClientInfo.isMobile()) {
+						if (media != null && iframe.getSrc() == null) {
+							String url = Utils.getDynamicMediaURI(form, mediaVersion, media.getName(), media.getFormat());
+							String pdfJsUrl = "pdf.js/web/viewer.html?file="+url;
+							iframe.setSrc(pdfJsUrl);
+						}
+					}
+				}
+				catch(Exception e)
+				{
+					log.log(Level.SEVERE, "init", e);
+				}
+			}
+		}
+	};
+	private CustomForm form;
 	
 //	private Vbox queryPanel = new Vbox();
 	private Checkbox reportField = new Checkbox();
@@ -131,29 +184,14 @@ public class WArchiveViewer extends Archive implements IFormController, EventLis
 	private Button bRefresh = new Button();
 	private boolean showQuery = true;
 
+	private int mediaVersion = 0;
+	private AMedia media;
+
 	public WArchiveViewer()
 	{
 		log.info("");
 
-		form = new CustomForm() {
+		form = new WArchiveViewerForm();
-			private static final long serialVersionUID = 7226661630651936293L;
-
-			@Override
-			public void onPageAttached(Page newpage, Page oldpage) {
-				super.onPageAttached(newpage, oldpage);
-				if (newpage != null)
-					try {
-						dynInit();
-						jbInit();
-					}
-				catch(Exception e)
-				{
-					log.log(Level.SEVERE, "init", e);
-				}
-
-			}
-
-		};
 
 		m_WindowNo = form.getWindowNo();
 	}
@@ -185,10 +223,29 @@ public class WArchiveViewer extends Archive implements IFormController, EventLis
 				Env.getCtx(), "C_BPartner_ID"), "", true, false, true);
 	}	//	dynInit
 
-	private void reportViewer(byte[] data)
+	private void reportViewer(String name, byte[] data)
 	{	
-		AMedia media = new AMedia("Archive Viewer", "pdf", "application/pdf", data);
+		media = new AMedia(name + ".pdf", "pdf", "application/pdf", data);
-		iframe.setContent(media);
+		if (ClientInfo.isMobile())
+		{
+			mediaVersion ++;
+			if (form.getDesktop() == null)
+			{
+				iframe.setContent(null);
+				iframe.setSrc(null);
+			}
+			else
+			{
+				String url = Utils.getDynamicMediaURI(form, mediaVersion, media.getName(), media.getFormat());
+				String pdfJsUrl = "pdf.js/web/viewer.html?file="+url;
+				iframe.setContent(null);
+				iframe.setSrc(pdfJsUrl);
+			}
+		}
+		else
+		{			
+			iframe.setContent(media);
+		}
 		iframe.invalidate();
 	}
 	
@@ -452,13 +509,44 @@ public class WArchiveViewer extends Archive implements IFormController, EventLis
 		ZKUpdateUtil.setWidth(boxViewSeparator, "100%");
 		ZKUpdateUtil.setHeight(boxViewSeparator, "100%");			
 		cell = new Cell();
-		ZKUpdateUtil.setWidth(cell, "70%");
 		cell.appendChild(iframe);
 		boxViewSeparator.appendChild(cell);
-		cell = new Cell();
+		if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1))
-		ZKUpdateUtil.setWidth(cell, "30%");
+		{
-		cell.appendChild(gridView);
+			ZKUpdateUtil.setHflex(cell, "1");
-		boxViewSeparator.appendChild(cell);
+			cell = new Cell();
+			ZKUpdateUtil.setHflex(cell, "min");
+			ToolBarButton more = new ToolBarButton();
+			more.setImage(ThemeManager.getThemeResource("images/expand-header.png"));
+			cell.appendChild(more);
+			boxViewSeparator.appendChild(cell);
+			Popup sidePopup = new Popup();
+			sidePopup.setWidth("300px");
+			sidePopup.setVflex("min");
+			sidePopup.setStyle("max-height: 100%; overflow-y: auto;");
+			sidePopup.addEventListener(Events.ON_OPEN, (OpenEvent evt) -> {
+				if (!evt.isOpen())
+					sidePopup.setAttribute(ONCLOSE_TIMESTAMP_ATTR, System.currentTimeMillis());
+			});			
+			tabViewPanel.appendChild(sidePopup);
+			sidePopup.appendChild(gridView);
+			more.addEventListener(Events.ON_CLICK, evt -> { 
+				Long ts = (Long) sidePopup.removeAttribute(ONCLOSE_TIMESTAMP_ATTR);
+				if (ts != null) {
+					if ((System.currentTimeMillis()-ts.longValue()) < 500)
+						return;
+				}
+				sidePopup.open(more, "after_end");				
+			});
+		}
+		else
+		{
+			ZKUpdateUtil.setWidth(cell, "70%");			
+			cell = new Cell();
+			ZKUpdateUtil.setWidth(cell, "30%");
+			cell.appendChild(gridView);
+			boxViewSeparator.appendChild(cell);
+		}
 		tabViewPanel.appendChild(boxViewSeparator);
 
 		tabs.appendChild(tabView);
@@ -611,7 +699,7 @@ public class WArchiveViewer extends Archive implements IFormController, EventLis
 			InputStream in = ar.getInputStream();
 			//pdfViewer.setScale(reportField.isSelected() ? 50 : 75);
 			if (in != null)
-				reportViewer(ar.getBinaryData());//pdfViewer.loadPDF(in);
+				reportViewer(ar.getName(), ar.getBinaryData());//pdfViewer.loadPDF(in);
 			else
 				iframe.getChildren().clear();//pdfViewer.clearDocument();
 		}

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WCharge.java

@@ -228,6 +228,8 @@ public class WCharge extends Charge implements IFormController, EventListener<Ev
 		North north = new North();
 		contentPane.appendChild(north);
 		north.appendChild(m_grdNew);
+		north.setCollapsible(true);
+		north.setSplittable(true);
 
 		Center center = new Center();
         contentPane.appendChild(center);
@@ -251,10 +253,12 @@ public class WCharge extends Charge implements IFormController, EventListener<Ev
     private void createAccountPanel()
     {
     	Borderlayout borderlayout = new Borderlayout();
-    	borderlayout.setStyle("position: absolute");
+    	borderlayout.setStyle("position: relative");
     	ZKUpdateUtil.setWidth(borderlayout, "100%");
     	ZKUpdateUtil.setHeight(borderlayout, "100%");
     	m_pnlAccount.appendChild(borderlayout);
+    	ZKUpdateUtil.setWidth(m_pnlAccount, "100%");
+    	ZKUpdateUtil.setHeight(m_pnlAccount, "100%");
 
 		North north = new North();
 		north.setBorder("none");
@@ -319,15 +323,17 @@ public class WCharge extends Charge implements IFormController, EventListener<Ev
 
     	row = new Row();
         rows.appendChild(row);
-        row.appendChild(m_lblValue);
+        row.appendChild(m_lblValue.rightAlign());
         row.appendChild(m_txbValueField);
         row.appendChild(m_chbIsExpense);
+        ZKUpdateUtil.setHflex(m_txbValueField, "1");
 
         row = new Row();
         rows.appendChild(row);
-        row.appendChild(m_lblName);
+        row.appendChild(m_lblName.rightAlign());
         row.appendChild(m_txbNameField);
         row.appendChild(m_btnNew);
+        ZKUpdateUtil.setHflex(m_txbNameField, "1");
 
         row = new Row();
         rows.appendChild(row);

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WCreateFromForm.java

@@ -13,6 +13,7 @@
  *****************************************************************************/
 package org.adempiere.webui.apps.form;
 
+import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.ConfirmPanel;
 import org.adempiere.webui.component.ListModelTable;
@@ -25,6 +26,7 @@ import org.adempiere.webui.event.WTableModelEvent;
 import org.adempiere.webui.event.WTableModelListener;
 import org.adempiere.webui.panel.ADForm;
 import org.adempiere.webui.panel.StatusBarPanel;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.adempiere.webui.window.FDialog;
 import org.compiere.apps.form.CreateFromForm;
@@ -69,6 +71,11 @@ public class WCreateFromForm extends ADForm implements EventListener<Event>, WTa
 	{
 		super();
 		this.form = createFrom;
+		
+		setSizable(true);
+		setMaximizable(true);
+		setBorder("normal");		
+		setSclass("create-from-form");
 	}
 		
 	protected void initForm() 
@@ -95,6 +102,10 @@ public class WCreateFromForm extends ADForm implements EventListener<Event>, WTa
 		North north = new North();
 		contentPane.appendChild(north);
 		north.appendChild(parameterPanel);
+		north.setAutoscroll(true);
+		north.setSplittable(true);
+		north.setCollapsible(true);
+		LayoutUtils.addSlideSclass(north);
 		
 		Center center = new Center();
         contentPane.appendChild(center);
@@ -115,10 +126,19 @@ public class WCreateFromForm extends ADForm implements EventListener<Event>, WTa
 		southPanel.appendChild(new Separator());
 		southPanel.appendChild(statusBar);
 		
-		ZKUpdateUtil.setWidth(this,"750px");
+		if (!ThemeManager.isUseCSSForWindowSize())
-		ZKUpdateUtil.setHeight(this, "550px");
+		{
-		setSizable(true);
+			ZKUpdateUtil.setWindowWidthX(this, 750);
-		setBorder("normal");
+			ZKUpdateUtil.setWindowHeightX(this, 550);
+		}
+		else
+		{
+			addCallback(AFTER_PAGE_ATTACHED, t -> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+			});
+		}
+		
 		ZKUpdateUtil.setWidth(contentPane, "100%");
 		ZKUpdateUtil.setHeight(contentPane, "100%");		
 	}

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WCreateFromInvoiceUI.java

@@ -17,7 +17,11 @@ import java.util.ArrayList;
 import java.util.Vector;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
+import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.apps.AEnv;
+import org.adempiere.webui.component.Column;
+import org.adempiere.webui.component.Columns;
 import org.adempiere.webui.component.Grid;
 import org.adempiere.webui.component.GridFactory;
 import org.adempiere.webui.component.Label;
@@ -46,10 +50,9 @@ import org.compiere.util.DisplayType;
 import org.compiere.util.Env;
 import org.compiere.util.KeyNamePair;
 import org.compiere.util.Msg;
+import org.zkoss.zk.ui.Component;
 import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
-import org.zkoss.zul.Borderlayout;
-import org.zkoss.zul.Center;
 import org.zkoss.zul.Space;
 
 public class WCreateFromInvoiceUI extends CreateFromInvoice implements EventListener<Event>, ValueChangeListener
@@ -100,6 +103,8 @@ public class WCreateFromInvoiceUI extends CreateFromInvoice implements EventList
     /** Combo box for selecting RMA document */
     protected Listbox rmaField = ListboxFactory.newDropdownListbox();
 
+	private Grid parameterStdLayout;
+	
 	/**
 	 *  Dynamic Init
 	 *  @throws Exception if Lookups cannot be initialized
@@ -135,19 +140,16 @@ public class WCreateFromInvoiceUI extends CreateFromInvoice implements EventList
 		shipmentLabel.setText(Msg.getElement(Env.getCtx(), "M_InOut_ID", isSOTrx));
         rmaLabel.setText(Msg.translate(Env.getCtx(), "M_RMA_ID"));
         
-		Borderlayout parameterLayout = new Borderlayout();
-		ZKUpdateUtil.setHeight(parameterLayout, "110px");
-		ZKUpdateUtil.setWidth(parameterLayout, "100%");
     	Panel parameterPanel = window.getParameterPanel();
-		parameterPanel.appendChild(parameterLayout);
 		
-		Grid parameterStdLayout = GridFactory.newGridLayout();
+		parameterStdLayout = GridFactory.newGridLayout();
     	Panel parameterStdPanel = new Panel();
 		parameterStdPanel.appendChild(parameterStdLayout);
 		
-		Center center = new Center();
+		setupColumns(parameterStdLayout);
-		parameterLayout.appendChild(center);
+
-		center.appendChild(parameterStdPanel);
+		parameterPanel.appendChild(parameterStdPanel);
+		ZKUpdateUtil.setVflex(parameterStdLayout, "min");
 		
 		Rows rows = (Rows) parameterStdLayout.newRows();
 		Row row = rows.newRow();
@@ -172,10 +174,47 @@ public class WCreateFromInvoiceUI extends CreateFromInvoice implements EventList
         row.appendChild(rmaLabel.rightAlign());
         ZKUpdateUtil.setHflex(rmaField, "1");
         row.appendChild(rmaField);
+        
+        if (ClientInfo.isMobile()) {    		
+    		if (noOfParameterColumn == 2)
+				LayoutUtils.compactTo(parameterStdLayout, 2);		
+			ClientInfo.onClientInfo(window, this::onClientInfo);
+		}
+        
+        hideEmptyRow(rows);
+	}
+
+	private void hideEmptyRow(org.zkoss.zul.Rows rows) {
+		for(Component a : rows.getChildren()) {
+			Row row = (Row) a;
+			boolean visible = false;
+			for(Component b : row.getChildren()) {
+				if (b instanceof Space)
+					continue;
+				else if (!b.isVisible()) {
+					continue;
+				} else {
+					if (!b.getChildren().isEmpty()) {
+						for (Component c : b.getChildren()) {
+							if (c.isVisible()) {
+								visible = true;
+								break;
+							}
+						}
+					} else {
+						visible = true;
+						break;
+					}
+				}
+			}
+			row.setVisible(visible);
+		}
 	}
 
 	private boolean 	m_actionActive = false;
 
+	private int noOfParameterColumn;
+	
 	/**
 	 *  Action Listener
 	 *  @param e event
@@ -388,4 +427,61 @@ public class WCreateFromInvoiceUI extends CreateFromInvoice implements EventList
 	public Object getWindow() {
 		return window;
 	}
+	
+	protected void setupColumns(Grid parameterGrid) {
+		noOfParameterColumn = ClientInfo.maxWidth((ClientInfo.EXTRA_SMALL_WIDTH+ClientInfo.SMALL_WIDTH)/2) ? 2 : 4;
+		Columns columns = new Columns();
+		parameterGrid.appendChild(columns);
+		if (ClientInfo.maxWidth((ClientInfo.EXTRA_SMALL_WIDTH+ClientInfo.SMALL_WIDTH)/2))
+		{
+			Column column = new Column();
+			ZKUpdateUtil.setWidth(column, "35%");
+			columns.appendChild(column);
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "65%");
+			columns.appendChild(column);
+		}
+		else
+		{
+			Column column = new Column();
+			columns.appendChild(column);		
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "15%");
+			columns.appendChild(column);
+			ZKUpdateUtil.setWidth(column, "35%");
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "15%");
+			columns.appendChild(column);
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "35%");
+			columns.appendChild(column);
+		}
+	}
+	
+	protected void onClientInfo()
+	{
+		if (ClientInfo.isMobile() && parameterStdLayout != null && parameterStdLayout.getRows() != null)
+		{
+			int nc = ClientInfo.maxWidth((ClientInfo.EXTRA_SMALL_WIDTH+ClientInfo.SMALL_WIDTH)/2) ? 2 : 4;
+			int cc = noOfParameterColumn;
+			if (nc == cc)
+				return;
+			
+			parameterStdLayout.getColumns().detach();
+			setupColumns(parameterStdLayout);
+			if (cc > nc)
+			{
+				LayoutUtils.compactTo(parameterStdLayout, nc);
+			}
+			else
+			{
+				LayoutUtils.expandTo(parameterStdLayout, nc, false);
+			}
+			hideEmptyRow(parameterStdLayout.getRows());
+			
+			ZKUpdateUtil.setCSSHeight(window);
+			ZKUpdateUtil.setCSSWidth(window);
+			window.invalidate();			
+		}
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WCreateFromRMAUI.java

@@ -16,6 +16,7 @@ package org.adempiere.webui.apps.form;
 import java.util.Vector;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.component.Grid;
 import org.adempiere.webui.component.GridFactory;
@@ -40,8 +41,6 @@ import org.compiere.util.CLogger;
 import org.compiere.util.DisplayType;
 import org.compiere.util.Env;
 import org.compiere.util.Msg;
-import org.zkoss.zul.Borderlayout;
-import org.zkoss.zul.Center;
 
 public class WCreateFromRMAUI extends CreateFromRMA implements ValueChangeListener
 {
@@ -105,25 +104,24 @@ public class WCreateFromRMAUI extends CreateFromRMA implements ValueChangeListen
 	{
 		bPartnerLabel.setText(Msg.getElement(Env.getCtx(), "C_BPartner_ID"));
         
-		Borderlayout parameterLayout = new Borderlayout();
-		ZKUpdateUtil.setHeight(parameterLayout, "110px");
-		ZKUpdateUtil.setWidth(parameterLayout, "100%");
     	Panel parameterPanel = window.getParameterPanel();
-		parameterPanel.appendChild(parameterLayout);
 		
 		Grid parameterStdLayout = GridFactory.newGridLayout();
     	Panel parameterStdPanel = new Panel();
 		parameterStdPanel.appendChild(parameterStdLayout);
 
-		Center center = new Center();
+		parameterPanel.appendChild(parameterStdPanel);
-		parameterLayout.appendChild(center);
+		ZKUpdateUtil.setVflex(parameterStdLayout, "min");
-		center.appendChild(parameterStdPanel);
 		
 		Rows rows = (Rows) parameterStdLayout.newRows();
 		Row row = rows.newRow();
 		row.appendChild(bPartnerLabel.rightAlign());
 		if (bPartnerField != null)
 			row.appendChild(bPartnerField.getComponent());
+		
+		if (ClientInfo.isMobile()) {
+			ClientInfo.onClientInfo(window, this::onClientInfo);
+		}
 	}
 	
 	/**
@@ -196,4 +194,10 @@ public class WCreateFromRMAUI extends CreateFromRMA implements ValueChangeListen
 	public Object getWindow() {
 		return window;
 	}
+	
+	protected void onClientInfo() {
+		ZKUpdateUtil.setCSSHeight(window);
+		ZKUpdateUtil.setCSSWidth(window);
+		window.invalidate();
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WCreateFromShipmentUI.java

@@ -21,8 +21,12 @@ import java.util.Vector;
 import java.util.logging.Level;
 
 import org.adempiere.exceptions.AdempiereException;
+import org.adempiere.webui.ClientInfo;
+import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.component.Checkbox;
+import org.adempiere.webui.component.Column;
+import org.adempiere.webui.component.Columns;
 import org.adempiere.webui.component.Grid;
 import org.adempiere.webui.component.GridFactory;
 import org.adempiere.webui.component.Label;
@@ -114,6 +118,10 @@ public class WCreateFromShipmentUI extends CreateFromShipment implements EventLi
 	protected Label upcLabel = new Label();
 	protected WStringEditor upcField = new WStringEditor();
 
+	private Grid parameterStdLayout;
+
+	private int noOfParameterColumn;
+    
 	/**
 	 *  Dynamic Init
 	 *  @throws Exception if Lookups cannot be initialized
@@ -157,13 +165,16 @@ public class WCreateFromShipmentUI extends CreateFromShipment implements EventLi
         upcLabel.setText(Msg.getElement(Env.getCtx(), "UPC", false));
 
 		Vlayout vlayout = new Vlayout();
-		ZKUpdateUtil.setVflex(vlayout, "1");
+		ZKUpdateUtil.setVflex(vlayout, "min");
 		ZKUpdateUtil.setWidth(vlayout, "100%");
     	Panel parameterPanel = window.getParameterPanel();
 		parameterPanel.appendChild(vlayout);
 		
-		Grid parameterStdLayout = GridFactory.newGridLayout();
+		parameterStdLayout = GridFactory.newGridLayout();
     	vlayout.appendChild(parameterStdLayout);
+    	ZKUpdateUtil.setVflex(vlayout, "parameterStdLayout");
+    	
+    	setupColumns(parameterStdLayout);
 		
 		Rows rows = (Rows) parameterStdLayout.newRows();
 		Row row = rows.newRow();
@@ -194,12 +205,19 @@ public class WCreateFromShipmentUI extends CreateFromShipment implements EventLi
 		row = rows.newRow();
 		row.appendChild(upcLabel.rightAlign());
 		row.appendChild(upcField.getComponent());
+		ZKUpdateUtil.setHflex(upcField.getComponent(), "1");
     	if (isRMAWindow) {
             // Add RMA document selection to panel
             row.appendChild(rmaLabel.rightAlign());
             row.appendChild(rmaField);
             ZKUpdateUtil.setHflex(rmaField, "1");
     	}
+    	
+    	if (ClientInfo.isMobile()) {    		
+    		if (noOfParameterColumn == 2)
+				LayoutUtils.compactTo(parameterStdLayout, 2);		
+			ClientInfo.onClientInfo(window, this::onClientInfo);
+		}
 	}
 
 	private boolean 	m_actionActive = false;
@@ -559,4 +577,60 @@ public class WCreateFromShipmentUI extends CreateFromShipment implements EventLi
 	public Object getWindow() {
 		return window;
 	}
+	
+	protected void setupColumns(Grid parameterGrid) {
+		noOfParameterColumn = ClientInfo.maxWidth((ClientInfo.EXTRA_SMALL_WIDTH+ClientInfo.SMALL_WIDTH)/2) ? 2 : 4;
+		Columns columns = new Columns();
+		parameterGrid.appendChild(columns);
+		if (ClientInfo.maxWidth((ClientInfo.EXTRA_SMALL_WIDTH+ClientInfo.SMALL_WIDTH)/2))
+		{
+			Column column = new Column();
+			ZKUpdateUtil.setWidth(column, "35%");
+			columns.appendChild(column);
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "65%");
+			columns.appendChild(column);
+		}
+		else
+		{
+			Column column = new Column();
+			columns.appendChild(column);		
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "15%");
+			columns.appendChild(column);
+			ZKUpdateUtil.setWidth(column, "35%");
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "15%");
+			columns.appendChild(column);
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "35%");
+			columns.appendChild(column);
+		}
+	}
+	
+	protected void onClientInfo()
+	{
+		if (ClientInfo.isMobile() && parameterStdLayout != null && parameterStdLayout.getRows() != null)
+		{
+			int nc = ClientInfo.maxWidth((ClientInfo.EXTRA_SMALL_WIDTH+ClientInfo.SMALL_WIDTH)/2) ? 2 : 4;
+			int cc = noOfParameterColumn;
+			if (nc == cc)
+				return;
+			
+			parameterStdLayout.getColumns().detach();
+			setupColumns(parameterStdLayout);
+			if (cc > nc)
+			{
+				LayoutUtils.compactTo(parameterStdLayout, nc);
+			}
+			else
+			{
+				LayoutUtils.expandTo(parameterStdLayout, nc, false);
+			}
+			
+			ZKUpdateUtil.setCSSHeight(window);
+			ZKUpdateUtil.setCSSWidth(window);
+			window.invalidate();			
+		}
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WCreateFromStatementUI.java

@@ -19,6 +19,8 @@ import java.sql.Timestamp;
 import java.util.Vector;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
+import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Column;
@@ -53,8 +55,6 @@ import org.compiere.util.Msg;
 import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
 import org.zkoss.zk.ui.event.Events;
-import org.zkoss.zul.Borderlayout;
-import org.zkoss.zul.Center;
 import org.zkoss.zul.Hbox;
 
 /**
@@ -124,6 +124,8 @@ public class WCreateFromStatementUI extends CreateFromStatement implements Event
 	protected Label dateToLabel = new Label("-");
 	protected WDateEditor dateToField = new WDateEditor("DateTo", false, false, true, Msg.translate(Env.getCtx(), "DateTo"));
 
+	protected Grid parameterBankLayout;
+
 	/**
 	 *  Dynamic Init
 	 *  @throws Exception if Lookups cannot be initialized
@@ -179,6 +181,8 @@ public class WCreateFromStatementUI extends CreateFromStatement implements Event
 	
 	protected void zkInit() throws Exception
 	{
+		LayoutUtils.addSclass("create-from-bank-statement", window);
+		
 		bankAccountLabel.setText(Msg.translate(Env.getCtx(), "C_BankAccount_ID"));
     	authorizationLabel.setText(Msg.translate(Env.getCtx(), "R_AuthCode"));
     	
@@ -191,34 +195,13 @@ public class WCreateFromStatementUI extends CreateFromStatement implements Event
     	amtFromField.getComponent().setTooltiptext(Msg.translate(Env.getCtx(), "AmtFrom"));
     	amtToField.getComponent().setTooltiptext(Msg.translate(Env.getCtx(), "AmtTo"));
     	
-    	Borderlayout parameterLayout = new Borderlayout();
-    	ZKUpdateUtil.setHeight(parameterLayout, "130px");
-    	ZKUpdateUtil.setWidth(parameterLayout, "100%");
     	Panel parameterPanel = window.getParameterPanel();
-		parameterPanel.appendChild(parameterLayout);
 		
-		Grid parameterBankLayout = GridFactory.newGridLayout();
+		parameterBankLayout = GridFactory.newGridLayout();
-    	Panel parameterBankPanel = new Panel();
+    	ZKUpdateUtil.setVflex(parameterBankLayout, "min");
-    	parameterBankPanel.appendChild(parameterBankLayout);
+    	parameterPanel.appendChild(parameterBankLayout);
 
-		Center center = new Center();
+		setupColumns(parameterBankLayout);
-		parameterLayout.appendChild(center);
-		center.appendChild(parameterBankPanel);
-		
-		Columns columns = new Columns();
-		parameterBankLayout.appendChild(columns);
-		Column column = new Column();
-		columns.appendChild(column);		
-		column = new Column();
-		ZKUpdateUtil.setWidth(column, "15%");
-		columns.appendChild(column);
-		ZKUpdateUtil.setWidth(column, "35%");
-		column = new Column();
-		ZKUpdateUtil.setWidth(column, "15%");
-		columns.appendChild(column);
-		column = new Column();
-		ZKUpdateUtil.setWidth(column, "35%");
-		columns.appendChild(column);
 		
 		Rows rows = (Rows) parameterBankLayout.newRows();
 		Row row = rows.newRow();
@@ -254,6 +237,41 @@ public class WCreateFromStatementUI extends CreateFromStatement implements Event
 		hbox.appendChild(dateToLabel.rightAlign());
 		hbox.appendChild(dateToField.getComponent());
 		row.appendChild(hbox);
+		
+		if (ClientInfo.isMobile()) {
+			if (ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH))
+				LayoutUtils.compactTo(parameterBankLayout, 2);		
+			ClientInfo.onClientInfo(window, this::onClientInfo);
+		}
+	}
+
+	protected void setupColumns(Grid parameterBankLayout) {
+		Columns columns = new Columns();
+		parameterBankLayout.appendChild(columns);
+		if (ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH))
+		{
+			Column column = new Column();
+			ZKUpdateUtil.setWidth(column, "35%");
+			columns.appendChild(column);
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "65%");
+			columns.appendChild(column);
+		}
+		else
+		{
+			Column column = new Column();
+			columns.appendChild(column);		
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "15%");
+			columns.appendChild(column);
+			ZKUpdateUtil.setWidth(column, "35%");
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "15%");
+			columns.appendChild(column);
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "35%");
+			columns.appendChild(column);
+		}
 	}
 
 	/**
@@ -309,4 +327,30 @@ public class WCreateFromStatementUI extends CreateFromStatement implements Event
 	{
 		return window;
 	}
+	
+	protected void onClientInfo()
+	{
+		if (ClientInfo.isMobile() && parameterBankLayout != null && parameterBankLayout.getColumns() != null)
+		{
+			org.zkoss.zul.Rows rows = parameterBankLayout.getRows();
+			if (rows != null)
+			{
+				int nc = ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH) ? 2 : 4;
+				int cc = rows.getFirstChild().getChildren().size();
+				if (cc != nc)
+				{
+					parameterBankLayout.getColumns().detach();
+					setupColumns(parameterBankLayout);
+					if (cc > nc)
+						LayoutUtils.compactTo(parameterBankLayout, nc);
+					else
+						LayoutUtils.expandTo(parameterBankLayout, nc);
+					
+					ZKUpdateUtil.setCSSHeight(window);
+					ZKUpdateUtil.setCSSWidth(window);
+					window.invalidate();
+				}				
+			}
+		}
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WCreateFromWindow.java

@@ -13,6 +13,7 @@
  *****************************************************************************/
 package org.adempiere.webui.apps.form;
 
+import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.ConfirmPanel;
 import org.adempiere.webui.component.ListModelTable;
@@ -25,6 +26,7 @@ import org.adempiere.webui.event.DialogEvents;
 import org.adempiere.webui.event.WTableModelEvent;
 import org.adempiere.webui.event.WTableModelListener;
 import org.adempiere.webui.panel.StatusBarPanel;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.adempiere.webui.window.FDialog;
 import org.compiere.grid.CreateFrom;
@@ -88,6 +90,12 @@ public class WCreateFromWindow extends Window implements EventListener<Event>, W
 		North north = new North();
 		contentPane.appendChild(north);
 		north.appendChild(parameterPanel);
+		north.setAutoscroll(true);
+		north.setSplittable(true);
+		north.setCollapsible(true);
+		LayoutUtils.addSlideSclass(north);
+		ZKUpdateUtil.setVflex(parameterPanel, "1");
+		ZKUpdateUtil.setHflex(parameterPanel, "1");
 		
 		Center center = new Center();
         contentPane.appendChild(center);
@@ -108,8 +116,19 @@ public class WCreateFromWindow extends Window implements EventListener<Event>, W
 		southPanel.appendChild(new Separator());
 		southPanel.appendChild(statusBar);
 		
-		ZKUpdateUtil.setWidth(this, "750px");
+		if (!ThemeManager.isUseCSSForWindowSize())
-		ZKUpdateUtil.setHeight(this, "550px");
+		{
+			ZKUpdateUtil.setWindowWidthX(this, 750);
+			ZKUpdateUtil.setWindowHeightX(this, 550);
+		}
+		else
+		{
+			addCallback(AFTER_PAGE_ATTACHED, t -> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+			});
+		}
+		setSclass("create-from-window");
 		setSizable(true);
 		setBorder("normal");
 		ZKUpdateUtil.setWidth(contentPane, "100%");

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WFactReconcile.java

@@ -8,6 +8,8 @@ import java.util.Calendar;
 import java.util.Vector;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
+import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Checkbox;
@@ -168,9 +170,13 @@ implements IFormController, EventListener<Event>, WTableModelListener, ValueChan
 		
 		// Parameter Panel
 		North north = new North();
-		north.setStyle("border: none");
+		north.setStyle("border: none; max-height: 60%;");
 		mainLayout.appendChild(north);
 		north.appendChild(parameterPanel);
+		north.setCollapsible(true);
+		north.setSplittable(true);
+		north.setAutoscroll(true);
+		LayoutUtils.addSlideSclass(north);
 		
 		Rows rows = null;
 		Row row = null;
@@ -205,12 +211,17 @@ implements IFormController, EventListener<Event>, WTableModelListener, ValueChan
 		row.appendCellChild(fieldDateAcct2.getComponent(), 2);
 		row = rows.newRow();
 		row.appendChild(bRefresh);
+		if (ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH-1))
+		{
+			LayoutUtils.compactTo(parameterLayout, 3);
+			LayoutUtils.addSclass("btn-small small-img-btn", bRefresh);
+		}
 		
 		// Data Panel
 		Center center = new Center();
 		mainLayout.appendChild(center);
 		center.appendChild(miniTable);
-		ZKUpdateUtil.setWidth(miniTable, "99%");
+		ZKUpdateUtil.setWidth(miniTable, "100%");
 		//ZKUpdateUtil.setHeight(miniTable, "99%");
 		center.setStyle("border: none");
 		
@@ -220,22 +231,38 @@ implements IFormController, EventListener<Event>, WTableModelListener, ValueChan
 		mainLayout.appendChild(south);
 		south.appendChild(commandPanel);
 		commandPanel.appendChild(commandLayout);
-		ZKUpdateUtil.setWidth(commandLayout, "90%");
+		ZKUpdateUtil.setWidth(commandLayout, "100%");
 		rows = commandLayout.newRows();
 		row = rows.newRow();
-		row.appendCellChild(bZoom, 2);
+		row.appendCellChild(bZoom, 1);
 		ZKUpdateUtil.setHflex(bZoom, "true");
 		ZKUpdateUtil.setWidth(bZoom, "100%");
 		row.appendCellChild(differenceLabel.rightAlign());
 		ZKUpdateUtil.setHflex(differenceLabel, "true");
 		row.appendCellChild(differenceField, 2);
 		ZKUpdateUtil.setHflex(differenceField, "true");
-		row.appendCellChild(bGenerate, 2);
+		row.appendCellChild(bGenerate, 1);
 		ZKUpdateUtil.setHflex(bGenerate, "true");
-		row.appendCellChild(bReset, 2);
+		row.appendCellChild(bReset, 1);
 		ZKUpdateUtil.setHflex(bReset, "true");
 		row.appendCellChild(bCancel);
 		ZKUpdateUtil.setHflex(bCancel, "true");
+		if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1)) 
+		{
+			bZoom.setTooltiptext(bZoom.getLabel());
+			bZoom.setLabel(null);
+			bGenerate.setTooltiptext(bGenerate.getLabel());
+			bGenerate.setLabel(null);
+			bReset.setTooltiptext(bReset.getLabel());
+			bReset.setLabel(null);
+			if (ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH-1))
+			{
+				LayoutUtils.addSclass("btn-small small-img-btn", bZoom);
+				LayoutUtils.addSclass("btn-small small-img-btn", bGenerate);
+				LayoutUtils.addSclass("btn-small small-img-btn", bReset);
+				LayoutUtils.addSclass("btn-small small-img-btn", bCancel);
+			}
+		}
 	}
 	
 	/**

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WGenForm.java

@@ -122,20 +122,20 @@ public class WGenForm extends ADForm implements EventListener<Event>, WTableMode
 			dynInit();
 			Borderlayout contentPane = new Borderlayout();
 			this.appendChild(contentPane);
-			ZKUpdateUtil.setWidth(contentPane, "99%");
+			ZKUpdateUtil.setWidth(contentPane, "100%");
 			ZKUpdateUtil.setHeight(contentPane, "100%");
 			Center center = new Center();
-			center.setStyle("border: none");
+			center.setBorder("none");
 			contentPane.appendChild(center);
 			center.appendChild(tabbedPane);
 			ZKUpdateUtil.setVflex(tabbedPane, "1");
 			ZKUpdateUtil.setHflex(tabbedPane, "1");
 			South south = new South();
-			south.setStyle("border: none");
+			south.setBorder("none");
 			contentPane.appendChild(south);
 			south.appendChild(statusBar);
 			LayoutUtils.addSclass("status-border", statusBar);
-			ZKUpdateUtil.setHeight(south, "22px");			
+			ZKUpdateUtil.setVflex(south, "min");
 		}
 		catch(Exception ex)
 		{
@@ -157,9 +157,9 @@ public class WGenForm extends ADForm implements EventListener<Event>, WTableMode
 	void zkInit() throws Exception
 	{
 		//
-		ZKUpdateUtil.setWidth(selPanel, "99%");
+		ZKUpdateUtil.setWidth(selPanel, "100%");
-		ZKUpdateUtil.setHeight(selPanel, "90%");
+		ZKUpdateUtil.setHeight(selPanel, "100%");
-		selPanel.setStyle("border: none; position: absolute");
+		selPanel.setStyle("border: none; position: relative");
 		DesktopTabpanel tabpanel = new DesktopTabpanel();
 		tabpanel.appendChild(selPanel);
 		Tabpanels tabPanels = new Tabpanels();
@@ -173,6 +173,9 @@ public class WGenForm extends ADForm implements EventListener<Event>, WTableMode
 		North north = new North();
 		selPanel.appendChild(north);
 		north.appendChild(selNorthPanel);
+		north.setCollapsible(true);
+		north.setSplittable(true);
+		LayoutUtils.addSlideSclass(north);
 		
 		South south = new South();
 		selPanel.appendChild(south);
@@ -192,9 +195,9 @@ public class WGenForm extends ADForm implements EventListener<Event>, WTableMode
 		tab = new Tab(Msg.getMsg(Env.getCtx(), "Generate"));
 		tabs.appendChild(tab);
 		tab.setDisabled(true);
-		ZKUpdateUtil.setWidth(genPanel, "99%");
+		ZKUpdateUtil.setWidth(genPanel, "100%");
-		ZKUpdateUtil.setHeight(genPanel, "90%");
+		ZKUpdateUtil.setHeight(genPanel, "100%");
-		genPanel.setStyle("border: none; position: absolute");
+		genPanel.setStyle("border: none; position: relative");
 		center = new Center();
 		genPanel.appendChild(center);
 		messageDiv = new Div();
@@ -576,4 +579,5 @@ public class WGenForm extends ADForm implements EventListener<Event>, WTableMode
 		}
     	messageDiv.appendChild(logMessageTable);
 	}
-		}
+	
+}

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WInOutGen.java

@@ -16,6 +16,10 @@ package org.adempiere.webui.apps.form;
 import java.util.ArrayList;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
+import org.adempiere.webui.LayoutUtils;
+import org.adempiere.webui.component.Column;
+import org.adempiere.webui.component.Columns;
 import org.adempiere.webui.component.Label;
 import org.adempiere.webui.component.Listbox;
 import org.adempiere.webui.component.ListboxFactory;
@@ -38,10 +42,11 @@ import org.compiere.util.DisplayType;
 import org.compiere.util.Env;
 import org.compiere.util.KeyNamePair;
 import org.compiere.util.Msg;
+import org.zkoss.zk.ui.Component;
 import org.zkoss.zk.ui.WrongValueException;
 import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
-import org.zkoss.zul.Space;
+import org.zkoss.zul.North;
 
 /**
  * Generate Shipment (manual) view class
@@ -63,6 +68,8 @@ public class WInOutGen extends InOutGen implements IFormController, EventListene
 	private Label   lDocAction = new Label();
 	private WTableDirEditor docAction;
 
+	private int noOfColumn;
+
 	public WInOutGen()
 	{
 		log.info("");
@@ -82,6 +89,8 @@ public class WInOutGen extends InOutGen implements IFormController, EventListene
 		{
 			log.log(Level.SEVERE, "init", ex);
 		}
+		
+		ClientInfo.onClientInfo(form, this::onClientInfo);
 	}	//	init
 
 	/**
@@ -97,30 +106,54 @@ public class WInOutGen extends InOutGen implements IFormController, EventListene
 	 */
 	void zkInit() throws Exception
 	{
+		setupColumns();
+			
 		lBPartner.setText(Msg.translate(Env.getCtx(), "C_BPartner_ID"));
 
 		Row row = form.getParameterPanel().newRows().newRow();
 		row.appendCellChild(lWarehouse.rightAlign());
 		ZKUpdateUtil.setHflex(fWarehouse.getComponent(), "true");
 		row.appendCellChild(fWarehouse.getComponent());
-		row.appendCellChild(new Space());
 		row.appendCellChild(lBPartner.rightAlign());
 		ZKUpdateUtil.setHflex(fBPartner.getComponent(), "true");
 		row.appendCellChild(fBPartner.getComponent());		
-		row.appendCellChild(new Space());
 
 		row = new Row();
 		form.getParameterPanel().getRows().appendChild(row);
 		row.appendCellChild(lDocType.rightAlign());
 		ZKUpdateUtil.setHflex(cmbDocType, "true");
 		row.appendCellChild(cmbDocType);
-		row.appendCellChild(new Space());
 		row.appendCellChild(lDocAction.rightAlign());
 		ZKUpdateUtil.setHflex(docAction.getComponent(), "true");		
 		row.appendCellChild(docAction.getComponent());
-		row.appendCellChild(new Space());
+		if (noOfColumn < 6)
+			LayoutUtils.compactTo(form.getParameterPanel(), noOfColumn);
+		else
+			LayoutUtils.expandTo(form.getParameterPanel(), noOfColumn, true);
 	}	//	jbInit
 
+	protected void setupColumns() {
+		noOfColumn = 6;
+		if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1))
+		{
+			if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1))
+				noOfColumn = 2;
+			else
+				noOfColumn = 4;
+		}
+		if (noOfColumn == 2)
+		{
+			Columns columns = new Columns();
+			Column column = new Column();
+			column.setWidth("35%");
+			columns.appendChild(column);
+			column = new Column();
+			column.setWidth("65%");
+			columns.appendChild(column);
+			form.getParameterPanel().appendChild(columns);
+		}
+	}
+
 	/**
 	 *	Fill Picks.
 	 *		Column_ID from C_Order
@@ -165,10 +198,44 @@ public class WInOutGen extends InOutGen implements IFormController, EventListene
 	{
 		KeyNamePair docTypeKNPair = cmbDocType.getSelectedItem().toKeyNamePair();
 		executeQuery(docTypeKNPair, form.getMiniTable());
+		if (ClientInfo.maxHeight(ClientInfo.SMALL_HEIGHT-1))
+		{
+			Component comp = form.getParameterPanel().getParent();
+			if (comp instanceof North)
+				((North)comp).setOpen(false);
+		}
 		form.getMiniTable().repaint();
 		form.invalidate();
 	}   //  executeQuery
 
+	protected void onClientInfo()
+	{
+		if (ClientInfo.isMobile() && form.getPage() != null) 
+		{
+			if (noOfColumn > 0 && form.getParameterPanel().getRows() != null)
+			{
+				int t = 6;
+				if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1))
+				{
+					if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1))
+						t = 2;
+					else
+						t = 4;
+				}
+				if (t != noOfColumn)
+				{
+					form.getParameterPanel().getRows().detach();
+					if (form.getParameterPanel().getColumns() != null)
+						form.getParameterPanel().getColumns().detach();
+					try {
+						zkInit();
+						form.invalidate();
+					} catch (Exception e1) {}
+				}
+			}
+		}
+	}
+	
 	/**
 	 *	Action Listener
 	 *  @param e event

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WInvoiceGen.java

@@ -16,6 +16,10 @@ package org.adempiere.webui.apps.form;
 import java.util.ArrayList;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
+import org.adempiere.webui.LayoutUtils;
+import org.adempiere.webui.component.Column;
+import org.adempiere.webui.component.Columns;
 import org.adempiere.webui.component.Label;
 import org.adempiere.webui.component.Listbox;
 import org.adempiere.webui.component.ListboxFactory;
@@ -38,10 +42,11 @@ import org.compiere.util.DisplayType;
 import org.compiere.util.Env;
 import org.compiere.util.KeyNamePair;
 import org.compiere.util.Msg;
+import org.zkoss.zk.ui.Component;
 import org.zkoss.zk.ui.WrongValueException;
 import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
-import org.zkoss.zul.Space;
+import org.zkoss.zul.North;
 
 /**
  * Generate Invoice (manual) view class
@@ -63,6 +68,8 @@ public class WInvoiceGen extends InvoiceGen implements IFormController, EventLis
 	private Label   lDocAction = new Label();
 	private WTableDirEditor docAction;
 
+	private int noOfColumn;
+	
 	public WInvoiceGen()
 	{
 		log.info("");
@@ -82,6 +89,8 @@ public class WInvoiceGen extends InvoiceGen implements IFormController, EventLis
 		{
 			log.log(Level.SEVERE, "init", ex);
 		}
+		
+		ClientInfo.onClientInfo(form, this::onClientInfo);
 	}	//	init
 
 	/**
@@ -97,6 +106,8 @@ public class WInvoiceGen extends InvoiceGen implements IFormController, EventLis
 	 */
 	void zkInit() throws Exception
 	{
+		setupColumns();
+		
 		lOrg.setText(Msg.translate(Env.getCtx(), "AD_Org_ID"));
 		lBPartner.setText(Msg.translate(Env.getCtx(), "C_BPartner_ID"));
 
@@ -104,24 +115,46 @@ public class WInvoiceGen extends InvoiceGen implements IFormController, EventLis
 		row.appendCellChild(lOrg.rightAlign());
 		ZKUpdateUtil.setHflex(fOrg.getComponent(), "true");
 		row.appendCellChild(fOrg.getComponent());
-		row.appendCellChild(new Space());
 		row.appendCellChild(lBPartner.rightAlign());
 		ZKUpdateUtil.setHflex(fBPartner.getComponent(), "true");
 		row.appendCellChild(fBPartner.getComponent());
-		row.appendCellChild(new Space());
 
 		row = new Row();
 		form.getParameterPanel().getRows().appendChild(row);
 		row.appendCellChild(lDocType.rightAlign());
 		ZKUpdateUtil.setHflex(cmbDocType, "true");
 		row.appendCellChild(cmbDocType);
-		row.appendCellChild(new Space());
 		row.appendCellChild(lDocAction.rightAlign());
 		ZKUpdateUtil.setHflex(docAction.getComponent(), "true");
 		row.appendCellChild(docAction.getComponent());
-		row.appendCellChild(new Space());
+		if (noOfColumn < 6)
+			LayoutUtils.compactTo(form.getParameterPanel(), noOfColumn);
+		else
+			LayoutUtils.expandTo(form.getParameterPanel(), noOfColumn, true);
 	}	//	jbInit
 
+	protected void setupColumns() {
+		noOfColumn = 6;
+		if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1))
+		{
+			if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1))
+				noOfColumn = 2;
+			else
+				noOfColumn = 4;
+		}
+		if (noOfColumn == 2)
+		{
+			Columns columns = new Columns();
+			Column column = new Column();
+			column.setWidth("35%");
+			columns.appendChild(column);
+			column = new Column();
+			column.setWidth("65%");
+			columns.appendChild(column);
+			form.getParameterPanel().appendChild(columns);
+		}
+	}
+
 	/**
 	 *	Fill Picks.
 	 *		Column_ID from C_Order
@@ -164,10 +197,44 @@ public class WInvoiceGen extends InvoiceGen implements IFormController, EventLis
 	{
 		KeyNamePair docTypeKNPair = cmbDocType.getSelectedItem().toKeyNamePair();
 		executeQuery(docTypeKNPair, form.getMiniTable());
+		if (ClientInfo.maxHeight(ClientInfo.SMALL_HEIGHT-1))
+		{
+			Component comp = form.getParameterPanel().getParent();
+			if (comp instanceof North)
+				((North)comp).setOpen(false);
+		}
 		form.getMiniTable().repaint();
 		form.invalidate();
 	}   //  executeQuery
 
+	protected void onClientInfo()
+	{
+		if (ClientInfo.isMobile() && form.getPage() != null) 
+		{
+			if (noOfColumn > 0 && form.getParameterPanel().getRows() != null)
+			{
+				int t = 6;
+				if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1))
+				{
+					if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1))
+						t = 2;
+					else
+						t = 4;
+				}
+				if (t != noOfColumn)
+				{
+					form.getParameterPanel().getRows().detach();
+					if (form.getParameterPanel().getColumns() != null)
+						form.getParameterPanel().getColumns().detach();
+					try {
+						zkInit();
+						form.invalidate();
+					} catch (Exception e1) {}
+				}
+			}
+		}
+	}
+	
 	/**
 	 *	Action Listener
 	 *  @param e event

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WMatch.java

@@ -16,14 +16,21 @@
  *****************************************************************************/
 package org.adempiere.webui.apps.form;
 
+import static org.adempiere.webui.ClientInfo.MEDIUM_WIDTH;
+import static org.adempiere.webui.ClientInfo.SMALL_WIDTH;
+import static org.adempiere.webui.ClientInfo.maxWidth;
+
 import java.math.BigDecimal;
 import java.sql.Timestamp;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Checkbox;
+import org.adempiere.webui.component.Column;
+import org.adempiere.webui.component.Columns;
 import org.adempiere.webui.component.Grid;
 import org.adempiere.webui.component.GridFactory;
 import org.adempiere.webui.component.Label;
@@ -63,6 +70,7 @@ import org.zkoss.zul.North;
 import org.zkoss.zul.South;
 import org.zkoss.zul.Separator;
 import org.zkoss.zul.Space;
+import org.zkoss.zul.Vlayout;
 
 /**
  *  Manual Matching
@@ -110,6 +118,11 @@ public class WMatch extends Match
 		{
 			log.log(Level.SEVERE, "", e);
 		}
+		
+		if (ClientInfo.isMobile()) 
+		{
+			ClientInfo.onClientInfo(form, this::onClientInfo);
+		}
 	}	//	init
 
 	/**	Window No			*/
@@ -182,6 +195,7 @@ public class WMatch extends Match
 	private Checkbox sameProduct = new Checkbox();
 	private Checkbox sameBPartner = new Checkbox();
 	private Checkbox sameQty = new Checkbox();
+	private int noOfColumn;
 	
 	/**
 	 *  Static Init.
@@ -199,10 +213,11 @@ public class WMatch extends Match
 	private void zkInit() throws Exception
 	{
 		form.appendChild(mainPanel);
-		mainPanel.setStyle("width: 99%; height: 100%; padding: 0; margin: 0");
+		mainPanel.setStyle("width: 100%; height: 100%; padding: 0; margin: 0; overflow: auto;");
 		mainPanel.appendChild(mainLayout);
 		ZKUpdateUtil.setWidth(mainLayout, "100%");
 		ZKUpdateUtil.setHeight(mainLayout, "100%");
+		mainLayout.setStyle("min-height: 750px");
 		northPanel.appendChild(northLayout);
 		matchFromLabel.setText(Msg.translate(Env.getCtx(), "MatchFrom"));
 		matchToLabel.setText(Msg.translate(Env.getCtx(), "MatchTo"));
@@ -225,9 +240,64 @@ public class WMatch extends Match
 		sameQty.setSelected(false);
 		sameQty.setText(Msg.translate(Env.getCtx(), "SameQty"));
 		
+		// north - parameters
 		North north = new North();
 		mainLayout.appendChild(north);
 		north.appendChild(northPanel);
+		north.setCollapsible(true);
+		north.setSplittable(true);
+		
+		layoutParameterAndSummary();
+		
+		// center - match from and match to list
+		Center center = new Center();
+		center.setAutoscroll(true);
+		mainLayout.appendChild(center);
+		center.appendChild(centerPanel);
+		ZKUpdateUtil.setHflex(centerPanel, "1");
+		ZKUpdateUtil.setVflex(centerPanel, "1");
+		ZKUpdateUtil.setWidth(centerLayout, "100%");
+		ZKUpdateUtil.setHeight(centerLayout, "100%");
+		north = new North();
+		centerLayout.appendChild(north);
+		north.setStyle("border: none");
+		Panel p = new Panel();
+		p.appendChild(xMatchedBorder);
+		p.appendChild(xMatchedTable);
+		ZKUpdateUtil.setWidth(xMatchedTable, "100%");
+		p.setStyle("width: 100%; height: 100%; padding: 0; margin: 0");
+		north.appendChild(p);
+		ZKUpdateUtil.setHeight(north, "45%");
+		north.setSplittable(true);
+		north.setCollapsible(true);
+						
+		center = new Center();
+		centerLayout.appendChild(center);
+		center.setBorder("none");
+		Vlayout vlayout = new Vlayout();
+		vlayout.setVflex("1");
+		vlayout.setHflex("1");
+		center.appendChild(vlayout);
+		ZKUpdateUtil.setVflex(xPanel, "1");
+		ZKUpdateUtil.setHflex(xPanel, "1");
+		xPanel.appendChild(sameBPartner);
+		xPanel.appendChild(new Space());
+		xPanel.appendChild(sameProduct);
+		xPanel.appendChild(new Space());
+		xPanel.appendChild(sameQty);
+		ZKUpdateUtil.setVflex(xPanel, "min");
+		xPanel.appendChild(new Separator());
+		vlayout.appendChild(xPanel);
+		vlayout.appendChild(xMatchedToBorder);
+		ZKUpdateUtil.setWidth(xMatchedToTable, "100%");
+		vlayout.appendChild(xMatchedToTable);
+		ZKUpdateUtil.setVflex(xMatchedTable, true);
+				
+		centerPanel.setStyle("min-height: 300px;");
+	}   //  jbInit
+
+	protected void layoutParameterAndSummary() {
+		setupParameterColumns();
 		
 		Rows rows = northLayout.newRows();
 		Row row = rows.newRow();
@@ -235,27 +305,31 @@ public class WMatch extends Match
 		row.appendChild(matchFrom);
 		row.appendChild(matchToLabel.rightAlign());
 		row.appendChild(matchTo);
-		row.appendChild(new Space());
 		
 		row = rows.newRow();
 		row.appendCellChild(matchModeLabel.rightAlign(), 1);
 		row.appendCellChild(matchMode, 1);
-		row.appendCellChild(new Space(), 3);
 		
 		row = rows.newRow();
 		row.appendChild(onlyVendorLabel.rightAlign());
 		row.appendChild(onlyVendor.getComponent());
 		row.appendChild(onlyProductLabel.rightAlign());
 		row.appendChild(onlyProduct.getComponent());	
-		row.appendChild(new Space());
 		
 		row = rows.newRow();
 		row.appendChild(dateFromLabel.rightAlign());		
 		row.appendChild(dateFrom.getComponent());
 		row.appendChild(dateToLabel.rightAlign());
 		row.appendChild(dateTo.getComponent());
-		row.appendChild(bSearch);
+		bSearch.setStyle("float: right");
+		int r = row.getChildren().size() % noOfColumn;
+		row.appendCellChild(bSearch, noOfColumn-r);
+		if (noOfColumn < 6)
+			LayoutUtils.compactTo(northLayout, noOfColumn);
+		else
+			LayoutUtils.expandTo(northLayout, noOfColumn, true);
 		
+		// south - summary	
 		South south = new South();
 		mainLayout.appendChild(south);
 		south.appendChild(southPanel);
@@ -269,51 +343,48 @@ public class WMatch extends Match
 		row.appendChild(xMatchedTo.getComponent());
 		row.appendChild(differenceLabel.rightAlign());
 		row.appendChild(difference.getComponent());
-		row.appendChild(bProcess);
 		
-		Center center = new Center();
+		row = rows.newRow();
-		mainLayout.appendChild(center);
+		row.appendCellChild(bProcess, noOfColumn);
-		center.appendChild(centerPanel);
+		bProcess.setStyle("float: right");
-		ZKUpdateUtil.setHflex(centerPanel, "1");
+		if (noOfColumn < 6)
-		ZKUpdateUtil.setVflex(centerPanel, "1");
+			LayoutUtils.compactTo(southLayout, noOfColumn);
-		ZKUpdateUtil.setWidth(centerLayout, "100%");
+	}
-		ZKUpdateUtil.setHeight(centerLayout, "100%");
-		north = new North();
-		centerLayout.appendChild(north);
-		north.setStyle("border: none");
-		Panel p = new Panel();
-		p.appendChild(xMatchedBorder);
-		p.appendChild(xMatchedTable);
-		ZKUpdateUtil.setWidth(xMatchedTable, "99%");
-		//ZKUpdateUtil.setHeight(xMatchedTable, "85%");
-		p.setStyle("width: 100%; height: 100%; padding: 0; margin: 0");
-		north.appendChild(p);
-		ZKUpdateUtil.setHeight(north, "44%");
 
-		south = new South();
+	protected void setupParameterColumns() {
-		centerLayout.appendChild(south);
+		noOfColumn = 6;
-		south.setStyle("border: none");
+		if (maxWidth(MEDIUM_WIDTH-1))
-		ZKUpdateUtil.setWidth(xMatchedToTable, "99%");
+		{
-		//ZKUpdateUtil.setHeight(xMatchedToTable, "99%");
+			if (maxWidth(SMALL_WIDTH-1))
-		south.appendChild(xMatchedToTable);
+				noOfColumn = 2;
-		ZKUpdateUtil.setHeight(south, "44%");
+			else
-		
+				noOfColumn = 4;
-		center = new Center();
+		}
-		centerLayout.appendChild(center);
+		Columns columns = new Columns();
-		center.setStyle("border: none");
+		Column column = new Column();
-//		ZKUpdateUtil.setHeight(center, "6%");
+		column.setWidth(noOfColumn == 2 ? "35%" : (noOfColumn == 4 ? "15%" : "10%"));
-		center.appendChild(xPanel);
+		columns.appendChild(column);
-		ZKUpdateUtil.setVflex(xPanel, "1");
+		column = new Column();
-		ZKUpdateUtil.setHflex(xPanel, "1");
+		column.setWidth(noOfColumn == 2 ? "65%" : "35%");
-		xPanel.appendChild(sameBPartner);
+		columns.appendChild(column);
-		xPanel.appendChild(new Space());
+		if (noOfColumn > 2) {
-		xPanel.appendChild(sameProduct);
+			column = new Column();
-		xPanel.appendChild(new Space());
+			column.setWidth(noOfColumn == 4 ? "15%" : "10%");
-		xPanel.appendChild(sameQty);
+			columns.appendChild(column);
-		ZKUpdateUtil.setHeight(xPanel, "50px");
+			column = new Column();
-		xPanel.appendChild(new Separator());
+			column.setWidth("35%");
-		xPanel.appendChild(xMatchedToBorder);
+			columns.appendChild(column);
-	}   //  jbInit
+		}
+		if (noOfColumn == 6) {
+			column = new Column();
+			column.setWidth("5%");
+			columns.appendChild(column);
+			column = new Column();
+			column.setWidth("5%");
+			columns.appendChild(column);
+		}
+		northLayout.appendChild(columns);
+	}
 
 	/**
 	 *  Dynamic Init.
@@ -373,6 +444,36 @@ public class WMatch extends Match
 	}	//	dispose
 
 	
+	protected void onClientInfo()
+	{
+		if (ClientInfo.isMobile() && form.getPage() != null) 
+		{
+			if (noOfColumn > 0 && northLayout.getRows() != null)
+			{
+				int t = 6;
+				if (maxWidth(MEDIUM_WIDTH-1))
+				{
+					if (maxWidth(SMALL_WIDTH-1))
+						t = 2;
+					else
+						t = 4;
+				}
+				if (t != noOfColumn)
+				{
+					northLayout.getRows().detach();
+					if (northLayout.getColumns() != null)
+						northLayout.getColumns().detach();
+					if (mainLayout.getSouth() != null)
+						mainLayout.getSouth().detach();
+					if (southLayout.getRows() != null)
+						southLayout.getRows().detach();
+					layoutParameterAndSummary();
+					form.invalidate();
+				}
+			}
+		}
+	}
+	
 	/**************************************************************************
 	 *  Action Listener
 	 *  @param e event

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WPayPrint.java

@@ -25,8 +25,12 @@ import java.util.List;
 import java.util.logging.Level;
 
 import org.adempiere.util.Callback;
+import org.adempiere.webui.ClientInfo;
+import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.component.Button;
+import org.adempiere.webui.component.Column;
+import org.adempiere.webui.component.Columns;
 import org.adempiere.webui.component.ConfirmPanel;
 import org.adempiere.webui.component.Grid;
 import org.adempiere.webui.component.GridFactory;
@@ -104,6 +108,7 @@ public class WPayPrint extends PayPrint implements IFormController, EventListene
 			Center center = new Center();
 			contentLayout.appendChild(center);
 			center.appendChild(centerPanel);
+			center.setAutoscroll(true);
 			South south = new South();
 			south.setStyle("border: none");
 			contentLayout.appendChild(south);
@@ -212,6 +217,19 @@ public class WPayPrint extends PayPrint implements IFormController, EventListene
 		row.appendChild(lSumPayments.rightAlign()) ;
 		row.appendChild(fSumPayments.getComponent()) ;
 
+		if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH))
+		{
+			Columns cols = new Columns();
+			centerLayout.appendChild(cols);
+			Column col = new Column();
+			col.setHflex("min");
+			cols.appendChild(col);
+			col = new Column();
+			col.setHflex("1");
+			cols.appendChild(col);
+			LayoutUtils.compactTo(centerLayout, 2);
+		}
+
 		southPanel.getButton(ConfirmPanel.A_OK).setVisible(false);
 		bExport.setDisabled(true);
 		bPrint.setDisabled(true);

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WPaySelect.java

@@ -28,10 +28,14 @@ import java.util.logging.Level;
 
 import org.adempiere.util.Callback;
 import org.adempiere.util.IProcessUI;
+import org.adempiere.webui.ClientInfo;
+import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.apps.ProcessModalDialog;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Checkbox;
+import org.adempiere.webui.component.Column;
+import org.adempiere.webui.component.Columns;
 import org.adempiere.webui.component.ConfirmPanel;
 import org.adempiere.webui.component.Grid;
 import org.adempiere.webui.component.GridFactory;
@@ -160,6 +164,7 @@ public class WPaySelect extends PaySelect
 		//
 		labelBankAccount.setText(Msg.translate(Env.getCtx(), "C_BankAccount_ID"));
 		fieldBankAccount.addActionListener(this);
+		ZKUpdateUtil.setHflex(fieldBankAccount, "1");
 		labelBPartner.setText(Msg.translate(Env.getCtx(), "C_BPartner_ID"));
 		fieldBPartner.addActionListener(this);
 		bRefresh.addActionListener(this);
@@ -168,6 +173,7 @@ public class WPaySelect extends PaySelect
 		fieldPaymentRule.addActionListener(this);
 		labelDtype.setText(Msg.translate(Env.getCtx(), "C_DocType_ID"));
 		fieldDtype.addActionListener(this);
+		ZKUpdateUtil.setHflex(fieldDtype, "1");
 		//
 		labelBankBalance.setText(Msg.translate(Env.getCtx(), "CurrentBalance"));
 		labelBalance.setText("0");
@@ -176,6 +182,7 @@ public class WPaySelect extends PaySelect
 		dataStatus.setPre(true);
 		onlyDue.addActionListener(this);
 		fieldPayDate.addValueChangeListener(this);
+		ZKUpdateUtil.setHflex(fieldPayDate.getComponent(), "1");
 
 		//IDEMPIERE-2657, pritesh shah
 		bGenerate.setEnabled(false);
@@ -183,14 +190,44 @@ public class WPaySelect extends PaySelect
 		bCancel.addActionListener(this);
 		//
 		North north = new North();
-		north.setStyle("border: none");
+		north.setStyle("border: none; max-height: 60%;");
 		mainLayout.appendChild(north);
 		north.appendChild(parameterPanel);		
+		north.setSplittable(true);
+		north.setCollapsible(true);
+		north.setAutoscroll(true);
+		LayoutUtils.addSlideSclass(north);
+		
+		if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1))
+		{
+			Columns cols = new Columns();
+			parameterLayout.appendChild(cols);
+			Column col = new Column();
+			col.setHflex("min");
+			cols.appendChild(col);
+			col = new Column();
+			col.setHflex("1");
+			cols.appendChild(col);
+			col = new Column();
+			col.setHflex("min");
+			cols.appendChild(col);
+			if (ClientInfo.minWidth(ClientInfo.SMALL_WIDTH))
+			{
+				col = new Column();
+				col.setWidth("20%");
+				cols.appendChild(col);
+			}
+		}
 		
 		Rows rows = parameterLayout.newRows();
 		Row row = rows.newRow();
 		row.appendChild(labelBankAccount.rightAlign());
 		row.appendChild(fieldBankAccount);
+		if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1))
+		{			
+			row.appendChild(new Space());
+			row = rows.newRow();
+		}
 		row.appendChild(labelBankBalance.rightAlign());
 		Panel balancePanel = new Panel();
 		balancePanel.appendChild(labelCurrency);
@@ -201,6 +238,11 @@ public class WPaySelect extends PaySelect
 		row = rows.newRow();
 		row.appendChild(labelBPartner.rightAlign());
 		row.appendChild(fieldBPartner);
+		if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1))
+		{		
+			row.appendChild(new Space());
+			row = rows.newRow();
+		}
 		row.appendChild(new Space());		
 		row.appendChild(onlyDue);
 		row.appendChild(new Space());
@@ -209,15 +251,25 @@ public class WPaySelect extends PaySelect
 		row.appendChild(labelDtype.rightAlign());
 		row.appendChild(fieldDtype);
 		row.appendChild(new Space());
-		row.appendChild(new Space());
+		if (ClientInfo.minWidth(ClientInfo.MEDIUM_WIDTH))
-		row.appendChild(new Space());
+		{			
+			row.appendChild(new Space());
+			row.appendChild(new Space());
+		}
 		
 		row = rows.newRow();
 		row.appendChild(labelPayDate.rightAlign());
 		row.appendChild(fieldPayDate.getComponent());
+		if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1))
+		{			
+			row.appendChild(new Space());
+			row = rows.newRow();
+		}
 		row.appendChild(labelPaymentRule.rightAlign());
 		row.appendChild(fieldPaymentRule);
 		row.appendChild(bRefresh);
+		if (ClientInfo.minWidth(ClientInfo.SMALL_WIDTH))
+			LayoutUtils.expandTo(parameterLayout, 4, true);
 
 		South south = new South();
 		south.setStyle("border: none");
@@ -318,6 +370,11 @@ public class WPaySelect extends PaySelect
 		loadTableInfo(bi, payDate, paymentRule, onlyDue.isSelected(), bpartner, docType, miniTable);
 		
 		calculateSelection();
+		if (ClientInfo.maxHeight(ClientInfo.MEDIUM_HEIGHT-1))
+		{
+			mainLayout.getNorth().setOpen(false);
+			LayoutUtils.addSclass("slide", mainLayout.getNorth());
+		}
 	}   //  loadTableInfo
 
 	/**

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WPaymentFormWindow.java

@@ -19,6 +19,7 @@ import org.adempiere.webui.component.ConfirmPanel;
 import org.adempiere.webui.component.Panel;
 import org.adempiere.webui.component.Window;
 import org.adempiere.webui.event.DialogEvents;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.adempiere.webui.window.FDialog;
 import org.compiere.grid.PaymentForm;
@@ -70,9 +71,10 @@ public class WPaymentFormWindow extends Window implements EventListener<Event>,
 		}
 		
 		this.setTitle(Msg.getMsg(Env.getCtx(), "Payment"));
-		this.setSclass("popup-dialog");
+		this.setSclass("popup-dialog payment-form-dialog");
 		this.setBorder("normal");
-		ZKUpdateUtil.setWidth(this, "500px");
+		if (!ThemeManager.isUseCSSForWindowSize())
+			ZKUpdateUtil.setWindowWidthX(this, 500);
 		this.setShadow(true);
 		this.setAttribute(Window.MODE_KEY, Window.MODE_HIGHLIGHTED);
 	}

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WReportCustomization.java

@@ -453,8 +453,8 @@ public class WReportCustomization  implements IFormController,EventListener<Even
 		{
 			winExportFile = new Window();
 			winExportFile.setTitle(Msg.getMsg(Env.getCtx(), "Export"));
-			ZKUpdateUtil.setWidth(winExportFile, "450px");
+			ZKUpdateUtil.setWindowWidthX(winExportFile, 450);
-			ZKUpdateUtil.setHeight(winExportFile, "300px");
+			ZKUpdateUtil.setWindowHeightX(winExportFile, 300);
 			winExportFile.setClosable(true);
 			winExportFile.setBorder("normal");
 			winExportFile.setStyle("position:absolute");

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WStatementCreateFromBatch.java

@@ -19,6 +19,8 @@ import java.sql.Timestamp;
 import java.util.Vector;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
+import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Column;
 import org.adempiere.webui.component.Columns;
@@ -53,8 +55,6 @@ import org.compiere.util.Msg;
 import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
 import org.zkoss.zk.ui.event.Events;
-import org.zkoss.zul.Borderlayout;
-import org.zkoss.zul.Center;
 import org.zkoss.zul.Hbox;
 
 /**
@@ -124,6 +124,8 @@ public class WStatementCreateFromBatch extends StatementCreateFromBatch implemen
 	protected Label dateToLabel = new Label("-");
 	protected WDateEditor dateToField = new WDateEditor("DateTo", false, false, true, Msg.translate(Env.getCtx(), "DateTo"));
 	
+	protected Grid parameterBankLayout;
+
 	/**
 	 *  Dynamic Init
 	 *  @throws Exception if Lookups cannot be initialized
@@ -177,6 +179,31 @@ public class WStatementCreateFromBatch extends StatementCreateFromBatch implemen
 		return true;
 	}   //  dynInit
 	
+	protected void onClientInfo()
+	{
+		if (ClientInfo.isMobile() && parameterBankLayout != null && parameterBankLayout.getColumns() != null)
+		{
+			org.zkoss.zul.Rows rows = parameterBankLayout.getRows();
+			if (rows != null)
+			{
+				int nc = ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH) ? 2 : 4;
+				int cc = rows.getFirstChild().getChildren().size();
+				if (cc != nc)
+				{
+					parameterBankLayout.getColumns().detach();
+					setupColumns(parameterBankLayout);
+					if (cc > nc)
+						LayoutUtils.compactTo(parameterBankLayout, nc);
+					else
+						LayoutUtils.expandTo(parameterBankLayout, nc);
+					ZKUpdateUtil.setCSSHeight(form);
+					ZKUpdateUtil.setCSSWidth(form);
+					form.invalidate();
+				}				
+			}
+		}
+	}
+
 	protected void zkInit() throws Exception
 	{
 		bankAccountLabel.setText(Msg.translate(Env.getCtx(), "C_BankAccount_ID"));
@@ -191,34 +218,13 @@ public class WStatementCreateFromBatch extends StatementCreateFromBatch implemen
     	amtFromField.getComponent().setTooltiptext(Msg.translate(Env.getCtx(), "AmtFrom"));
     	amtToField.getComponent().setTooltiptext(Msg.translate(Env.getCtx(), "AmtTo"));
     	
-    	Borderlayout parameterLayout = new Borderlayout();
-    	ZKUpdateUtil.setHeight(parameterLayout, "130px");
-    	ZKUpdateUtil.setWidth(parameterLayout, "100%");
     	Panel parameterPanel = form.getParameterPanel();
-		parameterPanel.appendChild(parameterLayout);
 		
-		Grid parameterBankLayout = GridFactory.newGridLayout();
+		parameterBankLayout = GridFactory.newGridLayout();
-    	Panel parameterBankPanel = new Panel();
+		ZKUpdateUtil.setVflex(parameterBankLayout, "min");
-    	parameterBankPanel.appendChild(parameterBankLayout);
+    	parameterPanel.appendChild(parameterBankLayout);
 
-		Center center = new Center();
+    	setupColumns(parameterBankLayout);
-		parameterLayout.appendChild(center);
-		center.appendChild(parameterBankPanel);
-		
-		Columns columns = new Columns();
-		parameterBankLayout.appendChild(columns);
-		Column column = new Column();
-		columns.appendChild(column);		
-		column = new Column();
-		ZKUpdateUtil.setWidth(column, "15%");
-		columns.appendChild(column);
-		ZKUpdateUtil.setWidth(column, "35%");
-		column = new Column();
-		ZKUpdateUtil.setWidth(column, "15%");
-		columns.appendChild(column);
-		column = new Column();
-		ZKUpdateUtil.setWidth(column, "35%");
-		columns.appendChild(column);
 		
 		Rows rows = (Rows) parameterBankLayout.newRows();
 		Row row = rows.newRow();
@@ -254,6 +260,41 @@ public class WStatementCreateFromBatch extends StatementCreateFromBatch implemen
 		hbox.appendChild(dateToLabel.rightAlign());
 		hbox.appendChild(dateToField.getComponent());
 		row.appendChild(hbox);
+		
+		if (ClientInfo.isMobile()) {
+			if (ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH))
+				LayoutUtils.compactTo(parameterBankLayout, 2);		
+			ClientInfo.onClientInfo(form, this::onClientInfo);
+		}
+	}
+
+	protected void setupColumns(Grid parameterBankLayout) {
+		Columns columns = new Columns();
+		parameterBankLayout.appendChild(columns);
+		if (ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH))
+		{
+			Column column = new Column();
+			ZKUpdateUtil.setWidth(column, "35%");
+			columns.appendChild(column);
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "65%");
+			columns.appendChild(column);
+		}
+		else
+		{
+			Column column = new Column();
+			columns.appendChild(column);		
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "15%");
+			columns.appendChild(column);
+			ZKUpdateUtil.setWidth(column, "35%");
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "15%");
+			columns.appendChild(column);
+			column = new Column();
+			ZKUpdateUtil.setWidth(column, "35%");
+			columns.appendChild(column);
+		}
 	}
 	
 	/**

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WTreeBOM.java

@@ -22,17 +22,14 @@ import java.util.Properties;
 import java.util.Vector;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.component.Borderlayout;
 import org.adempiere.webui.component.Checkbox;
 import org.adempiere.webui.component.ConfirmPanel;
-import org.adempiere.webui.component.Grid;
-import org.adempiere.webui.component.GridFactory;
 import org.adempiere.webui.component.Label;
 import org.adempiere.webui.component.ListModelTable;
 import org.adempiere.webui.component.ListboxFactory;
 import org.adempiere.webui.component.Panel;
-import org.adempiere.webui.component.Row;
-import org.adempiere.webui.component.Rows;
 import org.adempiere.webui.component.SimpleTreeModel;
 import org.adempiere.webui.component.WListbox;
 import org.adempiere.webui.editor.WSearchEditor;
@@ -61,8 +58,8 @@ import org.zkoss.zk.ui.event.EventListener;
 import org.zkoss.zk.ui.event.Events;
 import org.zkoss.zul.Center;
 import org.zkoss.zul.DefaultTreeNode;
+import org.zkoss.zul.Hlayout;
 import org.zkoss.zul.North;
-import org.zkoss.zul.Separator;
 import org.zkoss.zul.South;
 import org.zkoss.zul.Space;
 import org.zkoss.zul.Tree;
@@ -94,8 +91,8 @@ public class WTreeBOM extends TreeBOM implements IFormController, EventListener<
 	private ConfirmPanel confirmPanel = new ConfirmPanel(true);
 	private WListbox tableBOM = ListboxFactory.newDataTable();
 	private Vector<Vector<Object>> dataBOM = new Vector<Vector<Object>>();
-	private Grid northLayout = GridFactory.newGridLayout();
+	private Hlayout northLayout = new Hlayout();
-	private Grid southLayout = GridFactory.newGridLayout();
+	private Hlayout southLayout = new Hlayout();
 	private mySimpleTreeNode  	m_root = null;
 	private boolean reload = false;
 	private Checkbox treeExpand = new Checkbox();
@@ -169,11 +166,12 @@ public class WTreeBOM extends TreeBOM implements IFormController, EventListener<
 		ZKUpdateUtil.setHeight(m_frame, "100%");
 		m_frame.setStyle("position: absolute; padding: 0; margin: 0");
 		m_frame.appendChild (mainLayout);
-		ZKUpdateUtil.setWidth(mainLayout, "100%");
+		ZKUpdateUtil.setHflex(mainLayout, "1");
 		ZKUpdateUtil.setHeight(mainLayout, "100%");
-		mainLayout.setStyle("position: absolute");
 		northPanel.appendChild(northLayout);
 		southPanel.appendChild(southLayout);
+		ZKUpdateUtil.setVflex(southPanel, "min");
+		
 		
 		labelProduct.setText (Msg.getElement(Env.getCtx(), "M_Product_ID"));
 		implosion.setText (Msg.getElement(Env.getCtx(), "Implosion"));
@@ -181,39 +179,47 @@ public class WTreeBOM extends TreeBOM implements IFormController, EventListener<
 		
 		North north = new North();
 		north.appendChild(northPanel);
-		ZKUpdateUtil.setHeight(north, "6%");
+		ZKUpdateUtil.setVflex(north, "min");
 		ZKUpdateUtil.setWidth(northPanel, "100%");
 		mainLayout.appendChild(north);
 
-		Rows rows = northLayout.newRows();
+		northLayout.setValign("middle");
-
+		northLayout.setStyle("padding: 4px;");
-		Row north_row = rows.newRow();
+		northLayout.appendChild(labelProduct.rightAlign());
-		north_row.appendChild(labelProduct.rightAlign());
+		if (ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH-1))
-		north_row.appendChild(fieldProduct.getComponent());
+			ZKUpdateUtil.setWidth(fieldProduct.getComponent(), "150px");
-		north_row.appendChild(new Separator());		
+		else if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1))
-		north_row.appendChild(implosion);
+			ZKUpdateUtil.setWidth(fieldProduct.getComponent(), "200px");
-		north_row.appendChild(new Space());
+		else if (ClientInfo.minWidth(ClientInfo.MEDIUM_WIDTH))
-		north_row.appendChild(new Separator());
+			ZKUpdateUtil.setWidth(fieldProduct.getComponent(), "400px");
-		north_row.appendChild(new Space());
+		else
-		north_row.appendChild(treeInfo);
+			ZKUpdateUtil.setWidth(fieldProduct.getComponent(), "300px");
+		northLayout.appendChild(fieldProduct.getComponent());
+		northLayout.appendChild(new Space());
+		northLayout.appendChild(implosion);
+		northLayout.appendChild(new Space());
+		northLayout.appendChild(treeInfo);
+		if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1))
+			treeInfo.setVisible(false);
 		
 		treeExpand.setText(Msg.getMsg(Env.getCtx(), "ExpandTree"));
 
 		South south = new South();
 		south.appendChild(southPanel);
-		ZKUpdateUtil.setHeight(south, "10%");
+		ZKUpdateUtil.setVflex(south, "min");
 		ZKUpdateUtil.setWidth(southPanel, "100%");
 		mainLayout.appendChild(south);
 		
-		Rows rows2 = southLayout.newRows();
+		southLayout.setValign("middle");
-		
+		southLayout.setStyle("padding: 4px");
-		Row south_row = rows2.newRow();
+		ZKUpdateUtil.setHflex(southLayout, "1");
-
+		ZKUpdateUtil.setVflex(southLayout, "min");
-		south_row.appendChild(treeExpand);
+		southLayout.appendChild(treeExpand);
-		south_row.appendChild(new Space());
+		ZKUpdateUtil.setHflex(treeExpand, "1");
-		south_row.appendChild(new Separator());
+		treeExpand.setStyle("float: left;");
-		south_row.appendChild(new Space());
+		southLayout.appendChild(confirmPanel);
-		south_row.appendChild(confirmPanel);
+		ZKUpdateUtil.setHflex(confirmPanel, "1");
+		confirmPanel.setStyle("float: right;");
 		confirmPanel.addActionListener(this);
 		
 		mainLayout.appendChild(west);

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WTreeMaintenance.java

@@ -20,8 +20,8 @@ import java.util.ArrayList;
 import java.util.logging.Level;
 
 import org.adempiere.util.Callback;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
-import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Checkbox;
 import org.adempiere.webui.component.Label;
 import org.adempiere.webui.component.Listbox;
@@ -29,6 +29,7 @@ import org.adempiere.webui.component.Panel;
 import org.adempiere.webui.component.Searchbox;
 import org.adempiere.webui.component.SimpleListModel;
 import org.adempiere.webui.component.SimpleTreeModel;
+import org.adempiere.webui.component.ToolBarButton;
 import org.adempiere.webui.panel.ADForm;
 import org.adempiere.webui.panel.CustomForm;
 import org.adempiere.webui.panel.IFormController;
@@ -48,12 +49,11 @@ import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
 import org.zkoss.zk.ui.event.Events;
 import org.zkoss.zul.Borderlayout;
-import org.zkoss.zul.Cell;
 import org.zkoss.zul.Center;
 import org.zkoss.zul.DefaultTreeNode;
-import org.zkoss.zul.Div;
 import org.zkoss.zul.East;
 import org.zkoss.zul.Hbox;
+import org.zkoss.zul.Hlayout;
 import org.zkoss.zul.ListModel;
 import org.zkoss.zul.North;
 import org.zkoss.zul.Space;
@@ -77,12 +77,11 @@ public class WTreeMaintenance extends TreeMaintenance implements IFormController
 	private Panel 			northPanel	= new Panel ();
 	private Label			treeLabel	= new Label ();
 	private Listbox			treeField;
-	private Button			bAddAll		= new Button ();
+	private ToolBarButton	bAddAll		= new ToolBarButton ();
-	private Button			bAdd		= new Button ();
+	private ToolBarButton	bAdd		= new ToolBarButton ();
-	private Button			bDelete		= new Button ();
+	private ToolBarButton	bDelete		= new ToolBarButton ();
-	private Button			bDeleteAll	= new Button ();
+	private ToolBarButton	bDeleteAll	= new ToolBarButton ();
 	private Checkbox		cbAllNodes	= new Checkbox ();
-	private Label			treeInfo	= new Label ();
 	private Searchbox      searchBox   = new Searchbox();
 	//
 	@SuppressWarnings("unused")
@@ -132,33 +131,32 @@ public class WTreeMaintenance extends TreeMaintenance implements IFormController
 		bDelete.setImage(ThemeManager.getThemeResource("images/StepForward24.png"));
 		bDeleteAll.setImage(ThemeManager.getThemeResource("images/FastForward24.png"));
 		
-		ZKUpdateUtil.setWidth(form,"99%");
+		ZKUpdateUtil.setWidth(form,"100%");
 		ZKUpdateUtil.setHeight(form, "100%");
-		form.setStyle("position: absolute; padding: 0; margin: 0");
+		form.setStyle("position: relative; padding: 0; margin: 0");
 		form.appendChild (mainLayout);
 		ZKUpdateUtil.setWidth(mainLayout, "100%");
 		ZKUpdateUtil.setHeight(mainLayout, "100%");
-		mainLayout.setStyle("position: absolute");
 		
 		treeLabel.setText (Msg.translate(Env.getCtx(), "AD_Tree_ID"));
 		cbAllNodes.setEnabled (false);
 		cbAllNodes.setText (Msg.translate(Env.getCtx(), "IsAllNodes"));
-		treeInfo.setText (" ");
 		bAdd.setTooltiptext(Msg.getMsg(Env.getCtx(), "AddToTree"));
 		bAddAll.setTooltiptext(Msg.getMsg(Env.getCtx(), "AddAllToTree"));
 		bDelete.setTooltiptext(Msg.getMsg(Env.getCtx(), "DeleteFromTree"));
 		bDeleteAll.setTooltiptext(Msg.getMsg(Env.getCtx(), "DeleteAllFromTree"));
-		bAdd.addActionListener(this);
+		bAdd.addEventListener(Events.ON_CLICK, this);
-		bAddAll.addActionListener(this);
+		bAddAll.addEventListener(Events.ON_CLICK, this);
-		bDelete.addActionListener(this);
+		bDelete.addEventListener(Events.ON_CLICK, this);
-		bDeleteAll.addActionListener(this);
+		bDeleteAll.addEventListener(Events.ON_CLICK, this);
 		
 		North north = new North();
 		mainLayout.appendChild(north);
 		north.appendChild(northPanel);
 		ZKUpdateUtil.setHflex(north, "1");
-		ZKUpdateUtil.setVflex(north, "1");
+		ZKUpdateUtil.setVflex(north, "min");
 		ZKUpdateUtil.setWidth(northPanel, "100%");
+		ZKUpdateUtil.setVflex(northPanel, "min");
 		//
 		Hbox hbox = new Hbox();
 		hbox.setStyle("padding: 3px;");
@@ -167,31 +165,43 @@ public class WTreeMaintenance extends TreeMaintenance implements IFormController
 		ZKUpdateUtil.setVflex(hbox, "1");
 		northPanel.appendChild(hbox);
 		
-		hbox.appendChild (new Space());
+		if (ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH-1))
+			treeField.setStyle("max-width: 200px");
 		hbox.appendChild (treeLabel);
 		hbox.appendChild (treeField);
 		hbox.appendChild (new Space());
 		hbox.appendChild (cbAllNodes);		
-		hbox.appendChild (new Space());
-		Cell cell = new Cell();
-		cell.setColspan(1);
-		cell.setRowspan(1);
-		ZKUpdateUtil.setHflex(cell, "1");
-		cell.appendChild(treeInfo);
-		hbox.appendChild (cell);
-		hbox.appendChild (new Space());
 
-		Div div = new Div();
+		if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1))
+		{
+			hbox = new Hbox();
+			hbox.setAlign("center");
+			hbox.setStyle("padding-top: 3px; padding-bottom: 3px;");
+			ZKUpdateUtil.setWidth(hbox, "100%");
+			ZKUpdateUtil.setVflex(hbox, "min");
+			northPanel.appendChild(hbox);
+		}
+		else
+		{
+			hbox.appendChild (new Space());
+		}
+		
+		Hlayout div = new Hlayout();
 		div.appendChild (bAddAll);
 		div.appendChild (bAdd);
 		div.appendChild (bDelete);
 		div.appendChild (bDeleteAll);
+		ZKUpdateUtil.setVflex(div, "min");
 
 		searchBox.addEventListener(Events.ON_CLICK, this);
 		searchBox.getTextbox().addEventListener(Events.ON_OK, this);
 		searchBox.getButton().setImage(ThemeManager.getThemeResource("images/Find16.png"));
 		searchBox.setToolTipText(Msg.getCleanMsg(Env.getCtx(), "TreeSearch"));
-		ZKUpdateUtil.setWidth(searchBox, "200px");
+		if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1))
+			ZKUpdateUtil.setHflex(searchBox, "1");
+		else
+			ZKUpdateUtil.setWidth(searchBox, "200px");
+		ZKUpdateUtil.setVflex(searchBox, "min");
 		div.appendChild(searchBox);
 		hbox.appendChild(div);
 		//
@@ -289,10 +299,10 @@ public class WTreeMaintenance extends TreeMaintenance implements IFormController
 		//	Tree
 		m_tree = new MTree (Env.getCtx(), tree.getKey(), null);
 		cbAllNodes.setSelected(m_tree.isAllNodes());
-		bAddAll.setEnabled(!m_tree.isAllNodes());
+		bAddAll.setDisabled(m_tree.isAllNodes());
-		bAdd.setEnabled(!m_tree.isAllNodes());
+		bAdd.setDisabled(m_tree.isAllNodes());
-		bDelete.setEnabled(!m_tree.isAllNodes());
+		bDelete.setDisabled(m_tree.isAllNodes());
-		bDeleteAll.setEnabled(!m_tree.isAllNodes());
+		bDeleteAll.setDisabled(m_tree.isAllNodes());
 		
 		//	List
 		SimpleListModel model = new SimpleListModel();
@@ -356,7 +366,7 @@ public class WTreeMaintenance extends TreeMaintenance implements IFormController
 				Treeitem ti = centerTree.renderItemByPath(path);
 				ti.setSelected(true);
 			}
-			bAdd.setEnabled(stn == null);
+			bAdd.setDisabled(stn != null);
 		}
 	}	//	valueChanged
 	

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/form/WTrxMaterial.java

@@ -20,6 +20,7 @@ import java.sql.Timestamp;
 import java.util.Properties;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.adwindow.ADTabpanel;
 import org.adempiere.webui.apps.AEnv;
@@ -55,7 +56,6 @@ import org.zkoss.zul.Borderlayout;
 import org.zkoss.zul.Center;
 import org.zkoss.zul.North;
 import org.zkoss.zul.South;
-import org.zkoss.zul.Separator;
 
 /**
  * Material Transaction History
@@ -92,6 +92,8 @@ public class WTrxMaterial extends TrxMaterial
 	private ConfirmPanel confirmPanel = new ConfirmPanel(true, true, false, false, false, true, false);
 	private StatusBarPanel statusBar = new StatusBarPanel();
 
+	private int noOfColumns;
+
 
 	/**
 	 *	Initialize Panel
@@ -105,6 +107,8 @@ public class WTrxMaterial extends TrxMaterial
 			dynParameter();
 			zkInit();
 			dynInit();		
+			if (ClientInfo.isMobile())
+				ClientInfo.onClientInfo(form, this::onClientInfo);
 		}
 		catch(Exception ex)
 		{
@@ -119,7 +123,7 @@ public class WTrxMaterial extends TrxMaterial
 	void zkInit() throws Exception
 	{
 		form.appendChild(mainPanel);
-		mainPanel.setStyle("width: 99%; height: 100%; border: none; padding: 0; margin: 0");
+		mainPanel.setStyle("width: 100%; height: 100%; border: none; padding: 0; margin: 0");
 		mainPanel.appendChild(mainLayout);
 		ZKUpdateUtil.setWidth(mainLayout, "100%");
 		ZKUpdateUtil.setHeight(mainLayout, "100%");
@@ -135,39 +139,85 @@ public class WTrxMaterial extends TrxMaterial
 		North north = new North();
 		mainLayout.appendChild(north);
 		north.appendChild(parameterPanel);
+		north.setSplittable(true);
+		north.setCollapsible(true);
+		north.setAutoscroll(true);
+		LayoutUtils.addSlideSclass(north);
 		
-		Rows rows = parameterLayout.newRows();
+		layoutParameters();
-		Row row = rows.newRow();
-		row.appendCellChild(orgLabel.rightAlign());
-		ZKUpdateUtil.setHflex(orgField.getComponent(), "true");
-		row.appendCellChild(orgField.getComponent());
-		row.appendCellChild(mtypeLabel.rightAlign());
-		ZKUpdateUtil.setHflex(mtypeField.getComponent(), "true");
-		row.appendCellChild(mtypeField.getComponent());
-		row.appendCellChild(dateFLabel.rightAlign());
-		row.appendCellChild(dateFField.getComponent());
-
-		row = rows.newRow();
-		row.appendCellChild(locatorLabel.rightAlign());
-		ZKUpdateUtil.setHflex(locatorField.getComponent(), "true");
-		row.appendCellChild(locatorField.getComponent());
-		row.appendCellChild(productLabel.rightAlign());
-		ZKUpdateUtil.setHflex(productField.getComponent(), "true");
-		row.appendCellChild(productField.getComponent());
-		row.appendCellChild(dateTLabel.rightAlign());
-		row.appendCellChild(dateTField.getComponent());
 		//
 		southPanel.appendChild(confirmPanel);
-		southPanel.appendChild(new Separator());
 		southPanel.appendChild(statusBar);
 		South south = new South();
 		south.setStyle("border: none");
 		mainLayout.appendChild(south);
 		south.appendChild(southPanel);
+		ZKUpdateUtil.setHeight(southPanel, "64px");
+		ZKUpdateUtil.setHeight(south, "64px");
+		ZKUpdateUtil.setHeight(confirmPanel, "32px");
+		ZKUpdateUtil.setHeight(statusBar, "32px");
+		
+		ZKUpdateUtil.setWidth(southPanel, "100%");
+		ZKUpdateUtil.setWidth(confirmPanel, "100%");
+		ZKUpdateUtil.setWidth(statusBar, "100%");
 		
 		LayoutUtils.addSclass("status-border", statusBar);
 	}   //  jbInit
 
+	protected void layoutParameters() {
+		noOfColumns = 6;
+		if (ClientInfo.maxWidth(639))
+			noOfColumns = 2;
+		else if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1))
+			noOfColumns = 4;
+		
+		int childCnt = 0;
+		Rows rows = parameterLayout.newRows();
+		Row row = rows.newRow();
+		row.appendCellChild(orgLabel.rightAlign());
+		ZKUpdateUtil.setHflex(orgField.getComponent(), "true");
+		row.appendCellChild(orgField.getComponent());
+		childCnt += 2;
+		if ((childCnt % noOfColumns) ==0 )
+			row = rows.newRow();
+		row.appendCellChild(mtypeLabel.rightAlign());
+		ZKUpdateUtil.setHflex(mtypeField.getComponent(), "true");
+		row.appendCellChild(mtypeField.getComponent());
+		childCnt += 2;
+		if ((childCnt % noOfColumns) ==0 )
+			row = rows.newRow();
+		if (noOfColumns == 6)
+		{
+			row.appendCellChild(dateFLabel.rightAlign());
+			row.appendCellChild(dateFField.getComponent());
+			childCnt += 2;
+			if ((childCnt % noOfColumns) ==0 )
+				row = rows.newRow();
+		}
+		row.appendCellChild(locatorLabel.rightAlign());
+		ZKUpdateUtil.setHflex(locatorField.getComponent(), "true");		
+		row.appendCellChild(locatorField.getComponent());
+		childCnt += 2;
+		if ((childCnt % noOfColumns) ==0 )
+			row = rows.newRow();
+		row.appendCellChild(productLabel.rightAlign());
+		ZKUpdateUtil.setHflex(productField.getComponent(), "true");
+		row.appendCellChild(productField.getComponent());
+		childCnt +=2;
+		if ((childCnt % noOfColumns) ==0 )
+			row = rows.newRow();
+		if (noOfColumns < 6)
+		{
+			row.appendCellChild(dateFLabel.rightAlign());
+			row.appendCellChild(dateFField.getComponent());
+			childCnt += 2;
+			if ((childCnt % noOfColumns) ==0 )
+				row = rows.newRow();
+		}
+		row.appendCellChild(dateTLabel.rightAlign());
+		row.appendCellChild(dateTField.getComponent());
+	}
+
 	/**
 	 *  Initialize Parameter fields
 	 *  @throws Exception if Lookups cannot be initialized
@@ -269,6 +319,8 @@ public class WTrxMaterial extends TrxMaterial
 		Timestamp movementDateTo = (Timestamp)dateTField.getValue();
 		
 		refresh(organization, locator, product, movementType, movementDateFrom, movementDateTo, statusBar);
+		if (ClientInfo.maxHeight(ClientInfo.MEDIUM_HEIGHT-1))
+			mainLayout.getNorth().setOpen(false);
 	}   //  refresh
 
 	/**
@@ -287,4 +339,21 @@ public class WTrxMaterial extends TrxMaterial
 		return form;
 	}
 
+	protected void onClientInfo() 
+	{
+		if (noOfColumns > 0 && parameterLayout.getRows() != null)
+		{
+			int n = 6;
+			if (ClientInfo.maxWidth(639))
+				n = 2;
+			else if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1))
+				n = 4;
+			if (n != noOfColumns)
+			{
+				parameterLayout.getRows().detach();
+				layoutParameters();
+				form.invalidate();
+			}
+		}
+	}
 }   //  VTrxMaterial

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/apps/graph/WGraph.java

@@ -22,6 +22,7 @@ import java.util.List;
 
 import org.adempiere.apps.graph.GraphColumn;
 import org.adempiere.base.Service;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.apps.graph.model.GoalModel;
 import org.adempiere.webui.editor.WTableDirEditor;
@@ -181,7 +182,7 @@ public class WGraph extends Div implements IdSpace {
 		if (m_renderTable && m_renderChart) {
 			layout = new Borderlayout();
 			appendChild(layout);
-			layout.setStyle("height: 100%; width: 100%; position: absolute;");
+			layout.setStyle("height: 100%; width: 100%; position: relative;");
 			Center center = new Center();
 			layout.appendChild(center);
 			center.appendChild(panel);
@@ -196,6 +197,11 @@ public class WGraph extends Div implements IdSpace {
 			if (m_renderChart) {
 				East east = new East();
 				east.setAutoscroll(true);
+				if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1)) {
+					east.setOpen(false);
+					east.setSplittable(true);
+					east.setCollapsible(true);
+				}
 				layout.appendChild(east);
 				renderTable(east);
 			} else {
@@ -251,12 +257,17 @@ public class WGraph extends Div implements IdSpace {
 	private void renderChart(String type) {
 		int width = 560;
 		int height = 400;
+		if (ClientInfo.maxWidth(width-1)) {
+			width = ClientInfo.get().desktopWidth;
+			height = (int)(width * (400f / 560f));
+		}
 		if (panel.getPanelchildren() != null) {
 			panel.getPanelchildren().getChildren().clear();
 		} else {
 			Panelchildren pc = new Panelchildren();
 			panel.appendChild(pc);
 		}
+		panel.getPanelchildren().setStyle("overflow: auto;");
 		GoalModel goalModel = new GoalModel();
 		goalModel.goal = m_goal;
 		goalModel.chartType = type != null ? type : m_goal.getChartType();

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/component/ConfirmPanel.java

@@ -22,9 +22,11 @@ import java.util.Iterator;
 import java.util.List;
 import java.util.Map;
 
+import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.factory.ButtonFactory;
 import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
+import org.compiere.util.Util;
 import org.zkoss.zk.ui.event.EventListener;
 import org.zkoss.zk.ui.event.Events;
 import org.zkoss.zul.Div;
@@ -106,6 +108,8 @@ public final class ConfirmPanel extends Div
         Button button = ButtonFactory.createNamedButton(name, m_withText, m_withImage);        
         button.setId(name);
         buttonMap.put(name, button);
+        if (!Util.isEmpty(extraButtonSClass))
+        	LayoutUtils.addSclass(extraButtonSClass, button);
 
         return button;
     }
@@ -226,6 +230,8 @@ public final class ConfirmPanel extends Div
     // IDEMPIERE-1334 center panel, contain all process button
     private Hlayout pnlBtnCenter;
 
+	private String extraButtonSClass;
+
     /**
      * initialise components
      */
@@ -523,4 +529,16 @@ public final class ConfirmPanel extends Div
 		return getButton(A_OK);
 	}
 
+	public void addButtonSclass(String cls) {
+		for(Button btn : buttonMap.values()) {
+			LayoutUtils.addSclass(cls, btn);
+		}
+		extraButtonSClass = cls;
+	}
+	
+	public void removeButtonSclass(String cls) {
+		for(Button btn : buttonMap.values()) {
+			LayoutUtils.removeSclass(cls, btn);
+		}
+	}
 }   //  ConfirmPanel

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/component/FolderBrowser.java

@@ -81,8 +81,8 @@ public class FolderBrowser extends Window implements EventListener<Event>
 		this.browseForFolder = browseForFolder;
 
 		setTitle(browseForFolder ? "Directory Browser" : "File Browser");
-		ZKUpdateUtil.setWidth(this, "500px");
+		ZKUpdateUtil.setWindowWidthX(this, 500);
-		ZKUpdateUtil.setHeight(this, "500px");
+		ZKUpdateUtil.setWindowHeightX(this, 500);
 		setBorder("normal");
 		
 		Borderlayout contentLayout = new Borderlayout();

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/component/Messagebox.java

@@ -21,6 +21,7 @@ import java.util.Properties;
 
 import org.adempiere.util.Callback;
 import org.adempiere.webui.AdempiereIdGenerator;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.factory.ButtonFactory;
 import org.adempiere.webui.session.SessionManager;
@@ -54,6 +55,7 @@ public class Messagebox extends Window implements EventListener<Event>
 	private static final long serialVersionUID = 8928526331932742124L;
 
 	private static final String MESSAGE_PANEL_STYLE = "text-align:left; word-break: break-all; overflow: auto; max-height: 350pt; min-width: 230pt; max-width: 450pt;";	
+	private static final String SMALLER_MESSAGE_PANEL_STYLE = "text-align:left; word-break: break-all; overflow: auto; max-height: 350pt; min-width: 180pt; ";
 	private String msg = new String("");
 	private String imgSrc = new String("");
 
@@ -126,6 +128,7 @@ public class Messagebox extends Window implements EventListener<Event>
 		Properties ctx = Env.getCtx();
 		lblMsg.setEncode(false);
 		lblMsg.setValue(msg);
+		lblMsg.setClientAttribute("style", "word-break: normal;");
 		// Invert - Unify  OK/Cancel IDEMPIERE-77
 		btnOk = ButtonFactory.createNamedButton(ConfirmPanel.A_OK);
 		btnOk.setId("btnOk");
@@ -162,8 +165,15 @@ public class Messagebox extends Window implements EventListener<Event>
 		btnIgnore.setId("btnIgnore");
 
 		Panel pnlMessage = new Panel();
-		pnlMessage.setStyle(MESSAGE_PANEL_STYLE);
+		if (ClientInfo.maxWidth(399))
+		{
+			pnlMessage.setStyle(SMALLER_MESSAGE_PANEL_STYLE);
+			this.setWidth("100%");
+		}
+		else
+			pnlMessage.setStyle(MESSAGE_PANEL_STYLE);
 		pnlMessage.appendChild(lblMsg);
+		ZKUpdateUtil.setHflex(pnlMessage, "min");
 		
 		Panel pnlInput= new Panel();
 		pnlInput.setStyle(MESSAGE_PANEL_STYLE);
@@ -188,6 +198,7 @@ public class Messagebox extends Window implements EventListener<Event>
 		north.appendChild(pnlImage);
 		north.appendChild(pnlText);
 		north.setSclass("dialog-content");
+		north.setWidth("100%");;
 
 		Hbox pnlButtons = new Hbox();
 		pnlButtons.setAlign("center");

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/component/NumberBox.java

@@ -21,6 +21,7 @@ import java.math.BigDecimal;
 import java.text.NumberFormat;
 import java.text.ParseException;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
@@ -138,6 +139,13 @@ public class NumberBox extends Div
      
         LayoutUtils.addSclass("number-box", this);	     
         LayoutUtils.addSclass("editor-box", this);
+        
+        if (ClientInfo.isMobile())
+        {
+        	LayoutUtils.addSclass("mobile", decimalBox);
+        	btn.setVisible(false);
+        }
+
     }
     
     /**

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/component/SimpleTreeModel.java

@@ -18,6 +18,7 @@ import java.util.Enumeration;
 import java.util.List;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
 import org.compiere.model.MTree;
 import org.compiere.model.MTreeNode;
 import org.compiere.util.CLogger;
@@ -160,12 +161,16 @@ public class SimpleTreeModel extends org.zkoss.zul.DefaultTreeModel<Object> impl
 		if(ti.getTreerow()==null){
 			tr = new Treerow();			
 			tr.setParent(ti);
-			if (isItemDraggable()) {
+			//zk's dnd doesn't work well on touch device with vertical scroll enable
-				tr.setDraggable("true");
+			//need different approach
-			}
+			if (!ClientInfo.isMobile()) {
-			if (!onDropListners.isEmpty()) {
+				if (isItemDraggable()) {
-				tr.setDroppable("true");
+					tr.setDraggable("true");
-				tr.addEventListener(Events.ON_DROP, this);
+				}
+				if (!onDropListners.isEmpty()) {
+					tr.setDroppable("true");
+					tr.addEventListener(Events.ON_DROP, this);
+				}
 			}
 
 			// Color

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/component/Tabbox.java

@@ -45,6 +45,7 @@ public class Tabbox extends org.zkoss.zul.Tabbox implements EventListener<Event>
 	private static final long serialVersionUID = 1400484283064851775L;
 	private boolean isSupportTabDragDrop = false;
 	private boolean isActiveBySeq = false;
+	private boolean isCheckVisibleOnlyForNextActive = true;
 
 	private Deque<Tab> activeTabSeq = new ArrayDeque<>();
 	public Tabbox () {
@@ -140,7 +141,7 @@ public class Tabbox extends org.zkoss.zul.Tabbox implements EventListener<Event>
 	public Tab getNextActiveBySeq (Tab currentTab) {
 		Tab cadidateTabActive = null;
 		while ((cadidateTabActive = activeTabSeq.peek()) != null) {
-			boolean canNotActive = cadidateTabActive.isDisabled() || !cadidateTabActive.isVisible();
+			boolean canNotActive = cadidateTabActive.isDisabled() || (!cadidateTabActive.isVisible() && isCheckVisibleOnlyForNextActive());
 			if (canNotActive) {
 				// move disable item to last stack it can be active late
 				cadidateTabActive = activeTabSeq.pop();
@@ -163,4 +164,16 @@ public class Tabbox extends org.zkoss.zul.Tabbox implements EventListener<Event>
 	public void removeTabFromActiveSeq (Tab closeTab) {
 		activeTabSeq.remove(closeTab);
 	}
+	
+	public boolean isCheckVisibleOnlyForNextActive() {
+		return isCheckVisibleOnlyForNextActive;
+	}
+	
+	/**
+	 * Ignore invisible tab for next active by seq
+	 * @param isVisibleOnly
+	 */
+	public void setCheckVisibleOnlyForNextActive(boolean isVisibleOnly) {
+		isCheckVisibleOnlyForNextActive = isVisibleOnly;
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/component/WListItemRenderer.java

@@ -32,6 +32,7 @@ import java.util.List;
 import java.util.Set;
 
 import org.adempiere.webui.AdempiereWebUI;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.event.TableValueChangeEvent;
 import org.adempiere.webui.event.TableValueChangeListener;
@@ -281,6 +282,8 @@ public class WListItemRenderer implements ListitemRenderer<Object>, EventListene
 										+ listcell.getStyle());
 						numberbox.addEventListener(Events.ON_CHANGE, this);						
 						listcell.appendChild(numberbox);
+						if (ClientInfo.isMobile())
+							numberbox.getButton().setVisible(false);
 					}
 					else
 					{
@@ -461,6 +464,8 @@ public class WListItemRenderer implements ListitemRenderer<Object>, EventListene
         	{
         		header = new ListHeader("");
         		ZKUpdateUtil.setWidth(header, "30px");
+        		header.setAlign("center");
+        		header.setValign("middle");
         	}
         	else
         	{

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/component/Window.java

@@ -17,6 +17,8 @@
 
 package org.adempiere.webui.component;
 
+import java.util.Collection;
+
 import org.adempiere.webui.ISupportMask;
 import org.adempiere.webui.ShowMaskWrapper;
 import org.adempiere.webui.event.DialogEvents;
@@ -25,6 +27,7 @@ import org.zkoss.zk.ui.Executions;
 import org.zkoss.zk.ui.Page;
 import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.Events;
+import org.zkoss.zk.ui.util.Callback;
 
 /**
  *
@@ -76,6 +79,7 @@ public class Window extends org.zkoss.zul.Window implements ISupportMask
 	/* (non-Javadoc)
 	 * @see org.zkoss.zul.Window#onPageDetached(org.zkoss.zk.ui.Page)
 	 */
+	@SuppressWarnings({ "rawtypes", "unchecked" })
 	@Override
 	public void onPageDetached(Page page) {
 		super.onPageDetached(page);
@@ -83,8 +87,14 @@ public class Window extends org.zkoss.zul.Window implements ISupportMask
 				Executions.getCurrent().getDesktop().getExecution() != null) {
 			Events.sendEvent(this, new Event(DialogEvents.ON_WINDOW_CLOSE, this, null));
 		}
+		//org.zkoss.zul.Window.onPageDetached doesn't call super.onPageDetached, bug ?
+		Collection<Callback> callbacks = getCallback(AFTER_PAGE_DETACHED);
+		for (Callback callback : callbacks) {
+			callback.call(this);
+		}
 	}
 
+	
 	/**
 	 * Get the window mode attribute
 	 * @return Window.Mode

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/dashboard/RequestWindow.java

@@ -31,6 +31,7 @@ import org.adempiere.webui.component.Rows;
 import org.adempiere.webui.component.Textbox;
 import org.adempiere.webui.component.Window;
 import org.adempiere.webui.editor.WTableDirEditor;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.adempiere.webui.window.FDialog;
 import org.compiere.model.MColumn;
@@ -47,7 +48,7 @@ import org.zkoss.zk.ui.WrongValueException;
 import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
 import org.zkoss.zk.ui.event.Events;
-import org.zkoss.zul.North;
+import org.zkoss.zul.Center;
 import org.zkoss.zul.South;
 import org.zkoss.zul.Timebox;
 
@@ -87,8 +88,16 @@ public class RequestWindow extends Window implements EventListener<Event> {
 		Properties ctx = Env.getCtx();
 		setTitle(Msg.getMsg(Env.getCtx(),"Event"));
 		setAttribute(Window.MODE_KEY, Window.MODE_HIGHLIGHTED);
-		ZKUpdateUtil.setWidth(this, "400px");
+		if (!ThemeManager.isUseCSSForWindowSize()) {
-		this.setSclass("popup-dialog");
+			ZKUpdateUtil.setWindowWidthX(this, 400);
+			ZKUpdateUtil.setWindowHeightX(this, 550);
+		} else {
+			addCallback(AFTER_PAGE_ATTACHED, t -> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+			});
+		}
+		this.setSclass("popup-dialog request-dialog");
 		this.setBorder("normal");
 		this.setShadow(true);
 		this.setClosable(true);
@@ -248,16 +257,17 @@ public class RequestWindow extends Window implements EventListener<Event> {
 		Borderlayout borderlayout = new Borderlayout();
 		this.appendChild(borderlayout);
 		ZKUpdateUtil.setHflex(borderlayout, "1");
-		ZKUpdateUtil.setVflex(borderlayout, "min");
+		ZKUpdateUtil.setVflex(borderlayout, "1");
 		
-		North northPane = new North();
+		Center centerPane = new Center();
-		northPane.setSclass("dialog-content");
+		centerPane.setSclass("dialog-content");
-		northPane.setAutoscroll(true);
+		centerPane.setAutoscroll(true);
-		borderlayout.appendChild(northPane);
+		borderlayout.appendChild(centerPane);
 		
-		northPane.appendChild(grid);
+		centerPane.appendChild(grid);
-		ZKUpdateUtil.setVflex(grid, "1");
+		ZKUpdateUtil.setVflex(grid, "min");
 		ZKUpdateUtil.setHflex(grid, "1");
+		ZKUpdateUtil.setVflex(centerPane, "min");
 
 		South southPane = new South();
 		southPane.setSclass("dialog-footer");

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/desktop/DashboardController.java

@@ -28,6 +28,7 @@ import java.util.logging.Level;
 
 import org.adempiere.base.Service;
 import org.adempiere.exceptions.AdempiereException;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.apps.graph.IChartRendererService;
 import org.adempiere.webui.apps.graph.WGraph;
@@ -63,6 +64,7 @@ import org.zkoss.util.media.AMedia;
 import org.zkoss.zk.ui.Component;
 import org.zkoss.zk.ui.Desktop;
 import org.zkoss.zk.ui.Executions;
+import org.zkoss.zk.ui.HtmlBasedComponent;
 import org.zkoss.zk.ui.Page;
 import org.zkoss.zk.ui.event.AfterSizeEvent;
 import org.zkoss.zk.ui.event.DropEvent;
@@ -91,16 +93,19 @@ import org.zkoss.zul.Vlayout;
  */
 public class DashboardController implements EventListener<Event> {
 
+	private static final String PANEL_EMPTY_ATTR = "panel.empty";
 	private final static CLogger logger = CLogger.getCLogger(DashboardController.class);
 	private Component prevParent;
 	private Component prevNext;
 
 	private List<Panel> panelList = new ArrayList<Panel>();
-	private List<Anchorchildren> columnList = new ArrayList<Anchorchildren>();
+	private List<Anchorchildren> columnList;
 	private Anchorlayout dashboardLayout;
 	private Anchorchildren maximizedHolder;	
 	private DashboardRunnable dashboardRunnable;
 	private Timer dashboardTimer;
+	private boolean isShowInDashboard;
+	private int noOfCols;
 	
 	private final static int DEFAULT_DASHBOARD_WIDTH = 95;
 	
@@ -116,13 +121,24 @@ public class DashboardController implements EventListener<Event> {
 	}
 	
 	public void render(Component parent, IDesktop desktopImpl, boolean isShowInDashboard) {
-		parent.appendChild(dashboardLayout);
+		render(parent, desktopImpl, isShowInDashboard, false);
+	}
+	
+	protected void render(Component parent, IDesktop desktopImpl, boolean isShowInDashboard, boolean update) {
+		this.isShowInDashboard = isShowInDashboard;
+		if (!update)
+			parent.appendChild(dashboardLayout);
+		if (!update && isShowInDashboard)
+			((HtmlBasedComponent)parent).setStyle("overflow-x: auto;");
 		dashboardLayout.getChildren().clear();
         
         if (!dashboardLayout.getDesktop().isServerPushEnabled())
         	dashboardLayout.getDesktop().enableServerPush(true);
         
-        dashboardRunnable = new DashboardRunnable(parent.getDesktop());
+        if (!update)
+        	dashboardRunnable = new DashboardRunnable(parent.getDesktop());
+        
+        columnList = new ArrayList<Anchorchildren>();
         
         // Dashboard content
         Vlayout dashboardColumnLayout = null;
@@ -149,6 +165,16 @@ public class DashboardController implements EventListener<Event> {
         	}
         	               
         	noOfCols = MDashboardPreference.getForSessionColumnCount(isShowInDashboard, AD_User_ID, AD_Role_ID);        	
+        	if (ClientInfo.isMobile() && isShowInDashboard) {
+	        	if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1)) {
+	        		if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1)) {
+	        			noOfCols = 1;
+	        		} else if (noOfCols > 2) {
+	        			noOfCols = 2;
+	        		}
+	        	}
+        	}
+        	this.noOfCols = noOfCols;
             
         	int dashboardWidth = isShowInDashboard ? DEFAULT_DASHBOARD_WIDTH : 100;
             width = noOfCols <= 0 ? dashboardWidth : dashboardWidth / noOfCols;
@@ -164,57 +190,75 @@ public class DashboardController implements EventListener<Event> {
             	MDashboardContent dc = new MDashboardContent(dp.getCtx(), dp.getPA_DashboardContent_ID(), dp.get_TrxName());
             	
 	        	int columnNo = dp.getColumnNo();
-	        	if(dashboardColumnLayout == null || currentColumnNo != columnNo)
+	        	int effColumn = columnNo;
+	        	if (effColumn+1 > noOfCols)
+	        		effColumn = noOfCols-1;
+	        	if(dashboardColumnLayout == null || currentColumnNo != effColumn)
 	        	{
 	        		dashboardColumnLayout = new Vlayout();
+	        		dashboardColumnLayout.setSclass("dashboard-column");
 	        		dashboardColumnLayout.setAttribute("ColumnNo", columnNo);
 	        		dashboardColumnLayout.setAttribute("IsShowInDashboard", isShowInDashboard);
 	        		dashboardColumnLayout.setAttribute("IsAdditionalColumn", false);
 	        		Anchorchildren dashboardColumn = new Anchorchildren();
 	        		dashboardColumn.setAnchor(width + "%" + " 100%");
-	        		dashboardColumn.setDroppable("true");
+	        		if (!ClientInfo.isMobile())
-	        		dashboardColumn.addEventListener(Events.ON_DROP, this);
+	        		{
+		        		dashboardColumn.setDroppable("true");
+		        		dashboardColumn.addEventListener(Events.ON_DROP, this);
+	        		}
 	        		dashboardColumn.appendChild(dashboardColumnLayout);
 	        		columnList.add(dashboardColumn);
 	                dashboardLayout.appendChild(dashboardColumn);
 	                ZKUpdateUtil.setHflex(dashboardColumnLayout, "1");
 
-	                currentColumnNo = columnNo;
+	                currentColumnNo = effColumn;
 	        	}
 
-	        	Panel panel = new Panel();
+	        	Panel panel = null;
-	        	Caption caption = new Caption(dc.get_Translation(MDashboardContent.COLUMNNAME_Name));
+	        	if (update) {
-	        	panel.appendChild(caption);
+	        		panel = findPanel(dp.getPA_DashboardContent_ID(), dp.getPA_DashboardPreference_ID());
-	        	panel.setAttribute("PA_DashboardContent_ID", dp.getPA_DashboardContent_ID());
+	        	} else {
-	        	panel.setAttribute("PA_DashboardPreference_ID", dp.getPA_DashboardPreference_ID());
+		        	panel = new Panel();
-	        	panelList.add(panel);
+		        	Caption caption = new Caption(dc.get_Translation(MDashboardContent.COLUMNNAME_Name));
-	        	panel.addEventListener(Events.ON_MAXIMIZE, this);
+		        	panel.appendChild(caption);
-	        	panel.setSclass("dashboard-widget");
+		        	panel.setAttribute("PA_DashboardContent_ID", dp.getPA_DashboardContent_ID());
-	        	panel.setMaximizable(true);
+		        	panel.setAttribute("PA_DashboardPreference_ID", dp.getPA_DashboardPreference_ID());
+		        	panelList.add(panel);
+		        	panel.addEventListener(Events.ON_MAXIMIZE, this);
+		        	panel.setSclass("dashboard-widget");
+		        	panel.setMaximizable(true);	        	
 	        	
-	        	String description = dc.get_Translation(MDashboardContent.COLUMNNAME_Description);
+		        	String description = dc.get_Translation(MDashboardContent.COLUMNNAME_Description);
-            	if(description != null)
+	            	if(description != null)
-            		panel.setTooltiptext(description);
+	            		panel.setTooltiptext(description);
 	
-            	panel.setCollapsible(dc.isCollapsible());
+	            	panel.setCollapsible(dc.isCollapsible());
-            	panel.setOpen(!dp.isCollapsedByDefault());
+	            	panel.setOpen(!dp.isCollapsedByDefault());
-            	panel.addEventListener(Events.ON_OPEN, this);
+	            	panel.addEventListener(Events.ON_OPEN, this);
 	            	
-            	panel.setDroppable("true");
+	            	if (!ClientInfo.isMobile()) {
-            	panel.getCaption().setDraggable("true");
+	            		panel.setDroppable("true");
-            	panel.addEventListener(Events.ON_DROP, this);
+	            		panel.getCaption().setDraggable("true");	            	
+	            		panel.addEventListener(Events.ON_DROP, this);
+	            	}
+		        	panel.setBorder("normal");
+	        	}
+	        	if (panel != null && panel.getAttribute(PANEL_EMPTY_ATTR) == null)
+	        		dashboardColumnLayout.appendChild(panel);
+	        	if (!update) {
+		            Panelchildren content = new Panelchildren();
+		            panel.appendChild(content);
 	
-	        	panel.setBorder("normal");
+		            boolean panelEmpty = true;
-	        	dashboardColumnLayout.appendChild(panel);
-	            Panelchildren content = new Panelchildren();
-	            panel.appendChild(content);
 	
-	            boolean panelEmpty = true;
+		            panelEmpty = !render(content, dc, dashboardRunnable);	            		
 		        	
-	            panelEmpty = !render(content, dc, dashboardRunnable);	            		
+		        	if (panelEmpty) {
-	        	
+		        		panel.detach();
-	        	if (panelEmpty)
+		        		panel.setAttribute(PANEL_EMPTY_ATTR, Boolean.TRUE);
-	        		panel.detach();	        	
+		        	}
+	        	}
 	        }
             
             if (dps.length == 0)
@@ -225,8 +269,11 @@ public class DashboardController implements EventListener<Event> {
         		dashboardColumnLayout.setAttribute("IsAdditionalColumn", true);
         		Anchorchildren dashboardColumn = new Anchorchildren();
         		dashboardColumn.setAnchor((width-5) + "%" + " 100%");
-        		dashboardColumn.setDroppable("true");
+        		if (!ClientInfo.isMobile())
-        		dashboardColumn.addEventListener(Events.ON_DROP, this);
+        		{
+        			dashboardColumn.setDroppable("true");
+        			dashboardColumn.addEventListener(Events.ON_DROP, this);
+        		}
         		dashboardColumn.appendChild(dashboardColumnLayout);
         		columnList.add(dashboardColumn);
                 dashboardLayout.appendChild(dashboardColumn);
@@ -242,8 +289,11 @@ public class DashboardController implements EventListener<Event> {
         		dashboardColumnLayout.setAttribute("IsAdditionalColumn", true);
         		Anchorchildren dashboardColumn = new Anchorchildren();
         		dashboardColumn.setAnchor(extraWidth + "% 100%");
-        		dashboardColumn.setDroppable("true");
+        		if (!ClientInfo.isMobile())
-        		dashboardColumn.addEventListener(Events.ON_DROP, this);
+        		{
+        			dashboardColumn.setDroppable("true");
+        			dashboardColumn.addEventListener(Events.ON_DROP, this);
+        		}
         		dashboardColumn.appendChild(dashboardColumnLayout);
         		columnList.add(dashboardColumn);
                 dashboardLayout.appendChild(dashboardColumn);
@@ -256,7 +306,7 @@ public class DashboardController implements EventListener<Event> {
 		}
         //
                 
-        if (!dashboardRunnable.isEmpty())
+        if (!update && !dashboardRunnable.isEmpty())
         {
         	dashboardRunnable.refreshDashboard(false);
 
@@ -277,6 +327,20 @@ public class DashboardController implements EventListener<Event> {
 		}
 	}
 
+	private Panel findPanel(int PA_DashboardContent_ID, int PA_DashboardPreference_ID) {
+		for(Panel panel : panelList) {
+			Object value1 = panel.getAttribute("PA_DashboardContent_ID");
+			Object value2 = panel.getAttribute("PA_DashboardPreference_ID");
+			if (value1 != null && value1 instanceof Number && value2 != null && value2 instanceof Number) {
+				int id1 = ((Number)value1).intValue();
+				int id2 = ((Number)value2).intValue();
+				if (id1 == PA_DashboardContent_ID && id2 == PA_DashboardPreference_ID)
+					return panel;
+			}
+		}
+		return null;
+	}
+
 	public  boolean render(Component content, MDashboardContent dc, DashboardRunnable dashboardRunnable) throws Exception {
 		boolean empty = true;
 		
@@ -704,8 +768,10 @@ public class DashboardController implements EventListener<Event> {
 			        		dashboardColumnLayout.setAttribute("IsAdditionalColumn", true);
 			        		Anchorchildren dashboardColumn = new Anchorchildren();
 			        		dashboardColumn.setAnchor(extraWidth + "% 100%");
-			        		dashboardColumn.setDroppable("true");
+			        		if (!ClientInfo.isMobile()) {
-			        		dashboardColumn.addEventListener(Events.ON_DROP, this);
+			        			dashboardColumn.setDroppable("true");
+			        			dashboardColumn.addEventListener(Events.ON_DROP, this);
+			        		}
 			        		dashboardColumn.appendChild(dashboardColumnLayout);
 			        		columnList.add(dashboardColumn);
 			                dashboardLayout.appendChild(dashboardColumn);
@@ -882,4 +948,23 @@ public class DashboardController implements EventListener<Event> {
 			}
 		}				
 	}
+	
+	public void updateLayout(ClientInfo clientInfo) {
+		if (isShowInDashboard) {
+			if (ClientInfo.isMobile()) {
+				int n = 0;
+	        	if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1)) {	        		
+	        		if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1)) {
+	        			n = 1;
+	        		} else {
+	        			n = 2;
+	        		}
+	        	}
+	        	if (noOfCols > 0 && n > 0 && noOfCols != n) {
+	        		render(null, null, true, true);
+	        		dashboardLayout.invalidate();
+	        	}
+        	}
+		}			
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/desktop/DefaultDesktop.java

@@ -98,9 +98,13 @@ import org.zkoss.zk.ui.event.SwipeEvent;
 import org.zkoss.zk.ui.metainfo.PageDefinition;
 import org.zkoss.zk.ui.util.Clients;
 import org.zkoss.zk.ui.util.DesktopCleanup;
+import org.zkoss.zul.Anchorchildren;
+import org.zkoss.zul.Anchorlayout;
 import org.zkoss.zul.Borderlayout;
 import org.zkoss.zul.Center;
 import org.zkoss.zul.East;
+import org.zkoss.zul.Image;
+import org.zkoss.zul.Popup;
 import org.zkoss.zul.West;
 
 /**
@@ -114,6 +118,10 @@ import org.zkoss.zul.West;
  */
 public class DefaultDesktop extends TabbedDesktop implements MenuListener, Serializable, EventListener<Event>, EventHandler, DesktopCleanup
 {
+	private static final String POPUP_OPEN_ATTR = "popup.open";
+
+	private static final String HOME_TAB_RENDER_ATTR = "homeTab.render";
+
 	/**
 	 * 
 	 */
@@ -160,6 +168,16 @@ public class DefaultDesktop extends TabbedDesktop implements MenuListener, Seria
 
 	private Window headerPopup;
 
+	private Image logo;
+
+	private boolean mobile;
+
+	private Popup eastPopup;
+	
+	private Popup westPopup;
+	
+	private ToolBarButton westBtn;
+
     public DefaultDesktop()
     {
     	super();
@@ -205,6 +223,7 @@ public class DefaultDesktop extends TabbedDesktop implements MenuListener, Seria
 					West w = (West) event.getTarget();
 					if (w.isOpen()) {
 						w.setOpen(false);
+						LayoutUtils.addSclass("slide", w);
 						updateMenuCollapsedPreference(true);
 					}
 				}
@@ -223,9 +242,12 @@ public class DefaultDesktop extends TabbedDesktop implements MenuListener, Seria
         UserPreference pref = SessionManager.getSessionApplication().getUserPreference();
         boolean menuCollapsed= pref.isPropertyBool(UserPreference.P_MENU_COLLAPSED);
         w.setOpen(!menuCollapsed);
+        if (!w.isOpen())
+        	LayoutUtils.addSclass("slide", w);
         
-        boolean mobile = Executions.getCurrent().getBrowser("mobile") !=null;
+        mobile = ClientInfo.isMobile();
     	w.setCollapsible(true);
+    	LayoutUtils.addSlideSclass(w);
 
         if (mobile) {
         	w.setOpen(false);
@@ -254,6 +276,7 @@ public class DefaultDesktop extends TabbedDesktop implements MenuListener, Seria
 					East e = (East) event.getTarget();
 					if (e.isOpen()) {
 						e.setOpen(false);
+						LayoutUtils.addSclass("slide", e);
 						updateHelpCollapsedPreference(true);
 					}
 				}
@@ -303,6 +326,30 @@ public class DefaultDesktop extends TabbedDesktop implements MenuListener, Seria
         if (mobile) {
         	e.setVisible(false);
         	e.setOpen(false);
+        	Component content = e.getFirstChild();
+        	eastPopup = new Popup();
+        	ToolBarButton btn = new ToolBarButton();
+        	btn.setIconSclass("z-icon-remove");
+        	btn.addEventListener(Events.ON_CLICK, evt -> eastPopup.close());
+        	eastPopup.appendChild(btn);
+        	btn.setStyle("position: absolute; top: 4px; right: 4px; padding: 2px 6px;");
+        	eastPopup.setStyle("padding-top: 20px;");
+        	eastPopup.appendChild(content);
+        	eastPopup.setPage(getComponent().getPage());
+        	eastPopup.setHeight("100%");        	
+        	helpController.setupFieldTooltip();
+        	
+        	westPopup = new Popup();        	
+        	westPopup.setStyle("padding-top: 10px;");
+        	westPopup.setPage(getComponent().getPage());
+        	westPopup.setHeight("100%");        	
+        	westPopup.addEventListener(Events.ON_OPEN, (OpenEvent oe) -> {
+        		if (oe.isOpen()) {
+        			westPopup.setAttribute(POPUP_OPEN_ATTR, Boolean.TRUE);
+        		} else {
+        			westPopup.removeAttribute(POPUP_OPEN_ATTR);
+        		}
+        	});
         }
 
         Center windowArea = layout.getCenter();
@@ -354,32 +401,33 @@ public class DefaultDesktop extends TabbedDesktop implements MenuListener, Seria
 
 		Adempiere.getThreadPoolExecutor().submit(new DesktopRunnable(runnable,layout.getDesktop()));
 
-		ToolBar toolbar = new ToolBar();
+		ToolBar toolbar = windowContainer.getToobar();
-        windowContainer.getComponent().appendChild(toolbar);
       
-        showHeader = new ToolBarButton() {
+		if (!mobile) {
-			@Override
+	        showHeader = new ToolBarButton() {
-			public void onPageDetached(Page page) {
+				@Override
-				super.onPageDetached(page);
+				public void onPageDetached(Page page) {
-				if (DefaultDesktop.this.headerPopup != null) {
+					super.onPageDetached(page);
-					DefaultDesktop.this.headerPopup.setPage(null);
+					if (DefaultDesktop.this.headerPopup != null) {
+						DefaultDesktop.this.headerPopup.setPage(null);
+					}
 				}
-			}
 	        	
-        };
+	        };
-        toolbar.appendChild(showHeader);
+	        toolbar.appendChild(showHeader);
-        showHeader.setImage(ThemeManager.getThemeResource(IMAGES_THREELINE_MENU_PNG));
+	        showHeader.setImage(ThemeManager.getThemeResource(IMAGES_THREELINE_MENU_PNG));
-        showHeader.addEventListener(Events.ON_CLICK, this);
+	        showHeader.addEventListener(Events.ON_CLICK, this);
-        showHeader.setSclass("window-container-toolbar-btn");
+	        showHeader.setSclass("window-container-toolbar-btn");
-        showHeader.setStyle("cursor: pointer; border: 1px solid transparent; padding: 2px;");
+	        showHeader.setStyle("cursor: pointer; border: 1px solid transparent; padding: 2px;");
-        showHeader.setVisible(false);
+	        showHeader.setVisible(false);
 	        
-        max = new ToolBarButton();
+	        max = new ToolBarButton();
-        toolbar.appendChild(max);
+	        toolbar.appendChild(max);
-        max.setImage(ThemeManager.getThemeResource(IMAGES_UPARROW_PNG));
+	        max.setImage(ThemeManager.getThemeResource(IMAGES_UPARROW_PNG));
-        max.addEventListener(Events.ON_CLICK, this);
+	        max.addEventListener(Events.ON_CLICK, this);
-        max.setSclass("window-container-toolbar-btn");
+	        max.setSclass("window-container-toolbar-btn");
-        max.setStyle("cursor: pointer; border: 1px solid transparent; padding: 2px;");
+	        max.setStyle("cursor: pointer; border: 1px solid transparent; padding: 2px;");
+		}
         
         contextHelp = new ToolBarButton();
         toolbar.appendChild(contextHelp);
@@ -390,9 +438,19 @@ public class DefaultDesktop extends TabbedDesktop implements MenuListener, Seria
         contextHelp.setTooltiptext(Util.cleanAmp(Msg.getElement(Env.getCtx(), "AD_CtxHelp_ID")));
         contextHelp.setVisible(!e.isVisible());
         
-        boolean headerCollapsed= pref.isPropertyBool(UserPreference.P_HEADER_COLLAPSED);
+        if (!mobile) {
-        if (headerCollapsed) {
+	        boolean headerCollapsed= pref.isPropertyBool(UserPreference.P_HEADER_COLLAPSED);
-        	collapseHeader();
+	        if (headerCollapsed) {
+	        	collapseHeader();
+	        }
+        }
+        
+        if (mobile) {
+	        westBtn = new ToolBarButton();
+	        westBtn.setImage(ThemeManager.getThemeResource(IMAGES_THREELINE_MENU_PNG));
+	        westBtn.addEventListener(Events.ON_CLICK, this);
+	        westBtn.setSclass("window-container-toolbar-btn");
+	        westBtn.setStyle("cursor: pointer; padding: 0px; margin: 0px;");
         }
         
         return layout;
@@ -507,10 +565,69 @@ public class DefaultDesktop extends TabbedDesktop implements MenuListener, Seria
 
 		dashboardController.render(homeTab, this, true);
 		
-		West w = layout.getWest();
+		homeTab.setAttribute(HOME_TAB_RENDER_ATTR, Boolean.TRUE);
-		w.getChildren().clear();
-		sideController.render(w, this, false);
 	
+		West w = layout.getWest();
+		Component side = null;
+		if (mobile)
+		{
+			westPopup.getChildren().clear();			
+			side = westPopup;
+			w.setVisible(false);	
+			if (westBtn.getParent() == null)
+			{
+				Component menuSearchPanel = pnlHead.getFellow("menuLookup");
+				menuSearchPanel.getParent().insertBefore(westBtn, menuSearchPanel);				
+			}
+        	setSidePopupWidth(westPopup);
+        	setSidePopupWidth(eastPopup);
+		}
+		else
+		{
+			w.getChildren().clear();
+			side = w;
+		}
+		sideController.render(side, this, false);
+		if (mobile)
+		{
+			ToolBarButton btn = new ToolBarButton();
+        	btn.setIconSclass("z-icon-remove");
+        	btn.addEventListener(Events.ON_CLICK, evt -> {
+        		westPopup.close();
+        		westPopup.removeAttribute(POPUP_OPEN_ATTR);
+        	});
+        	westPopup.appendChild(btn);
+        	btn.setStyle("position: absolute; top: 4px; right: 4px; padding: 2px 6px;");
+		}
+		logo = pnlHead.getLogo();
+		if (mobile && logo != null)
+		{
+			Anchorchildren ac = new Anchorchildren();
+			ac.appendChild(logo);
+			ac.setStyle("padding: 4px;");
+			Anchorlayout layout = (Anchorlayout) side.getFirstChild();
+			layout.insertBefore(ac, layout.getFirstChild());
+		}
+		
+		if (mobile)
+		{
+			pnlHead.invalidate();
+		}
+	}
+
+	protected void setSidePopupWidth(Popup popup) {
+		if (ClientInfo.minWidth(ClientInfo.LARGE_WIDTH))
+			popup.setWidth("30%");
+		else if (ClientInfo.minWidth(ClientInfo.MEDIUM_WIDTH))
+			popup.setWidth("40%");
+		else if (ClientInfo.minWidth(ClientInfo.SMALL_WIDTH))
+			popup.setWidth("50%");
+		else if (ClientInfo.minWidth(ClientInfo.EXTRA_SMALL_WIDTH))
+			popup.setWidth("60%");
+		else if (ClientInfo.minWidth(400))
+			popup.setWidth("70%");
+		else
+			popup.setWidth("80%");
 	}
 
 	public void onEvent(Event event)
@@ -540,10 +657,23 @@ public class DefaultDesktop extends TabbedDesktop implements MenuListener, Seria
         	}
         	else if (comp == contextHelp)
         	{
-        		layout.getEast().setVisible(true);
+        		if (mobile && eastPopup != null)
-        		layout.getEast().setOpen(true);
+        		{
-        		contextHelp.setVisible(false);
+        			eastPopup.open(layout.getCenter(), "overlap_end");
-        		updateHelpCollapsedPreference(false);
+        		}
+        		else
+        		{
+	        		layout.getEast().setVisible(true);
+	        		layout.getEast().setOpen(true);
+	        		LayoutUtils.removeSclass("slide", layout.getEast());
+	        		contextHelp.setVisible(false);
+	        		updateHelpCollapsedPreference(false);
+        		}
+        	}
+        	else if (comp == westBtn)
+        	{
+        		westPopup.open(layout.getNorth(), "overlap_start");
+        		westPopup.setAttribute(POPUP_OPEN_ATTR, Boolean.TRUE);
         	}
         	else if(comp instanceof ToolBarButton)
             {
@@ -716,7 +846,14 @@ public class DefaultDesktop extends TabbedDesktop implements MenuListener, Seria
 			"var e=new Object;e.target=t;w._docClick(e);}catch(error){}";
 	
 	private void autoHideMenu() {
-		if (layout.getWest().isCollapsible() && !layout.getWest().isOpen())
+		if (mobile) {
+			if (westPopup.getAttribute(POPUP_OPEN_ATTR) != null) {
+				westPopup.close();
+				westPopup.removeAttribute(POPUP_OPEN_ATTR);
+			}
+			pnlHead.closeSearchPopup();
+				
+		} else if (layout.getWest().isCollapsible() && !layout.getWest().isOpen())
 		{
 			String id = layout.getWest().getUuid();
 			Tab tab = windowContainer.getSelectedTab();
@@ -904,7 +1041,7 @@ public class DefaultDesktop extends TabbedDesktop implements MenuListener, Seria
 	@Override
 	public void onMenuSelected(int menuId) {
 		super.onMenuSelected(menuId);
-		if (showHeader.isVisible()) {
+		if (showHeader != null && showHeader.isVisible()) {
 			//ensure header popup is close
 			String script = "var w=zk.Widget.$('#" + layout.getUuid()+"'); " +
 					"zWatch.fire('onFloatUp', w);";
@@ -975,4 +1112,22 @@ public class DefaultDesktop extends TabbedDesktop implements MenuListener, Seria
 			}
 		}
 	}
+
+	@Override
+	public void setClientInfo(ClientInfo clientInfo) {
+		super.setClientInfo(clientInfo);
+		if (clientInfo.tablet) {
+			if (homeTab != null && homeTab.getAttribute(HOME_TAB_RENDER_ATTR) != null) {
+				dashboardController.updateLayout(clientInfo);
+				updateSideLayout();
+			}
+		}
+	}
+
+	private void updateSideLayout() {
+		if (westPopup != null && westPopup.getChildren().size() > 1)
+			setSidePopupWidth(westPopup);
+		if (eastPopup != null && eastPopup.getChildren().size() > 1)
+			setSidePopupWidth(eastPopup);
+	}  
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/editor/WEditor.java

@@ -23,6 +23,7 @@ import java.beans.PropertyChangeListener;
 import java.util.ArrayList;
 
 import org.adempiere.webui.AdempiereWebUI;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.component.Bandbox;
 import org.adempiere.webui.component.Button;
@@ -119,25 +120,33 @@ public abstract class WEditor implements EventListener<Event>, PropertyChangeLis
 		// when field have label, add action zoom when click to label, and show menu when right click to label
 		if (!readOnly)
 		{		
-			if (popupMenu.isZoomEnabled() && this instanceof IZoomableEditor)
+			//long press conflict with text selection gesture on mobile
+			if (ClientInfo.isMobile())
 			{
-				// add action zoom when click to label
+				label.addEventListener(Events.ON_CLICK, evt-> popupMenu.open(label, "after_end"));
-				label.addEventListener(Events.ON_CLICK, new EventListener<Event> (){
-					public void onEvent(Event event) throws Exception {
-						if (Events.ON_CLICK.equals(event.getName())) {
-							((IZoomableEditor)WEditor.this).actionZoom();
-						}
-
-					}
-				});
 			}
-
+			else
-			// show menu when right click to label
-			popupMenu.addContextElement(label);
-			
-			if (component instanceof XulElement) 
 			{
-				popupMenu.addContextElement((XulElement) component);
+				if (popupMenu.isZoomEnabled() && this instanceof IZoomableEditor)
+				{
+					// add action zoom when click to label
+					label.addEventListener(Events.ON_CLICK, new EventListener<Event> (){
+						public void onEvent(Event event) throws Exception {
+							if (Events.ON_CLICK.equals(event.getName())) {
+								((IZoomableEditor)WEditor.this).actionZoom();
+							}
+	
+						}
+					});
+				}
+	
+				// show menu when right click to label
+				popupMenu.addContextElement(label);
+				
+				if (component instanceof XulElement) 
+				{
+					popupMenu.addContextElement((XulElement) component);
+				}
 			}
 		}
 		
@@ -551,7 +560,13 @@ public abstract class WEditor implements EventListener<Event>, PropertyChangeLis
 
 	protected void applyLabelStyles() {
 		if (label != null) {
-			String style = (isZoomable() ? STYLE_ZOOMABLE_LABEL : "") + (isMandatoryStyle() ? STYLE_EMPTY_MANDATORY_LABEL : STYLE_NORMAL_LABEL);			
+			boolean zoomable = isZoomable();
+			String style = (zoomable ? STYLE_ZOOMABLE_LABEL : "") + (isMandatoryStyle() ? STYLE_EMPTY_MANDATORY_LABEL : STYLE_NORMAL_LABEL);
+			if (ClientInfo.isMobile()) {
+				if (!zoomable && popupMenu != null) {
+					style = style + STYLE_MOBILE_ZOOMABLE;
+				}
+			}
 			if (gridField.getAD_LabelStyle_ID() > 0) 
 			{
 				String s = buildStyle(gridField.getAD_LabelStyle_ID());
@@ -785,6 +800,7 @@ public abstract class WEditor implements EventListener<Event>, PropertyChangeLis
 	private static final String STYLE_ZOOMABLE_LABEL = "cursor: pointer; text-decoration: underline;";
 	private static final String STYLE_NORMAL_LABEL = "color: #333;";
 	private static final String STYLE_EMPTY_MANDATORY_LABEL = "color: red;";
+	private static final String STYLE_MOBILE_ZOOMABLE = "cursor: pointer;";
 	
 	private static class EvaluateeWrapper implements Evaluatee {
 		

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/editor/WLocationEditor.java

@@ -21,6 +21,7 @@ import java.beans.PropertyChangeEvent;
 import java.beans.PropertyChangeListener;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.ValuePreference;
 import org.adempiere.webui.component.Locationbox;
@@ -29,6 +30,7 @@ import org.adempiere.webui.event.ContextMenuListener;
 import org.adempiere.webui.event.DialogEvents;
 import org.adempiere.webui.event.ValueChangeEvent;
 import org.adempiere.webui.theme.ThemeManager;
+import org.adempiere.webui.util.ZKUpdateUtil;
 import org.adempiere.webui.window.WFieldRecordInfo;
 import org.adempiere.webui.window.WLocationDialog;
 import org.compiere.model.GridField;
@@ -208,6 +210,25 @@ public class WLocationEditor extends WEditor implements EventListener<Event>, Pr
 			});
             ld.setTitle(null);
             LayoutUtils.openPopupWindow(getComponent(), ld);
+            if (ClientInfo.isMobile())
+    		{
+            	ld.setAttribute("mobile.orientation", ClientInfo.get().orientation);
+    			ClientInfo.onClientInfo(ld, () -> {
+    				if (ld.getPage() != null) {
+    					String orientation = (String) ld.getAttribute("mobile.orientation");
+    					String newOrientation = ClientInfo.get().orientation;
+    					if (!newOrientation.equals(orientation)) {
+    						ld.setAttribute("mobile.orientation", newOrientation);
+    						
+    						ZKUpdateUtil.setCSSHeight(ld);
+    						ZKUpdateUtil.setCSSWidth(ld);    						
+    						ld.invalidate();
+    						LayoutUtils.openPopupWindow(getComponent(), ld, 100);
+    						
+    					}	    				
+    				}
+    			});
+    		}
         }
     }
     

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/editor/WLocatorEditor.java

@@ -24,6 +24,7 @@ import java.sql.ResultSet;
 import java.sql.SQLException;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.ValuePreference;
 import org.adempiere.webui.apps.AEnv;
@@ -33,6 +34,7 @@ import org.adempiere.webui.event.ContextMenuListener;
 import org.adempiere.webui.event.DialogEvents;
 import org.adempiere.webui.event.ValueChangeEvent;
 import org.adempiere.webui.theme.ThemeManager;
+import org.adempiere.webui.util.ZKUpdateUtil;
 import org.adempiere.webui.window.WFieldRecordInfo;
 import org.adempiere.webui.window.WLocatorDialog;
 import org.compiere.model.GridField;
@@ -255,6 +257,25 @@ public class WLocatorEditor extends WEditor implements EventListener<Event>, Pro
 			//	display
 			ld.setTitle(null);
 			LayoutUtils.openPopupWindow(getComponent(), ld);
+			if (ClientInfo.isMobile())
+    		{
+            	ld.setAttribute("mobile.orientation", ClientInfo.get().orientation);
+    			ClientInfo.onClientInfo(ld, () -> {
+    				if (ld.getPage() != null) {
+    					String orientation = (String) ld.getAttribute("mobile.orientation");
+    					String newOrientation = ClientInfo.get().orientation;
+    					if (!newOrientation.equals(orientation)) {
+    						ld.setAttribute("mobile.orientation", newOrientation);
+    						
+    						ZKUpdateUtil.setCSSHeight(ld);
+    						ZKUpdateUtil.setCSSWidth(ld);    						
+    						ld.invalidate();
+    						LayoutUtils.openPopupWindow(getComponent(), ld, 100);
+    						
+    					}	    				
+    				}
+    			});
+    		}
 		}
 	}
 	

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/editor/WNumberEditor.java

@@ -20,6 +20,7 @@ package org.adempiere.webui.editor;
 import java.math.BigDecimal;
 import java.text.DecimalFormat;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.ValuePreference;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.component.NumberBox;
@@ -153,6 +154,9 @@ public class WNumberEditor extends WEditor implements ContextMenuListener
     	addChangeLogMenu(popupMenu);
     	
     	originalStyle = getComponent().getDecimalbox().getStyle();
+    	getComponent().getDecimalbox().setClientAttribute("type", "number");
+    	if (ClientInfo.isMobile())
+    		getComponent().getButton().setVisible(false);
     }
 	
 	/**

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/editor/WSearchEditor.java

@@ -26,6 +26,7 @@ import java.sql.ResultSet;
 import java.sql.SQLException;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.ValuePreference;
 import org.adempiere.webui.adwindow.ADWindow;
@@ -500,7 +501,7 @@ public class WSearchEditor extends WEditor implements ContextMenuListener, Value
 
 		vqe.setSizable(true);
 		adwindow = ADWindow.findADWindow(getComponent());
-		if (adwindow != null) {
+		if (adwindow != null && !ClientInfo.isMobile()) {
 			ADWindowContent content = adwindow.getADWindowContent();				
 			content.getComponent().getParent().appendChild(vqe);
 			content.showBusyMask(vqe);

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/editor/WStringEditor.java

@@ -170,6 +170,8 @@ public class WStringEditor extends WEditor implements ContextMenuListener
 	        		combo.appendItem(s);
 	        	}
 	        }
+	        if ("email".equalsIgnoreCase(gridField.getColumnName()))
+	        	getComponent().setClientAttribute("type", "email");
 		}
     }
 

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/editor/WUrlEditor.java

@@ -41,6 +41,8 @@ public class WUrlEditor extends WEditor implements ContextMenuListener
 		popupMenu = new WEditorPopupMenu(false, false, isShowPreference());
 		popupMenu.addMenuListener(this);
 		addChangeLogMenu(popupMenu);
+		
+		getComponent().getTextbox().setClientAttribute("type", "url");
 	}
 
 

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/factory/DefaultEditorFactory.java

@@ -70,7 +70,7 @@ public class DefaultEditorFactory implements IEditorFactory {
 
         /** String (clear/password) */
         if (displayType == DisplayType.String
-            || displayType == DisplayType.PrinterName
+            || displayType == DisplayType.PrinterName || displayType == DisplayType.Color
             || (tableEditor && (displayType == DisplayType.Text || displayType == DisplayType.TextLong)))
         {
             if (gridField.isEncryptedField())
@@ -81,6 +81,9 @@ public class DefaultEditorFactory implements IEditorFactory {
             {
                 editor = new WStringEditor(gridField, tableEditor);
             }
+            //enable html5 color input type
+            if (displayType == DisplayType.Color)
+            	((WStringEditor)editor).getComponent().setClientAttribute("type", "color");
         }
         /** File */
         else if (displayType == DisplayType.FileName)

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/grid/WQuickEntry.java

@@ -19,6 +19,7 @@ import java.util.List;
 import java.util.logging.Level;
 
 import org.adempiere.base.Core;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.component.ConfirmPanel;
 import org.adempiere.webui.component.Label;
 import org.adempiere.webui.component.Window;
@@ -28,6 +29,7 @@ import org.adempiere.webui.editor.WebEditorFactory;
 import org.adempiere.webui.event.ValueChangeEvent;
 import org.adempiere.webui.event.ValueChangeListener;
 import org.adempiere.webui.session.SessionManager;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.adempiere.webui.window.FDialog;
 import org.compiere.model.GridField;
@@ -89,6 +91,8 @@ public class WQuickEntry extends Window implements EventListener<Event>, ValueCh
 	protected int m_AD_Window_ID;
 	
 	private boolean isHasField = false;
+
+	private String orientation;
 	/**
 	 *	Constructor.
 	 *	Requires call loadRecord
@@ -136,7 +140,16 @@ public class WQuickEntry extends Window implements EventListener<Event>, ValueCh
 
 	private void jbInit() throws Exception
 	{
-		ZKUpdateUtil.setWidth(this, "350px");
+		if (!ThemeManager.isUseCSSForWindowSize()) {
+			ZKUpdateUtil.setWindowWidthX(this, 350);
+		} else {
+			addCallback(AFTER_PAGE_ATTACHED, t -> {
+				ZKUpdateUtil.setCSSWidth(this);
+				ZKUpdateUtil.setCSSHeight(this);
+			});
+		}
+		
+		this.setSclass("quick-entry-dialog");
 		this.setBorder("normal");
 		this.setClosable(true);
 		this.setSizable(true);
@@ -145,6 +158,29 @@ public class WQuickEntry extends Window implements EventListener<Event>, ValueCh
 		ZKUpdateUtil.setWidth(centerPanel, "100%");
 
 		confirmPanel.addActionListener(Events.ON_CLICK, this);
+		
+		if (ClientInfo.isMobile())
+		{
+			if (ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH) || ClientInfo.maxHeight(ClientInfo.SMALL_HEIGHT))
+			{
+				confirmPanel.addButtonSclass("btn-small small-image-btn");
+			}
+			orientation = ClientInfo.get().orientation;
+			ClientInfo.onClientInfo(this, this::onClientInfo);
+		}
+	}
+
+	protected void onClientInfo()
+	{
+		if (getPage() != null) {
+			String newOrientation = ClientInfo.get().orientation;
+			if (!newOrientation.equals(orientation)) {
+				orientation = newOrientation;
+				ZKUpdateUtil.setCSSWidth(this);
+				ZKUpdateUtil.setCSSHeight(this);
+				this.invalidate();
+			}			
+		}
 	}
 	
 	/**

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/info/InfoProductWindow.java

@@ -11,6 +11,7 @@ import java.util.ArrayList;
 import java.util.Vector;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.component.Borderlayout;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Checkbox;
@@ -336,6 +337,11 @@ public class InfoProductWindow extends InfoWindow {
 			}
 		});
 		south.setSclass("south-collapsible-with-title");
+		if (ClientInfo.maxHeight(ClientInfo.MEDIUM_HEIGHT-1))
+		{
+			south.setOpen(false);
+			ZKUpdateUtil.setHeight(south, "100%");
+		}
 		contentBorderLayout.appendChild(south);
 		tabbedPane.setSclass("info-product-tabbedpane");
 		south.appendChild(tabbedPane);
@@ -355,7 +361,8 @@ public class InfoProductWindow extends InfoWindow {
 					for(int i = 0; i < columnInfos.length; i++) {
 						if (columnInfos[i].getGridField() != null && columnInfos[i].getGridField().getColumnName().equals("Value")) {
 							refresh(M_Warehouse_ID, M_PriceList_Version_ID);
-		        			contentBorderLayout.getSouth().setOpen(true);
+							if (ClientInfo.minHeight(ClientInfo.MEDIUM_HEIGHT))
+								contentBorderLayout.getSouth().setOpen(true);
 		        			break;
 						}
 					}

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/info/InfoWindow.java

@@ -18,6 +18,7 @@ import org.adempiere.model.IInfoColumn;
 import org.adempiere.model.MInfoProcess;
 import org.adempiere.model.MInfoRelated;
 import org.adempiere.webui.AdempiereWebUI;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.ISupportMask;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.apps.AEnv;
@@ -139,6 +140,7 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
 	 * Menu contail process menu item
 	 */
 	protected Menupopup ipMenu;
+	private int noOfParameterColumn;
 	/**
 	 * @param WindowNo
 	 * @param tableName
@@ -214,6 +216,10 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
 			}			
 		}
 		
+		if (ClientInfo.isMobile()) {
+			ClientInfo.onClientInfo(this, this::onClientInfo);
+		}
+		
 	}
 	
 	/**
@@ -1100,7 +1106,7 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
 		ZKUpdateUtil.setHeight(layout, "100%");
         if (!isLookup())
         {
-        	layout.setStyle("position: absolute");
+        	layout.setStyle("position: relative");
         }
         this.appendChild(layout);
 		
@@ -1113,6 +1119,10 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
         contentPanel.setSpan(true);
         
         North north = new North();
+        north.setCollapsible(true);
+        north.setSplittable(true);
+        north.setAutoscroll(true);
+        LayoutUtils.addSlideSclass(north);
         layout.appendChild(north);
         renderParameterPane(north);
         
@@ -1172,10 +1182,7 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
 		ZKUpdateUtil.setWidth(inner, "100%");
 		ZKUpdateUtil.setHeight(inner, "100%");
 		int height = SessionManager.getAppDesktop().getClientInfo().desktopHeight * 90 / 100;
-		if (isLookup())
+		inner.setStyle("border: none; position: relative; ");
-			inner.setStyle("border: none; position: relative; ");
-		else
-			inner.setStyle("border: none; position: absolute; ");
 		inner.appendCenter(div);
 		//true will conflict with listbox scrolling
 		inner.getCenter().setAutoscroll(false);
@@ -1220,12 +1227,21 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
 	}
 
 	protected void createParameterPanel() {
-		parameterGrid = GridFactory.newGridLayout();
+		layoutParameterGrid(false);
-		parameterGrid.setWidgetAttribute(AdempiereWebUI.WIDGET_INSTANCE_NAME, "infoParameterPanel");
+	}
-		parameterGrid.setStyle("width: 95%; margin: auto !important;");
+	
+	protected void layoutParameterGrid(boolean update) {
+		if (!update) {
+			parameterGrid = GridFactory.newGridLayout();
+			parameterGrid.setWidgetAttribute(AdempiereWebUI.WIDGET_INSTANCE_NAME, "infoParameterPanel");
+			parameterGrid.setStyle("width: 95%; margin: auto !important;");
+		}
+		if (parameterGrid.getColumns() != null)
+			parameterGrid.getColumns().detach();
 		Columns columns = new Columns();
 		parameterGrid.appendChild(columns);
-		for(int i = 0; i < 6; i++)
+		noOfParameterColumn = getNoOfParameterColumns();
+		for(int i = 0; i < noOfParameterColumn; i++)
 			columns.appendChild(new Column());
 		
 		Column column = new Column();
@@ -1233,11 +1249,15 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
 		column.setAlign("right");
 		columns.appendChild(column);
 		
+		if (parameterGrid.getRows() != null)
+			parameterGrid.getRows().detach();
 		Rows rows = new Rows();
 		parameterGrid.appendChild(rows);
 		
-		editors = new ArrayList<WEditor>();
+		if (!update) {
-		identifiers = new ArrayList<WEditor>();
+			editors = new ArrayList<WEditor>();
+			identifiers = new ArrayList<WEditor>();
+		}
 		TreeMap<Integer, List<Object[]>> tree = new TreeMap<Integer, List<Object[]>>();
 		for (int i = 0; i < infoColumns.length; i++)
 		{
@@ -1254,7 +1274,16 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
 		for (Integer i : tree.keySet()) {
 			List<Object[]> list = tree.get(i);
 			for(Object[] value : list) {
-				addSelectionColumn((MInfoColumn)value[0], (GridField)value[1]);
+				if (update) {
+					for (WEditor editor : editors) {
+						if (editor.getGridField() == value[1]) {
+							addSearchParameter(editor.getLabel(), editor.getComponent());
+							break;
+						}
+					}
+				} else {
+					addSelectionColumn((MInfoColumn)value[0], (GridField)value[1]);
+				}
 			}
 		}
 		
@@ -1271,7 +1300,8 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
 			}
 		}
 		evalDisplayLogic();
-		initParameters();
+		if (!update)
+			initParameters();
 		dynamicDisplay(null);
 	}
 	
@@ -1364,7 +1394,7 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
         else
         {
         	panel = (Row) parameterGrid.getRows().getLastChild();
-        	if (panel.getChildren().size() == 6)
+        	if (panel.getChildren().size() == getNoOfParameterColumns())
         	{
         		if (parameterGrid.getRows().getChildren().size() == 1) 
         		{
@@ -1398,6 +1428,15 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
         panel.appendChild(outerParent);
 	}
 
+	protected int getNoOfParameterColumns() {
+		if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1))
+			return 2;
+		else if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1))
+			return 4;
+		else
+			return 6;
+	}
+
 	protected void createAndCheckbox() {
 		checkAND = new Checkbox();
 		checkAND.setLabel(Msg.getMsg(Env.getCtx(), "SearchAND", true));
@@ -1503,6 +1542,11 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
     protected void executeQuery() {
     	prepareTable();
     	super.executeQuery();
+    	if (ClientInfo.maxHeight(ClientInfo.SMALL_HEIGHT-1) ||
+    		ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1)) {
+    		layout.getNorth().setOpen(false);
+    		LayoutUtils.addSclass("slide", layout.getNorth());
+    	}
     }
     
 	@Override
@@ -1676,6 +1720,14 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
 		}
 	}
 	
+	protected void onClientInfo() {
+		int t = getNoOfParameterColumns();
+		if (t > 0 && noOfParameterColumn > 0 && t != noOfParameterColumn) {
+			layoutParameterGrid(true);
+			this.invalidate();
+		}
+	}
+
 	/**
 	 * 	Test Row Count
 	 *	@return true if display
@@ -2055,7 +2107,7 @@ public class InfoWindow extends InfoPanel implements ValueChangeListener, EventL
 		// eval only mandatory field
 		if (validateGrid.isMandatory(true)){
 			// update color of field
-			wEditor.updateLabelStyle();
+			wEditor.updateStyle();
 			Object data = wEditor.getValue();
 			if (data == null || data.toString().length() == 0) {				
 				return false;

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/ADForm.java

@@ -78,8 +78,8 @@ public abstract class ADForm extends Window implements EventListener<Event>, IHe
          m_WindowNo = SessionManager.getAppDesktop().registerWindow(this);
 
          ZKUpdateUtil.setWidth(this, "100%");
-         ZKUpdateUtil.setHeight(this, "95%");
+         ZKUpdateUtil.setHeight(this, "99%");
-         this.setStyle("position:absolute");
+         this.setStyle("position:relative");
          this.setContentSclass("adform-content");
     }
 

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/CustomizeGridViewPanel.java

@@ -26,6 +26,7 @@ import java.util.logging.Level;
 
 import org.adempiere.exceptions.DBException;
 import org.adempiere.model.MTabCustomization;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.adwindow.GridView;
 import org.adempiere.webui.component.Button;
@@ -184,8 +185,11 @@ public class CustomizeGridViewPanel extends Panel
 		EventListener<Event> crossListMouseListener = new DragListener();
 		yesList.addOnDropListener(crossListMouseListener);
 		noList.addOnDropListener(crossListMouseListener);
-		yesList.setItemDraggable(true);
+		if (!ClientInfo.isMobile()) 
-		noList.setItemDraggable(true);
+		{
+			yesList.setItemDraggable(true);
+			noList.setItemDraggable(true);
+		}
 
 		actionListener = new EventListener<Event>()
 		{
@@ -262,7 +266,8 @@ public class CustomizeGridViewPanel extends Panel
 		chkSaveWidth.setLabel(Msg.getMsg(Env.getCtx(), "SaveColumnWidth"));
 
 		sep = new Separator("vertical");
-		sep.setSpacing("200px");
+		if (ClientInfo.minWidth(ClientInfo.SMALL_WIDTH))
+			sep.setSpacing("200px");
 		southPanel.appendChild(sep);
 		lblGridMode.setValue(Msg.getMsg(Env.getCtx(), "OpenInGridMode"));
 		southPanel.appendChild(lblGridMode);

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/HeaderPanel.java

@@ -17,6 +17,8 @@
 
 package org.adempiere.webui.panel;
 
+import org.adempiere.webui.ClientInfo;
+import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.apps.GlobalSearch;
 import org.adempiere.webui.apps.MenuSearchController;
 import org.adempiere.webui.component.Panel;
@@ -31,6 +33,7 @@ import org.zkoss.zk.ui.Page;
 import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
 import org.zkoss.zk.ui.event.Events;
+import org.zkoss.zk.ui.event.OpenEvent;
 import org.zkoss.zul.Image;
 import org.zkoss.zul.Popup;
 import org.zkoss.zul.impl.LabelImageElement;
@@ -72,8 +75,13 @@ public class HeaderPanel extends Panel implements EventListener<Event>
     	createSearchPanel();
 
     	btnMenu = (LabelImageElement) getFellow("menuButton");
-    	btnMenu.setLabel(Util.cleanAmp(Msg.getMsg(Env.getCtx(),"Menu")));
+    	btnMenu.setIconSclass("z-icon-sitemap");
+    	btnMenu.setTooltiptext(Util.cleanAmp(Msg.getMsg(Env.getCtx(),"Menu")));
     	btnMenu.addEventListener(Events.ON_CLICK, this);
+    	if (ClientInfo.isMobile()) {
+    		LayoutUtils.addSclass("mobile", this);
+    		ClientInfo.onClientInfo(this, this::onClientInfo);
+    	}
     }
 
 	protected void createPopupMenu() {
@@ -82,8 +90,13 @@ public class HeaderPanel extends Panel implements EventListener<Event>
 		menuTreePanel = new MenuTreePanel(popMenu);
     	popMenu.setSclass("desktop-menu-popup");
     	ZKUpdateUtil.setHeight(popMenu, "90%");
-    	ZKUpdateUtil.setWidth(popMenu, "600px");
+    	ZKUpdateUtil.setWindowWidthX(popMenu, 600);
     	popMenu.setPage(this.getPage());
+    	popMenu.addEventListener(Events.ON_OPEN, (OpenEvent evt) -> popMenuOpenEvent(evt));
+	}
+
+	private void popMenuOpenEvent(OpenEvent evt) {
+		popMenu.setAttribute(popMenu.getUuid(), System.currentTimeMillis());
 	}
 
 	protected void createSearchPanel() {
@@ -104,6 +117,11 @@ public class HeaderPanel extends Panel implements EventListener<Event>
 			}
 			else if(event.getTarget() == btnMenu )
 			{
+				Long ts = (Long) popMenu.removeAttribute(popMenu.getUuid());
+				if (ts != null) {
+					if ((System.currentTimeMillis()-ts.longValue()) < 500)
+						return;
+				}
 				popMenu.open(btnMenu, "after_start");
 			}
 		} else if (Events.ON_CREATE.equals(event.getName())) {
@@ -131,5 +149,20 @@ public class HeaderPanel extends Panel implements EventListener<Event>
 			popMenu.setPage(null);
 	}
 	
+	public Image getLogo() {
+		return image;
+	}
 	
+	public void closeSearchPopup() {
+		Component c = getFellow("menuLookup");
+		if (c != null && c instanceof GlobalSearch)
+			((GlobalSearch)c).closePopup();
+	}
+	
+	protected void onClientInfo() {
+		ZKUpdateUtil.setWindowWidthX(popMenu, 600);
+		Component c = getFellow("menuLookup");
+		if (c != null && c instanceof GlobalSearch)
+			((GlobalSearch)c).onClientInfo();
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/HelpController.java

@@ -124,7 +124,7 @@ public class HelpController
         		"if (typeof description=='string' && description.length > 0) {s=s+'<br><br><i>'+description+'</i>';}" +
         		"if (typeof help=='string' && help.length > 0) {s=s+'<br><br>'+help;}}" +
         		"s=s+'</div></body></html>';this.setContent(s);}");
-        Clients.response(new AuScript(htmlToolTip, "var w=zk.Widget.$('#"+htmlToolTip.getUuid()+"');zWatch.listen({onFieldTooltip: w});"));
+        setupFieldTooltip();
         
         pnlContextHelp = new Panel();
         pnlContextHelp.setSclass("dashboard-widget");
@@ -143,6 +143,10 @@ public class HelpController
         renderQuickInfo(null);
     }
 
+	public void setupFieldTooltip() {
+		Clients.response("helpControllerFieldTooltip", new AuScript(htmlToolTip, "var w=zk.Widget.$('#"+htmlToolTip.getUuid()+"');zWatch.listen({onFieldTooltip: w});"));
+	}
+    
 	/**
 	 * Make tooltip content for a field 
 	 * @param field

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/InfoGeneralPanel.java

@@ -26,6 +26,7 @@ import java.util.ArrayList;
 import java.util.logging.Level;
 
 import org.adempiere.webui.AdempiereWebUI;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.component.Grid;
 import org.adempiere.webui.component.GridFactory;
 import org.adempiere.webui.component.Label;
@@ -43,9 +44,11 @@ import org.compiere.util.DisplayType;
 import org.compiere.util.Env;
 import org.compiere.util.Msg;
 import org.compiere.util.Util;
+import org.zkoss.zk.ui.Component;
 import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
 import org.zkoss.zul.Borderlayout;
+import org.zkoss.zul.Cell;
 import org.zkoss.zul.Center;
 import org.zkoss.zul.Div;
 import org.zkoss.zul.North;
@@ -86,6 +89,8 @@ public class InfoGeneralPanel extends InfoPanel implements EventListener<Event>
 	private Borderlayout layout;
 	private Vbox southBody;
 
+	private int noOfParameterColumn;
+
 	public InfoGeneralPanel(String queryValue, int windowNo,String tableName,String keyColumn, boolean isSOTrx, String whereClause)
 	{
 		this(queryValue, windowNo, tableName, keyColumn, isSOTrx, whereClause, true);
@@ -143,57 +148,41 @@ public class InfoGeneralPanel extends InfoPanel implements EventListener<Event>
             renderItems();
         }
 		
+		if (ClientInfo.isMobile()) {
+			ClientInfo.onClientInfo(this, this::onClientInfo);
+		}
 	}
 
 	private void initComponents()
 	{
 		Grid grid = GridFactory.newGridLayout();
+		ZKUpdateUtil.setWidth(grid, "100%");
+		ZKUpdateUtil.setVflex(grid, "min");
 
-		Rows rows = new Rows();
+		layoutParameterGrid(grid);
-		grid.appendChild(rows);
-
-		Row row = new Row();
-		rows.appendChild(row);
-		row.appendChild(lbl1.rightAlign());
-		row.appendChild(txt1);
-		ZKUpdateUtil.setHflex(txt1, "1");
-		row.appendChild(lbl2.rightAlign());
-		row.appendChild(txt2);
-		ZKUpdateUtil.setHflex(txt2, "1");
-		row.appendChild(lbl3.rightAlign());
-		row.appendChild(txt3);
-		ZKUpdateUtil.setHflex(txt3, "1");
-		row.appendChild(lbl4.rightAlign());
-		row.appendChild(txt4);
-		ZKUpdateUtil.setHflex(txt4, "1");
 
 		layout = new Borderlayout();
 		ZKUpdateUtil.setWidth(layout, "100%");
 		ZKUpdateUtil.setHeight(layout, "100%");
-        if (!isLookup())
+        layout.setStyle("position: relative");
-        {
-        	layout.setStyle("position: absolute");
-        }
         this.appendChild(layout);
 
         North north = new North();
         layout.appendChild(north);
 		north.appendChild(grid);
+		ZKUpdateUtil.setVflex(north, "min");
 
         Center center = new Center();
 		layout.appendChild(center);
 		Div div = new Div();
 		div.appendChild(contentPanel);
-		if (isLookup())
+		ZKUpdateUtil.setWidth(contentPanel, "100%");
-			ZKUpdateUtil.setWidth(contentPanel, "99%");
-        else
-        	contentPanel.setStyle("width: 99%; margin: 0px auto;");
         ZKUpdateUtil.setVflex(contentPanel, true);
         contentPanel.setSizedByContent(true);
-		div.setStyle("width :100%; height: 100%");
 		center.appendChild(div);
 		ZKUpdateUtil.setVflex(div, "1");
 		ZKUpdateUtil.setHflex(div, "1");
+		ZKUpdateUtil.setVflex(center, "1");
 
 		South south = new South();
 		layout.appendChild(south);
@@ -203,6 +192,63 @@ public class InfoGeneralPanel extends InfoPanel implements EventListener<Event>
 		southBody.appendChild(new Separator());
 		southBody.appendChild(confirmPanel);		
 		southBody.appendChild(statusBar);
+		ZKUpdateUtil.setVflex(south, "min");
+	}
+
+	protected void layoutParameterGrid(Grid grid) {
+		noOfParameterColumn = getNoOfParameterColumn();
+		Rows rows = new Rows();
+		grid.appendChild(rows);
+
+		Row row = new Row();
+		rows.appendChild(row);
+		row.appendChild(lbl1.rightAlign());
+		row.appendChild(txt1);
+		ZKUpdateUtil.setHflex(txt1, "1");
+		if (row.getChildren().size() % noOfParameterColumn == 0)
+			row = rows.newRow();
+		row.appendChild(lbl2.rightAlign());
+		row.appendChild(txt2);		
+		ZKUpdateUtil.setHflex(txt2, "1");
+		if (row.getChildren().size() % noOfParameterColumn == 0)
+			row = rows.newRow();
+		Cell cell = new Cell();
+		cell.setAlign("right");
+		cell.setValign("middle");
+		Div ldiv = new Div();
+		ldiv.appendChild(lbl3);
+		cell.appendChild(ldiv);
+		row.appendChild(cell);
+		cell = new Cell();
+		cell.setValign("middle");
+		cell.appendChild(txt3);
+		row.appendChild(cell);		
+		ZKUpdateUtil.setHflex(txt3, "1");
+		if (row.getChildren().size() % noOfParameterColumn == 0)
+			row = rows.newRow();
+		cell = new Cell();
+		cell.setAlign("right");
+		cell.setValign("middle");
+		ldiv = new Div();
+		ldiv.appendChild(lbl4);
+		cell.appendChild(ldiv);
+		row.appendChild(cell);
+		cell = new Cell();
+		cell.setValign("middle");
+		cell.appendChild(txt4);
+		row.appendChild(cell);
+		ZKUpdateUtil.setHflex(txt4, "1");
+	}
+
+	private int getNoOfParameterColumn() {
+		if (ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH-1))
+			return 2;
+		else if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1))
+			return 4;
+		else if (ClientInfo.maxWidth(ClientInfo.MEDIUM_WIDTH-1))
+			return 6;
+		else
+			return 8;
 	}
 
 	private void init()
@@ -258,6 +304,8 @@ public class InfoGeneralPanel extends InfoPanel implements EventListener<Event>
 		{
 			lbl3.setVisible(false);
 			txt3.setVisible(false);
+			hideCell(lbl3);
+			hideCell(txt3);
 		}
 
 		if (m_queryColumns.size() > 3)
@@ -268,10 +316,25 @@ public class InfoGeneralPanel extends InfoPanel implements EventListener<Event>
 		{
 			lbl4.setVisible(false);
 			txt4.setVisible(false);
+			hideCell(lbl4);
+			hideCell(txt4);
 		}
 		return true;
 	}
 
+	private void hideCell(Component comp) {
+		Component p = comp.getParent();
+		while (p != null)
+		{
+			if (p instanceof Cell)
+			{
+				p.setVisible(false);
+				break;
+			}
+			p = p.getParent();
+		}
+	}
+
 	private boolean initInfoTable ()
 	{
 		//	Get Query Columns
@@ -517,4 +580,16 @@ public class InfoGeneralPanel extends InfoPanel implements EventListener<Event>
 		southBody.insertBefore(paging, southBody.getFirstChild());
 		layout.invalidate();
     }
+    
+	protected void onClientInfo() {
+		if (layout != null && layout.getNorth() != null && layout.getNorth().getFirstChild() instanceof Grid) {
+			int t = getNoOfParameterColumn();
+			if (t > 0 && noOfParameterColumn > 0 && t != noOfParameterColumn) {
+				Grid grid = (Grid) layout.getNorth().getFirstChild();
+				grid.getRows().detach();
+				layoutParameterGrid(grid);
+				this.invalidate();
+			}
+		}
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/InfoPAttributeInstancePanel.java

@@ -67,9 +67,12 @@ public class InfoPAttributeInstancePanel extends Window implements EventListener
 	{
 		super();
 		setTitle(Msg.getMsg(Env.getCtx(), "PAttributeInstance"));
-		ZKUpdateUtil.setWidth(this, "700px");
+		ZKUpdateUtil.setWindowWidthX(this, 700);
-		ZKUpdateUtil.setHeight(this, "400px");
+		ZKUpdateUtil.setWindowHeightX(this, 400);
 		setSclass("popup-dialog");
+		setBorder("normal");
+		setSizable(true);
+		setMaximizable(true);
 		
 		init (M_Warehouse_ID, M_Locator_ID, M_Product_ID, C_BPartner_ID);
 		AEnv.showCenterWindow(parent, this);

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/InfoPanel.java

@@ -39,6 +39,7 @@ import org.adempiere.model.IInfoColumn;
 import org.adempiere.model.MInfoProcess;
 import org.adempiere.model.MInfoRelated;
 import org.adempiere.webui.AdempiereWebUI;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.apps.BusyDialog;
@@ -274,10 +275,20 @@ public abstract class InfoPanel extends Window implements EventListener<Event>,
 			setAttribute(Window.MODE_KEY, Window.MODE_HIGHLIGHTED);
 			setBorder("normal");
 			setClosable(true);
-			int height = SessionManager.getAppDesktop().getClientInfo().desktopHeight * 85 / 100;
+			int height = ClientInfo.get().desktopHeight;
-    		int width = SessionManager.getAppDesktop().getClientInfo().desktopWidth * 80 / 100;
+			int width = ClientInfo.get().desktopWidth;
-    		ZKUpdateUtil.setWidth(this, width + "px");
+			if (width <= ClientInfo.MEDIUM_WIDTH)
-    		ZKUpdateUtil.setHeight(this, height + "px");
+			{
+				ZKUpdateUtil.setWidth(this, "100%");
+				ZKUpdateUtil.setHeight(this, "100%");
+			}
+			else
+			{
+				height = height * 85 / 100;
+	    		width = width * 80 / 100;
+	    		ZKUpdateUtil.setWidth(this, width + "px");
+	    		ZKUpdateUtil.setHeight(this, height + "px");
+			}
     		this.setContentStyle("overflow: auto");
 		}
 		else
@@ -293,6 +304,13 @@ public abstract class InfoPanel extends Window implements EventListener<Event>,
 		confirmPanel.addComponentsLeft(confirmPanel.createButton(ConfirmPanel.A_NEW));
         confirmPanel.addActionListener(Events.ON_CLICK, this);
         ZKUpdateUtil.setHflex(confirmPanel, "1");
+        if (ClientInfo.isMobile())
+        {
+        	if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH) || ClientInfo.maxHeight(ClientInfo.SMALL_HEIGHT))
+        	{
+        		confirmPanel.addButtonSclass("btn-small small-img-btn");
+        	}
+        }
 
         // Elaine 2008/12/16
 		confirmPanel.getButton(ConfirmPanel.A_CUSTOMIZE).setVisible(hasCustomize());
@@ -1065,7 +1083,7 @@ public abstract class InfoPanel extends Window implements EventListener<Event>,
 			countSql = countSql.trim();
 			countSql = countSql.substring(0, countSql.length() - 5);
 		}
-		String otherClause = infoWindow.getOtherClause(); // Fix otherClause on count 
+		String otherClause = infoWindow != null ? infoWindow.getOtherClause() : null; // Fix otherClause on count 
     	if (otherClause != null)
     		countSql = countSql+" "+otherClause;
 

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/InvoiceHistory.java

@@ -35,6 +35,7 @@ import org.adempiere.webui.component.Tabs;
 import org.adempiere.webui.component.WListbox;
 import org.adempiere.webui.component.Window;
 import org.adempiere.webui.info.InfoProductWindow;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.compiere.model.MDocType;
 import org.compiere.model.MPriceList;
@@ -95,7 +96,7 @@ public class InvoiceHistory extends Window implements EventListener<Event>
 			log.log(Level.SEVERE, "", ex);
 		}
 		
-		this.setSclass("popup-dialog");
+		this.setSclass("popup-dialog invoice-history-dialog");
 		AEnv.showCenterWindow(parent, this);
 		if (parent instanceof InfoProductWindow)
 			showDetailATP = ((InfoProductWindow)parent).isShowDetailATP();
@@ -183,11 +184,25 @@ public class InvoiceHistory extends Window implements EventListener<Event>
 		confirmPanel.addActionListener(this);
         
 		Borderlayout borderlayout = new Borderlayout();	
-		ZKUpdateUtil.setWidth(this, "700px");
+		if (!ThemeManager.isUseCSSForWindowSize())
-		ZKUpdateUtil.setHeight(this, "400px");
+		{
+			ZKUpdateUtil.setWindowWidthX(this, 700);
+			ZKUpdateUtil.setWindowHeightX(this, 400);
+		}
+		else
+		{
+			addCallback(AFTER_PAGE_ATTACHED, t-> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+				this.invalidate();
+			});
+		}
         borderlayout.setStyle("border: none; position: relative");
 		this.appendChild(borderlayout);
 		this.setClosable(true);
+		this.setSizable(true);
+		this.setMaximizable(true);
+		this.setBorder("normal");
 		
 		North north = new North();
 		north.setStyle("border: none");

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/UserPanel.java

@@ -20,6 +20,7 @@ package org.adempiere.webui.panel;
 import java.util.Properties;
 
 import org.adempiere.util.Callback;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.component.Label;
 import org.adempiere.webui.component.Menupopup;
@@ -32,16 +33,23 @@ import org.compiere.model.MClient;
 import org.compiere.model.MOrg;
 import org.compiere.model.MRole;
 import org.compiere.model.MUser;
+import org.compiere.model.MWarehouse;
 import org.compiere.util.Env;
 import org.compiere.util.Msg;
+import org.compiere.util.Util;
 import org.zkoss.zk.ui.Component;
+import org.zkoss.zk.ui.HtmlBasedComponent;
 import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
 import org.zkoss.zk.ui.event.Events;
 import org.zkoss.zk.ui.event.KeyEvent;
+import org.zkoss.zk.ui.event.OpenEvent;
 import org.zkoss.zk.ui.util.Clients;
 import org.zkoss.zk.ui.util.Composer;
 import org.zkoss.zul.Menuitem;
+import org.zkoss.zul.Popup;
+import org.zkoss.zul.Space;
+import org.zkoss.zul.Vlayout;
 import org.zkoss.zul.impl.LabelImageElement;
 
 /**
@@ -67,6 +75,10 @@ public class UserPanel implements EventListener<Event>, Composer<Component>
 
 	protected Component component;
 	
+	protected Component userPanelLinksContainer;
+
+	private Popup popup;
+
 	private static final String ON_DEFER_CHANGE_ROLE = "onDeferChangeRole";
 	private static final String ON_DEFER_LOGOUT = "onDeferLogout";
 
@@ -81,7 +93,15 @@ public class UserPanel implements EventListener<Event>, Composer<Component>
     	String s = Msg.getMsg(Env.getCtx(), "CloseTabFromBrowser?").replace("\n", "<br>");
     	Clients.confirmClose(s);
     	lblUserNameValue = (Label) component.getFellowIfAny("loginUserAndRole", true);
-    	lblUserNameValue.setValue(getUserName() + "@" + getClientName() + "." + getOrgName()+"/"+this.getRoleName());
+    	if (isMobile())
+    	{
+    		lblUserNameValue.setValue(getUserName());
+    		LayoutUtils.addSclass("mobile", (HtmlBasedComponent) component);
+    	}
+    	else
+    	{
+	    	lblUserNameValue.setValue(getUserName() + "@" + getClientName() + "." + getOrgName()+"/"+this.getRoleName());	    	
+    	}
     	lblUserNameValue.addEventListener(Events.ON_CLICK, this);
 
     	feedback = (LabelImageElement) component.getFellowIfAny("feedback", true);
@@ -115,9 +135,19 @@ public class UserPanel implements EventListener<Event>, Composer<Component>
 
     	component.addEventListener(ON_DEFER_LOGOUT, this);
     	component.addEventListener(ON_DEFER_CHANGE_ROLE, this);
+    	
+    	userPanelLinksContainer = component.getFellowIfAny("userPanelLinksContainer", true);
+    	if (isMobile() && userPanelLinksContainer != null)
+    	{
+    		userPanelLinksContainer.detach();
+    	}
     }
 
-    private String getUserName()
+    private boolean isMobile() {
+		return ClientInfo.isMobile();
+	}
+
+	private String getUserName()
     {
         MUser user = MUser.get(ctx);
         return user.getName();
@@ -173,9 +203,16 @@ public class UserPanel implements EventListener<Event>, Composer<Component>
         }
 		else if (lblUserNameValue == event.getTarget())
 		{
-			String roleInfo = MRole.getDefault().toStringX(Env.getCtx());
+			if (isMobile())
-			roleInfo = roleInfo.replace(Env.NL, "<br>");
+			{
-			Messagebox.showDialog(roleInfo, Msg.getMsg(ctx, "RoleInfo"), Messagebox.OK, Messagebox.INFORMATION);
+				openMobileUserPanelPopup();
+			}
+			else
+			{
+				String roleInfo = MRole.getDefault().toStringX(Env.getCtx());
+				roleInfo = roleInfo.replace(Env.NL, "<br>");
+				Messagebox.showDialog(roleInfo, Msg.getMsg(ctx, "RoleInfo"), Messagebox.OK, Messagebox.INFORMATION);
+			}
 		}
 		else if (changeRole == event.getTarget())
 		{
@@ -255,6 +292,65 @@ public class UserPanel implements EventListener<Event>, Composer<Component>
 
 	}
 
+	protected void openMobileUserPanelPopup() {
+		if (popup != null) {
+			Object value = popup.removeAttribute(popup.getUuid());
+			if (value != null && value instanceof Long) {
+				long ts = ((Long)value).longValue();
+				long since = System.currentTimeMillis() - ts;
+				if (since < 500) {
+					popup.detach();
+					popup = null;
+					return;
+				}
+			}
+			popup.detach();
+		}
+		popup = new Popup();
+		Vlayout layout = new Vlayout();
+		layout.setStyle("padding: 8px 16px");		
+		String email = getUserEmail();
+		if (!Util.isEmpty(email))
+		{
+			layout.appendChild(new Label(getUserName() + " <" + email  +">"));
+		}
+		else
+		{
+			layout.appendChild(new Label(getUserName()));
+		}
+		layout.appendChild(new Label(getRoleName()));
+		layout.appendChild(new Label(getClientName() + "." + getOrgName()));
+		String warehouse = getWarehouseName();
+		if (!Util.isEmpty(warehouse))
+			layout.appendChild(new Label(warehouse));
+		layout.appendChild(new Space());
+		layout.appendChild(userPanelLinksContainer);
+		
+		popup.appendChild(layout);
+		popup.setPage(component.getPage());
+		popup.setVflex("min");
+		popup.setHflex("min");
+		popup.addEventListener(Events.ON_OPEN, (OpenEvent oe) -> {
+			if (!oe.isOpen())
+				popup.setAttribute(popup.getUuid(), System.currentTimeMillis());
+		});
+		popup.open(lblUserNameValue, "after_start");		
+		
+	}
+
+	private String getUserEmail() {
+		 MUser user = MUser.get(ctx);
+		return user.getEMail();
+	}
+
+	private String getWarehouseName() {
+		int id = Env.getContextAsInt(Env.getCtx(), Env.M_WAREHOUSE_ID);
+		if (id > 0) {
+			return MWarehouse.get(Env.getCtx(), id).getName();
+		}
+		return null;
+	}
+
 	@Override
 	public void doAfterCompose(Component comp) throws Exception {
 		this.component = comp;

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/WAttachment.java

@@ -26,6 +26,7 @@ import java.util.logging.Level;
 
 import org.adempiere.util.Callback;
 import org.adempiere.webui.AdempiereWebUI;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.ConfirmPanel;
@@ -114,6 +115,8 @@ public class WAttachment extends Window implements EventListener<Event>
 
 	private int displayIndex;
 
+	private String orientation;
+
 	private static List<String> autoPreviewList;
 
 	static {
@@ -220,13 +223,23 @@ public class WAttachment extends Window implements EventListener<Event>
 	{
 		this.setAttribute(AdempiereWebUI.WIDGET_INSTANCE_NAME, "attachment");
 		this.setMaximizable(true);
-		ZKUpdateUtil.setWidth(this, "700px");
+		if (!ThemeManager.isUseCSSForWindowSize())
-		ZKUpdateUtil.setHeight(this, "85%");
+		{
+			ZKUpdateUtil.setWindowWidthX(this, 700);
+			ZKUpdateUtil.setHeight(this, "85%");
+		}
+		else
+		{
+			addCallback(AFTER_PAGE_ATTACHED, t -> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+			});
+		}
 		this.setTitle(Msg.getMsg(Env.getCtx(), "Attachment"));
 		this.setClosable(true);
 		this.setSizable(true);
 		this.setBorder("normal");
-		this.setSclass("popup-dialog");
+		this.setSclass("popup-dialog attachment-dialog");
 		this.setShadow(true);
 		this.appendChild(mainPanel);
 		ZKUpdateUtil.setHeight(mainPanel, "100%");
@@ -315,6 +328,27 @@ public class WAttachment extends Window implements EventListener<Event>
 		
 
 		text.setTooltiptext(Msg.getElement(Env.getCtx(), "TextMsg"));
+		
+		if (ClientInfo.isMobile())
+		{
+			orientation = ClientInfo.get().orientation;
+			ClientInfo.onClientInfo(this, this::onClientInfo);
+		}
+	}
+	
+	protected void onClientInfo()
+	{		
+		if (getPage() != null)
+		{
+			String newOrienation = ClientInfo.get().orientation;
+			if (!newOrienation.equals(orientation))
+			{
+				orientation = newOrienation;
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+				invalidate();
+			}
+		}
 	}
 
 	/**

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/WDocActionPanel.java

@@ -33,6 +33,7 @@ import org.adempiere.webui.component.Row;
 import org.adempiere.webui.component.Rows;
 import org.adempiere.webui.component.Window;
 import org.adempiere.webui.event.DialogEvents;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.adempiere.webui.window.FDialog;
 import org.compiere.model.GridTab;
@@ -270,7 +271,7 @@ public class WDocActionPanel extends Window implements EventListener<Event>, Dia
 
 	private void init()
 	{
-		setSclass("popup-dialog");
+		setSclass("popup-dialog doc-action-dialog");
 		Vlayout vlayout = new Vlayout();
 		ZKUpdateUtil.setHflex(vlayout, "1");
 		this.appendChild(vlayout);
@@ -308,7 +309,8 @@ public class WDocActionPanel extends Window implements EventListener<Event>, Dia
 	    ZKUpdateUtil.setVflex(confirmPanel, "min");
 	    
 	    this.setTitle(Msg.translate(Env.getCtx(), "DocAction"));
-	    ZKUpdateUtil.setWidth(this, "410px");
+	    if (!ThemeManager.isUseCSSForWindowSize())
+	    	ZKUpdateUtil.setWindowWidthX(this, 410);
 	    this.setBorder("normal");
 	    this.setZindex(1000);
 	}

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/WProcessParameterForm.java

@@ -26,6 +26,7 @@ import org.adempiere.webui.component.ConfirmPanel;
 import org.adempiere.webui.component.Panel;
 import org.adempiere.webui.component.VerticalBox;
 import org.adempiere.webui.factory.ButtonFactory;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.compiere.model.MPInstancePara;
 import org.compiere.model.MScheduler;
@@ -121,7 +122,11 @@ public class WProcessParameterForm extends ADForm
 		}
 		this.setSizable(true);
 		this.setClosable(true);
-		ZKUpdateUtil.setWidth(this, "500px");
+		if (!ThemeManager.isUseCSSForWindowSize()) {
+			ZKUpdateUtil.setWindowWidthX(this, 500);
+		} else {
+			ZKUpdateUtil.setWidth(this, null);			
+		}
 		ZKUpdateUtil.setVflex(this, "min");
 	}
 
@@ -158,7 +163,7 @@ public class WProcessParameterForm extends ADForm
 		hbox.setPack("end");
 		dialogBody.appendChild(hbox);
 		this.appendChild(dialogBody);		
-		this.setSclass("popup-dialog");
+		this.setSclass("popup-dialog process-parameter-form-dialog");
 	}
 	
 	/**
@@ -234,4 +239,10 @@ public class WProcessParameterForm extends ADForm
 
 		return true;
 	}	//	init
+
+	@Override
+	public void setWidth(String width) {
+		super.setWidth(width);
+	}
+	
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/WSchedule.java

@@ -202,6 +202,8 @@ public class WSchedule extends Window implements EventListener<Event>
 		this.appendChild(button);
 		
 		divTabClicked(7);
+		
+		addEventListener("onAfterReCreate", this);
 	}	//	jbInit
 
 	/**
@@ -214,7 +216,7 @@ public class WSchedule extends Window implements EventListener<Event>
 		this.S_Resource_ID = S_Resource_ID;
 		calendars.setCurrentDate(date);
 		
-		updateModel();
+		Events.echoEvent("onAfterReCreate", this, null);
 	}	//	recreate
 
 	private void updateModel() {
@@ -296,6 +298,8 @@ public class WSchedule extends Window implements EventListener<Event>
 			String text = String.valueOf(event.getData());
 			int days = Msg.getMsg(Env.getCtx(),"Day").equals(text) ? 1: Msg.getMsg(Env.getCtx(),"5Days").equals(text) ? 5: Msg.getMsg(Env.getCtx(),"Week" ).equals(text) ? 7: 0;
 			divTabClicked(days);
+		} else if (type.equals("onAfterReCreate")) {
+			updateModel();
 		} else {
 			Events.sendEvent(this, event);
 		}

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/action/CSVImportAction.java

@@ -143,7 +143,7 @@ public class CSVImportAction implements EventListener<Event>
 		{
 			winImportFile = new Window();
 			winImportFile.setTitle(Msg.getMsg(Env.getCtx(), "FileImport") + ": " + panel.getActiveGridTab().getName());
-			ZKUpdateUtil.setWidth(winImportFile, "450px");
+			ZKUpdateUtil.setWindowWidthX(winImportFile, 450);
 			winImportFile.setClosable(true);
 			winImportFile.setBorder("normal");
 			winImportFile.setStyle("position:absolute");

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/action/ExportAction.java

@@ -107,7 +107,7 @@ public class ExportAction implements EventListener<Event>
 		{
 			winExportFile = new Window();
 			winExportFile.setTitle(Msg.getMsg(Env.getCtx(), "Export") + ": " + panel.getActiveGridTab().getName());
-			ZKUpdateUtil.setWidth(winExportFile, "450px");
+			ZKUpdateUtil.setWindowWidthX(winExportFile, 450);
 			winExportFile.setClosable(true);
 			winExportFile.setBorder("normal");
 			winExportFile.setStyle("position:absolute");

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/action/FileImportAction.java

@@ -144,7 +144,7 @@ public class FileImportAction implements EventListener<Event>
 		{
 			winImportFile = new Window();
 			winImportFile.setTitle(Msg.getMsg(Env.getCtx(), "FileImport") + ": " + panel.getActiveGridTab().getName());
-			ZKUpdateUtil.setWidth(winImportFile, "450px");
+			ZKUpdateUtil.setWindowWidthX(winImportFile, 450);
 			winImportFile.setClosable(true);
 			winImportFile.setBorder("normal");
 			winImportFile.setStyle("position:absolute");

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/panel/action/ReportAction.java

@@ -96,7 +96,7 @@ public class ReportAction implements EventListener<Event>
 		if(winReport == null)
 		{
 			winReport = new Window();
-			ZKUpdateUtil.setWidth(winReport, "450px");
+			ZKUpdateUtil.setWindowWidthX(winReport, 450);
 			winReport.setClosable(true);
 			winReport.setBorder("normal");
 			winReport.setStyle("position:absolute");

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/part/WindowContainer.java

@@ -15,6 +15,7 @@ package org.adempiere.webui.part;
 
 import java.util.List;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.component.Menupopup;
 import org.adempiere.webui.component.Tab;
 import org.adempiere.webui.component.Tab.DecorateInfo;
@@ -22,14 +23,18 @@ import org.adempiere.webui.component.Tabbox;
 import org.adempiere.webui.component.Tabpanel;
 import org.adempiere.webui.component.Tabpanels;
 import org.adempiere.webui.component.Tabs;
+import org.adempiere.webui.component.ToolBar;
+import org.adempiere.webui.component.ToolBarButton;
 import org.adempiere.webui.desktop.TabbedDesktop;
 import org.adempiere.webui.panel.IHelpContext;
 import org.adempiere.webui.session.SessionManager;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.compiere.model.X_AD_CtxHelp;
 import org.compiere.util.Env;
 import org.compiere.util.Msg;
 import org.zkoss.zk.ui.Component;
+import org.zkoss.zk.ui.Page;
 import org.zkoss.zk.ui.event.Event;
 import org.zkoss.zk.ui.event.EventListener;
 import org.zkoss.zk.ui.event.Events;
@@ -44,6 +49,8 @@ import org.zkoss.zul.Menuitem;
  */
 public class WindowContainer extends AbstractUIPart implements EventListener<Event>
 {
+	private static final String ON_AFTER_TAB_CLOSE = "onAfterTabClose";
+
 	private static final String ON_DEFER_SET_SELECTED_TAB = "onDeferSetSelectedTab";
 
 	public static final String ON_WINDOW_CONTAINER_SELECTION_CHANGED_EVENT = "onWindowContainerSelectionChanged";
@@ -52,7 +59,9 @@ public class WindowContainer extends AbstractUIPart implements EventListener<Eve
 	
 	private static final int MAX_TITLE_LENGTH = 30;
     
-    private Tabbox           tabbox;
+    private Tabbox  tabbox;
+    private ToolBar toolbar;
+    private ToolBarButton tabListBtn;
 
     public WindowContainer()
     {
@@ -76,8 +85,9 @@ public class WindowContainer extends AbstractUIPart implements EventListener<Eve
         tabbox = new Tabbox();
         tabbox.addEventListener("onPageAttached", this);
         tabbox.addEventListener("onPageDetached", this);
-        tabbox.setSupportTabDragDrop(true);
+        tabbox.setSupportTabDragDrop(!isMobile());
         tabbox.setActiveBySeq(true);
+        tabbox.setCheckVisibleOnlyForNextActive(!isMobile());
         tabbox.setSclass("desktop-tabbox");
         tabbox.setId("desktop_tabbox");
         tabbox.setMaximalHeight(true);
@@ -89,6 +99,10 @@ public class WindowContainer extends AbstractUIPart implements EventListener<Eve
 					setSelectedTab(tab);
 			}
 		});
+        tabbox.addEventListener(ON_AFTER_TAB_CLOSE, evt -> {
+        	updateMobileTabState(tabbox.getSelectedTab());
+        	updateTabListButton();
+        });
         
         Tabpanels tabpanels = new Tabpanels();
         Tabs tabs = new Tabs();
@@ -105,10 +119,49 @@ public class WindowContainer extends AbstractUIPart implements EventListener<Eve
         else
         	tabbox.setPage(page);
         
+        toolbar = new ToolBar();
+        tabbox.appendChild(toolbar);
+        if (isMobile())
+        {
+        	ToolBarButton homeButton = new ToolBarButton();
+        	homeButton.setImage(ThemeManager.getThemeResource("images/Home16.png"));
+        	homeButton.setSclass("window-container-toolbar-btn");
+        	homeButton.addEventListener(Events.ON_CLICK, evt -> setSelectedTab(tabbox.getTabpanel(0).getLinkedTab()));
+        	toolbar.appendChild(homeButton);
+        	
+        	tabListBtn = new ToolBarButton();
+        	tabListBtn.setImage(ThemeManager.getThemeResource("images/expand-header.png"));
+        	tabListBtn.setSclass("window-container-toolbar-btn");
+        	tabListBtn.addEventListener(Events.ON_CLICK, evt -> showTabList());
+        	tabListBtn.setVisible(false);
+        	toolbar.appendChild(tabListBtn);        	        	 
+        }
+        
         return tabbox;
     }
     
-    /**
+    private void showTabList() {
+		org.zkoss.zul.Tabs tabs = tabbox.getTabs();
+		List<Component> list = tabs.getChildren();
+		Menupopup popup = new Menupopup();
+		for(int i = 1; i < list.size(); i++) {
+			Tab tab = (Tab) list.get(i);
+			Menuitem item = new Menuitem(tab.getLabel());
+			item.setValue(Integer.toString(i));
+			item.setTooltiptext(tab.getTooltiptext());
+			popup.appendChild(item);
+			item.addEventListener(Events.ON_CLICK, evt -> {
+				Menuitem t = (Menuitem) evt.getTarget();
+				String s = t.getValue();
+				Integer ti = Integer.parseInt(s);
+				setSelectedTab(tabbox.getTabpanel(ti.intValue()).getLinkedTab());
+			});
+		}
+		popup.setPage(tabbox.getPage());
+		popup.open(tabListBtn, "after_start");
+	}
+
+	/**
      * @deprecated keep for compatible, replace by {@link #addWindow(Component, String, boolean, DecorateInfo)}
      * @param comp
      * @param title
@@ -189,7 +242,16 @@ public class WindowContainer extends AbstractUIPart implements EventListener<Eve
      */
     public Tab insertBefore(Tab refTab, Component comp, String title, boolean closeable, boolean enable, DecorateInfo decorateInfo)
     {
-        final Tab tab = new Tab();
+        @SuppressWarnings("serial")
+		final Tab tab = new Tab() {
+			@Override
+			public void onPageDetached(Page page) {
+				super.onPageDetached(page);
+				if (tabbox != null && tabbox.getPage() != null) {
+					Events.postEvent(ON_AFTER_TAB_CLOSE, tabbox, null);
+				}
+			}        	
+        };
         tab.setDecorateInfo(decorateInfo);
         if (title != null) 
         {
@@ -229,6 +291,10 @@ public class WindowContainer extends AbstractUIPart implements EventListener<Eve
 					SessionManager.getAppDesktop().updateHelpContext(X_AD_CtxHelp.CTXTYPE_Home, 0);
 			}
 		});
+        //disable text selection of tab label on mobile to
+        //fix conflict with long press context menu
+        if (ClientInfo.isMobile())
+        	tab.setClientAttribute("onselectstart", "return false");
         
         Tabpanel tabpanel = null;
         if (comp instanceof Tabpanel) {
@@ -282,6 +348,7 @@ public class WindowContainer extends AbstractUIPart implements EventListener<Eve
         				// Update the current tab index.
         				if ( tabsSizeBeforeClose != tabbox.getTabs().getChildren().size() )
         					tabbox.setSelectedIndex( currentTabIndex );
+        				Events.postEvent(ON_AFTER_TAB_CLOSE, tabbox, null);
         			}
         		}
         	});
@@ -300,6 +367,7 @@ public class WindowContainer extends AbstractUIPart implements EventListener<Eve
         				}
         			}
         			tabbox.setSelectedIndex(focusTabIndex);
+        			Events.postEvent(ON_AFTER_TAB_CLOSE, tabbox, null);
         		}
         	});
         }
@@ -314,6 +382,7 @@ public class WindowContainer extends AbstractUIPart implements EventListener<Eve
 					((Tab)tabs.get( i )).onClose();
 				}
 				tabbox.setSelectedIndex( focusTabIndex );
+				Events.postEvent(ON_AFTER_TAB_CLOSE, tabbox, null);
 			}
 		});
 		popupClose.appendChild(mi);
@@ -321,9 +390,23 @@ public class WindowContainer extends AbstractUIPart implements EventListener<Eve
 		popupClose.setPage(tab.getPage());
 		tab.setContext(popupClose);
         
+		updateTabListButton();
         return tab;
     }
 
+	private void updateTabListButton() {
+		if (isMobile()) {
+			int cnt = tabbox.getTabs().getChildren().size()-1;
+			if (cnt > 0) {
+				tabListBtn.setLabel(Integer.toString(cnt));
+				tabListBtn.setVisible(true);
+			} else {
+				tabListBtn.setLabel("");
+				tabListBtn.setVisible(false);
+			}
+		}
+	}
+
 	public void setTabTitle(String title, int windowNo) {
 		setTabTitle(title, getTab(windowNo));
 	}
@@ -392,9 +475,29 @@ public class WindowContainer extends AbstractUIPart implements EventListener<Eve
     public void setSelectedTab(org.zkoss.zul.Tab tab)
     {
     	tabbox.setSelectedTab(tab);
+    	updateMobileTabState(tab);
     }
 
-    /**
+	private void updateMobileTabState(org.zkoss.zul.Tab tab) {
+		if (isMobile())
+    	{
+    		List<Component> tabs = tabbox.getTabs().getChildren();
+    		for(Component c: tabs) {
+    			if (c instanceof Tab) {
+    				Tab t = (Tab) c;
+    				t.setVisible(t == tab);
+    				t.getLinkedPanel().setVisible(t == tab);    				
+    			}
+    		}
+    		tabbox.getTabs().invalidate();
+    	}
+	}
+
+    private boolean isMobile() {
+		return ClientInfo.isMobile();
+	}
+
+	/**
      * 
      * @return true if successfully close the active window
      */
@@ -441,6 +544,13 @@ public class WindowContainer extends AbstractUIPart implements EventListener<Eve
 		return tabbox;
 	}
 	
+	/**
+	 * @return toolbar
+	 */
+	public ToolBar getToobar() {
+		return toolbar;
+	}
+
 	@Override
 	public void onEvent(Event event) throws Exception {
 		

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/theme/ITheme.java

@@ -50,4 +50,6 @@ public interface ITheme {
 	
 	//theme preference
 	public static final String THEME_PREFERENCE = "/preference.zul";
+	
+	public static final String USE_CSS_FOR_WINDOW_SIZE = "#THEME_USE_CSS_FOR_WINDOW_SIZE";
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/theme/ThemeManager.java

@@ -146,4 +146,8 @@ public final class ThemeManager {
 			return null;
 		}
 	}
+	
+	public static boolean isUseCSSForWindowSize() {
+		return "Y".equals(Env.getContext(Env.getCtx(), ITheme.USE_CSS_FOR_WINDOW_SIZE));
+	}	
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/util/ZKUpdateUtil.java

@@ -13,7 +13,10 @@
  *****************************************************************************/
 package org.adempiere.webui.util;
 
+import org.adempiere.webui.ClientInfo;
+import org.zkoss.zk.au.out.AuScript;
 import org.zkoss.zk.ui.HtmlBasedComponent;
+import org.zkoss.zk.ui.util.Clients;
 import org.zkoss.zul.Grid;
 import org.zkoss.zul.Listbox;
 import org.zkoss.zul.Tree;
@@ -65,4 +68,45 @@ public class ZKUpdateUtil {
 		comp.setVflex(value);
 	}
 	
+	public static void setCSSHeight(HtmlBasedComponent component) {
+		String script = "setTimeout(function() { var e = jq('#" + component.getUuid() + "');";
+		script = script + "var b=zk.Widget.$('#" + component.getUuid() + "'); ";
+		script = script + "b.setHeight(e.css('height')); }, 50 );";
+		Clients.response(new AuScript(script));
+	}
+	
+	public static void setCSSWidth(HtmlBasedComponent component) {
+		String script = "setTimeout(function() { var e = jq('#" + component.getUuid() + "');";
+		script = script + "var b=zk.Widget.$('#" + component.getUuid() + "'); ";
+		script = script + "b.setWidth(e.css('width')); }, 50 );";
+		Clients.response(new AuScript(script));
+	}
+	
+	/**
+	 * Set height of popup, window or dialog to heightInPixel. Set height to 100% if heightInPixel > desktopHeight
+	 * @param comp
+	 * @param heightInPixel Height in Pixel
+	 */
+	public static void setWindowHeightX(HtmlBasedComponent comp, int heightInPixel){
+		int desktopHeight = ClientInfo.get().desktopHeight;
+		if (desktopHeight > 0 && desktopHeight < heightInPixel) {
+			setHeight(comp, "100%");
+		} else {
+			setHeight(comp, heightInPixel+"px");
+		}
+	}
+	
+	/**
+	 * Set width of popup, window or dialog to widthInPixel. Set width to 100% if widthInPixel > desktopWidth
+	 * @param comp
+	 * @param widthInPixel
+	 */
+	public static void setWindowWidthX(HtmlBasedComponent comp, int widthInPixel){
+		int desktopWidth = ClientInfo.get().desktopWidth;
+		if (desktopWidth > 0 && desktopWidth < widthInPixel) {
+			setWidth(comp, "100%");
+		} else {
+			setWidth(comp, widthInPixel+"px");
+		}
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/AboutWindow.java

@@ -108,7 +108,7 @@ public class AboutWindow extends Window implements EventListener<Event> {
 		
 		this.setPosition("center");
 		this.setTitle(ThemeManager.getBrowserTitle());
-		this.setSclass("popup-dialog");
+		this.setSclass("popup-dialog about-window");
 		this.setClosable(true);
 		this.setMaximizable(true);
 		this.setSizable(true);
@@ -146,8 +146,18 @@ public class AboutWindow extends Window implements EventListener<Event> {
 		southPane.appendChild(btnOk);
 
 		this.setBorder("normal");
-		ZKUpdateUtil.setWidth(this, "600px");
+		if (!ThemeManager.isUseCSSForWindowSize())
-		ZKUpdateUtil.setHeight(this, "450px");
+		{
+			ZKUpdateUtil.setWindowWidthX(this, 600);
+			ZKUpdateUtil.setWindowHeightX(this, 450);
+		}
+		else
+		{
+			addCallback(AFTER_PAGE_ATTACHED, t-> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+			});
+		}
 		this.setShadow(true);
 		this.setAttribute(Window.MODE_KEY, Window.MODE_HIGHLIGHTED);
 	}
@@ -555,8 +565,8 @@ public class AboutWindow extends Window implements EventListener<Event> {
 		w.setClosable(true);
 		w.setMaximizable(true);
 		w.setSizable(true);
-		ZKUpdateUtil.setWidth(w, "600px");
+		ZKUpdateUtil.setWindowWidthX(w, 600);
-		ZKUpdateUtil.setHeight(w, "500px");
+		ZKUpdateUtil.setWindowHeightX(w, 500);
 		Textarea textbox = new Textarea();
 		textbox.setDynamicProperty("readonly", "true");
 		textbox.setStyle("width:99%; height: 99%; margin: auto; display: inline-block;");

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/CustomizeGridViewDialog.java

@@ -7,6 +7,7 @@ import org.adempiere.webui.adwindow.GridView;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.component.Window;
 import org.adempiere.webui.panel.CustomizeGridViewPanel;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.compiere.util.Env;
 import org.compiere.util.Msg;
@@ -36,11 +37,18 @@ public class CustomizeGridViewDialog extends Window {
 	
 	private void initComponent(int windowNo, int AD_Tab_ID, int AD_User_ID, Map<Integer, String> columnsWidth,ArrayList<Integer> gridFieldIds) {
 		customizePanel = new CustomizeGridViewPanel(windowNo, AD_Tab_ID, AD_User_ID, columnsWidth,gridFieldIds);
-		this.setStyle("position : absolute;");
+		this.setStyle("position : relative;");
-		ZKUpdateUtil.setWidth(this, "600px");
+		if (!ThemeManager.isUseCSSForWindowSize()) {
-		ZKUpdateUtil.setHeight(this, "500px");
+			ZKUpdateUtil.setWindowWidthX(this, 600);
+			ZKUpdateUtil.setWindowHeightX(this, 500);
+		} else {
+			addCallback(AFTER_PAGE_ATTACHED, t-> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+			});
+		}
 		this.setBorder("normal");
-		this.setSclass("popup-dialog");
+		this.setSclass("popup-dialog customize-grid-view-dialog");
 		appendChild(customizePanel);
 		customizePanel.createUI();
 		customizePanel.query();
@@ -72,5 +80,4 @@ public class CustomizeGridViewDialog extends Window {
 		AEnv.showWindow(customizeWindow);
 		return customizeWindow.isSaved();
 	}   //  showProduct    
-    
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/FindWindow.java

@@ -38,6 +38,7 @@ import java.util.logging.Level;
 import java.util.regex.Pattern;
 
 import org.adempiere.webui.AdempiereWebUI;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Column;
@@ -463,11 +464,12 @@ public class FindWindow extends Window implements EventListener<Event>, ValueCha
 
         ListHeader lstHAndOr = new ListHeader();
         lstHAndOr.setLabel(Msg.getMsg(Env.getCtx(), "And/Or"));
-        ZKUpdateUtil.setWidth(lstHAndOr, "10%");
+        ZKUpdateUtil.setWidth(lstHAndOr, "60px");
 
         ListHeader lstHLeftBracket = new ListHeader();
         lstHLeftBracket.setLabel("(");
-        ZKUpdateUtil.setWidth(lstHLeftBracket, "6%");
+        lstHLeftBracket.setAlign("center");
+        ZKUpdateUtil.setWidth(lstHLeftBracket, "50px");
 
         ListHeader lstHColumn = new ListHeader();
         lstHColumn.setLabel(Msg.translate(Env.getCtx(), "AD_Column_ID"));
@@ -475,6 +477,7 @@ public class FindWindow extends Window implements EventListener<Event>, ValueCha
 
         ListHeader lstHOperator = new ListHeader();
         lstHOperator.setLabel(Msg.getMsg(Env.getCtx(), "Operator"));
+        ZKUpdateUtil.setWidth(lstHOperator, "70px");
 
         ListHeader lstHQueryValue = new ListHeader();
         lstHQueryValue.setLabel(Msg.getMsg(Env.getCtx(), "QueryValue"));
@@ -486,7 +489,14 @@ public class FindWindow extends Window implements EventListener<Event>, ValueCha
 
         ListHeader lstHRightBracket = new ListHeader();
         lstHRightBracket.setLabel(")");
-        ZKUpdateUtil.setWidth(lstHRightBracket, "6%");
+        lstHRightBracket.setAlign("center");
+        ZKUpdateUtil.setWidth(lstHRightBracket, "50px");
+        
+        if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1)) {        	
+        	ZKUpdateUtil.setWidth(lstHColumn, "200px");
+        	ZKUpdateUtil.setWidth(lstHQueryValue, "200px");
+        	ZKUpdateUtil.setWidth(lstHQueryTo, "200px");
+        }
 
         listhead.appendChild(lstHAndOr);
         listhead.appendChild(lstHLeftBracket);
@@ -566,7 +576,10 @@ public class FindWindow extends Window implements EventListener<Event>, ValueCha
 		fQueryName.addEventListener(Events.ON_SELECT, this);
 		
 		Label label = new Label(Msg.getMsg(Env.getCtx(), "SavedQuery"));
-		label.setStyle("vertical-align: middle;");
+		if (ClientInfo.maxWidth(639))
+			label.setStyle("vertical-align: middle;display: block; padding-left: 4px; padding-top: 4px;");
+		else
+			label.setStyle("vertical-align: middle;");
 		div.appendChild(label);
 		div.appendChild(fQueryName);
         div.appendChild(btnSave);
@@ -580,7 +593,10 @@ public class FindWindow extends Window implements EventListener<Event>, ValueCha
         // adding history combo
         prepareHistoryCombo();
         Label labelHistory = new Label(Msg.getMsg(Env.getCtx(), HISTORY_LABEL));
-        labelHistory.setStyle("vertical-align: middle;");
+        if (ClientInfo.maxWidth(639))
+        	labelHistory.setStyle("vertical-align: middle; display: block;padding-left: 4px; padding-top: 4px;");
+        else
+        	labelHistory.setStyle("vertical-align: middle;");
         div.appendChild(labelHistory);
         div.appendChild(historyCombo);
         historyCombo.setStyle("margin-left: 3px; margin-right: 3px; position: relative; vertical-align: middle;");

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/InfoSchedule.java

@@ -112,8 +112,8 @@ public class InfoSchedule extends Window implements EventListener<Event>
 		if (createNew)
 		{
 			setAttribute(Window.MODE_KEY, Window.MODE_HIGHLIGHTED);
-			ZKUpdateUtil.setWidth(this, "700px");
+			ZKUpdateUtil.setWindowWidthX(this, 700);
-			ZKUpdateUtil.setHeight(this, "600px");
+			ZKUpdateUtil.setWindowHeightX(this, 600);
 			this.setSizable(true);
 		}
 		else

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/SimplePDFViewer.java

@@ -14,13 +14,17 @@ package org.adempiere.webui.window;
 
 import java.io.InputStream;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.component.Window;
-import org.adempiere.webui.session.SessionManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.compiere.util.Env;
 import org.compiere.util.Msg;
 import org.zkoss.util.media.AMedia;
+import org.zkoss.util.media.Media;
+import org.zkoss.zk.ui.ext.render.DynamicMedia;
 import org.zkoss.zul.Iframe;
+import org.zkoss.zul.impl.Utils;
+import org.zkoss.zul.impl.XulElement;
 
 /**
  * 
@@ -33,28 +37,70 @@ public class SimplePDFViewer extends Window {
 	 * 
 	 */
 	private static final long serialVersionUID = -6417954023873414350L;
+	private AMedia media;
+	private int mediaVersion = 0;
 
 	public SimplePDFViewer(String title, InputStream pdfInput) {
 		Iframe iframe = new Iframe();
 		iframe.setId("reportFrame");
-		int height = Double.valueOf(SessionManager.getAppDesktop().getClientInfo().desktopHeight * 0.85).intValue();
+		int height = 0;
+		if (ClientInfo.maxHeight((ClientInfo.SMALL_HEIGHT + ClientInfo.EXTRA_SMALL_HEIGHT)/2)) {
+			height = ClientInfo.get().desktopHeight;
+		} else {
+			height = Double.valueOf(ClientInfo.get().desktopHeight * 0.85).intValue();			
+		}
 		ZKUpdateUtil.setHeight(this, height + "px");
-		
 		height = height - 30;
 		ZKUpdateUtil.setHeight(iframe, height + "px");
 		ZKUpdateUtil.setWidth(iframe, "100%");
-		AMedia media = new AMedia(getTitle(), "pdf", "application/pdf", pdfInput);
+		media = new AMedia(getTitle(), "pdf", "application/pdf", pdfInput);
-		iframe.setContent(media);
+		if (ClientInfo.isMobile()) {
+			if (getPage() != null) {
+				showMobileViewer(iframe);
+			} else {
+				addCallback(AFTER_PAGE_ATTACHED, t -> showMobileViewer(iframe));
+			}
+		} else {
+			iframe.setContent(media);
+		}
 		
 		this.setBorder("normal");
 		this.appendChild(iframe);
 		this.setClosable(true);
+		this.setMaximizable(true);
 		if (title != null && title.trim().length() > 0)
 			this.setTitle(title);
 		else
 			this.setTitle(Msg.translate(Env.getCtx(), "PDF"));
 		
-		int width = Double.valueOf(SessionManager.getAppDesktop().getClientInfo().desktopWidth * 0.80).intValue();
+		int width = 0;
+		if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1)) {
+			width = ClientInfo.get().desktopWidth;
+		} else {
+			width = Double.valueOf(ClientInfo.get().desktopWidth * 0.80).intValue();
+		}
 		ZKUpdateUtil.setWidth(this, width + "px");
 	}
+
+	protected void showMobileViewer(Iframe iframe) {
+		mediaVersion++;
+		String url = Utils.getDynamicMediaURI(this, mediaVersion, media.getName(), media.getFormat());	
+		String pdfJsUrl = "pdf.js/web/viewer.html?file="+url;
+		iframe.setSrc(pdfJsUrl);
+	}
+	
+	//-- ComponentCtrl --//
+	public Object getExtraCtrl() {
+		return new ExtraCtrl();
+	}
+	/** A utility class to implement {@link #getExtraCtrl}.
+	 * It is used only by component developers.
+	 */
+	protected class ExtraCtrl extends XulElement.ExtraCtrl
+	implements DynamicMedia {
+		//-- DynamicMedia --//
+		public Media getMedia(String pathInfo) {
+			return media;
+		}
+	}
 }

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/WAccountDialog.java

@@ -24,6 +24,7 @@ import java.sql.SQLException;
 import java.util.logging.Level;
 
 import org.adempiere.util.Callback;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.adwindow.ADTabpanel;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.component.ConfirmPanel;
@@ -72,6 +73,7 @@ import org.zkoss.zul.Hbox;
 import org.zkoss.zul.North;
 import org.zkoss.zul.South;
 import org.zkoss.zul.Vbox;
+import org.zkoss.zul.Vlayout;
 
 /**
  *	Dialog to enter Account Info
@@ -99,8 +101,19 @@ public final class WAccountDialog extends Window
 	{
 		super ();
 		this.setTitle(title);
-		ZKUpdateUtil.setHeight(this, "500px");
+		if (!ThemeManager.isUseCSSForWindowSize())
-		ZKUpdateUtil.setWidth(this, "750px");
+		{
+			ZKUpdateUtil.setWindowHeightX(this, 500);
+			ZKUpdateUtil.setWindowWidthX(this, 750);
+		}
+		else
+		{
+			addCallback(AFTER_PAGE_ATTACHED, t-> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+				this.invalidate();
+			});
+		}
 
 		if (log.isLoggable(Level.CONFIG)) log.config("C_AcctSchema_ID=" + C_AcctSchema_ID
 			+ ", C_ValidCombination_ID=" + mAccount.C_ValidCombination_ID);
@@ -179,6 +192,8 @@ public final class WAccountDialog extends Window
 	private Row m_row;
 	private Rows m_rows;
 
+	private boolean m_smallWidth;
+
 
 
 	/**
@@ -200,11 +215,11 @@ public final class WAccountDialog extends Window
 		//
 		Caption caption = new Caption(Msg.getMsg(Env.getCtx(),"Parameter"));
 		parameterPanel.appendChild(caption);
-		ZKUpdateUtil.setHflex(parameterPanel, "95");
+		ZKUpdateUtil.setHflex(parameterPanel, "min");
 		parameterPanel.setStyle("background-color: transparent;");
 		toolBar.setOrient("vertical");
-		toolBar.setStyle("border: none; margin: 5px");
+		toolBar.setStyle("border: none; padding: 5px");
-		ZKUpdateUtil.setHflex(toolBar, "5");
+		ZKUpdateUtil.setHflex(toolBar, "min");
 
 		bSave.setImage(ThemeManager.getThemeResource("images/Save24.png"));
 		bSave.setTooltiptext(Msg.getMsg(Env.getCtx(),"AccountNewUpdate"));
@@ -222,7 +237,6 @@ public final class WAccountDialog extends Window
 		//
 
 		northPanel.appendChild(parameterPanel);
-		ZKUpdateUtil.setWidth(parameterPanel, "95%");
 		northPanel.appendChild(toolBar);
 		ZKUpdateUtil.setWidth(northPanel, "100%");
 
@@ -232,21 +246,26 @@ public final class WAccountDialog extends Window
 		layout.setParent(this);
 		ZKUpdateUtil.setHeight(layout, "100%");
 		ZKUpdateUtil.setWidth(layout, "100%");
-		layout.setStyle("background-color: transparent;");
+		layout.setStyle("background-color: transparent; position: relative;");
 
 		North nRegion = new North();
 		nRegion.setParent(layout);
 		ZKUpdateUtil.setHflex(northPanel, "false");
-		ZKUpdateUtil.setVflex(northPanel, "false");
+		ZKUpdateUtil.setVflex(northPanel, "min");
+		ZKUpdateUtil.setVflex(parameterPanel, "min");
 		nRegion.appendChild(northPanel);
 		nRegion.setStyle("background-color: transparent; border: none");
 		northPanel.setStyle("background-color: transparent;");
+		nRegion.setCollapsible(true);
+		nRegion.setSplittable(true);
+		nRegion.setAutoscroll(true);
 
 		Center cRegion = new Center();
 		cRegion.setParent(layout);
 		ZKUpdateUtil.setHflex(m_adTabPanel, "true");
 		ZKUpdateUtil.setVflex(m_adTabPanel, "true");
 		cRegion.appendChild(m_adTabPanel);
+		ZKUpdateUtil.setVflex(cRegion, "min");
 
 		South sRegion = new South();
 		sRegion.setParent(layout);
@@ -256,6 +275,10 @@ public final class WAccountDialog extends Window
 		div.appendChild(statusBar);
 		sRegion.appendChild(div);
 		sRegion.setStyle("background-color: transparent; border: none");
+		ZKUpdateUtil.setVflex(sRegion, "min");
+		ZKUpdateUtil.setVflex(div, "min");
+		ZKUpdateUtil.setVflex(confirmPanel, "min");
+		ZKUpdateUtil.setVflex(statusBar, "min");
 
 		confirmPanel.addActionListener(Events.ON_CLICK, this);
 
@@ -263,6 +286,11 @@ public final class WAccountDialog extends Window
 		this.setClosable(false);
 
 		this.setSizable(true);
+		this.setSclass("account-dialog");
+		
+		if (ClientInfo.isMobile()) {
+			ClientInfo.onClientInfo(this, this::onClientInfo);
+		}
 	}	//	jbInit
 
 	/**
@@ -320,133 +348,7 @@ public final class WAccountDialog extends Window
 		parameterLayout.setParent(parameterPanel);
 		parameterLayout.setStyle("background-color: transparent; margin:none; border:none; padding:none;");
 
-		m_rows = new Rows();
+		layoutParameters();
-		m_rows.setParent(parameterLayout);
-
-		//	Alias
-		if (s_AcctSchema.isHasAlias())
-		{
-			GridField alias = m_mTab.getField("Alias");
-			f_Alias = WebEditorFactory.getEditor(alias, false);
-			addLine(alias, f_Alias, false);
-		}	//	Alias
-
-		//	Combination
-		GridField combination = m_mTab.getField("Combination");
-		f_Combination = WebEditorFactory.getEditor(combination, false);
-		addLine(combination, f_Combination, false);
-		m_newRow = true;
-
-		/**
-		 *	Create Fields in Element Order
-		 */
-		MAcctSchemaElement[] elements = s_AcctSchema.getAcctSchemaElements();
-		for (int i = 0; i < elements.length; i++)
-		{
-			MAcctSchemaElement ase = elements[i];
-			String type = ase.getElementType();
-			boolean isMandatory = ase.isMandatory();
-			//
-			if (type.equals(MAcctSchemaElement.ELEMENTTYPE_Organization))
-			{
-				GridField field = m_mTab.getField("AD_Org_ID");
-				f_AD_Org_ID = WebEditorFactory.getEditor(field, false);
-				addLine(field, f_AD_Org_ID, isMandatory);
-			}
-			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_Account))
-			{
-				GridField field = m_mTab.getField("Account_ID");
-				f_Account_ID = WebEditorFactory.getEditor(field, false);
-			//	((VLookup)f_Account_ID).setWidth(400);
-				addLine(field, f_Account_ID, isMandatory);
-				f_Account_ID.addValueChangeListener(this);
-			}
-			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_SubAccount))
-			{
-				GridField field = m_mTab.getField("C_SubAcct_ID");
-				f_SubAcct_ID = WebEditorFactory.getEditor(field, false);
-			//	((VLookup)f_SubAcct_ID).setWidth(400);
-				addLine(field, f_SubAcct_ID, isMandatory);
-			}
-			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_Product))
-			{
-				GridField field = m_mTab.getField("M_Product_ID");
-				f_M_Product_ID = WebEditorFactory.getEditor(field, false);
-				addLine(field, f_M_Product_ID, isMandatory);
-			}
-			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_BPartner))
-			{
-				GridField field = m_mTab.getField("C_BPartner_ID");
-				f_C_BPartner_ID = WebEditorFactory.getEditor(field, false);
-				addLine(field, f_C_BPartner_ID, isMandatory);
-			}
-			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_Campaign))
-			{
-				GridField field = m_mTab.getField("C_Campaign_ID");
-				f_C_Campaign_ID = WebEditorFactory.getEditor(field, false);
-				addLine(field, f_C_Campaign_ID, isMandatory);
-			}
-			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_LocationFrom))
-			{
-				GridField field = m_mTab.getField("C_LocFrom_ID");
-				f_C_LocFrom_ID = WebEditorFactory.getEditor(field, false);
-				addLine(field, f_C_LocFrom_ID, isMandatory);
-			}
-			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_LocationTo))
-			{
-				GridField field = m_mTab.getField("C_LocTo_ID");
-				f_C_LocTo_ID = WebEditorFactory.getEditor(field, false);
-				addLine(field, f_C_LocTo_ID, isMandatory);
-			}
-			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_Project))
-			{
-				GridField field = m_mTab.getField("C_Project_ID");
-				f_C_Project_ID = WebEditorFactory.getEditor(field, false);
-				addLine(field, f_C_Project_ID, isMandatory);
-			}
-			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_SalesRegion))
-			{
-				GridField field = m_mTab.getField("C_SalesRegion_ID");
-				f_C_SalesRegion_ID = WebEditorFactory.getEditor(field, false);
-				addLine(field, f_C_SalesRegion_ID, isMandatory);
-			}
-			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_OrgTrx))
-			{
-				GridField field = m_mTab.getField("AD_OrgTrx_ID");
-				f_AD_OrgTrx_ID = WebEditorFactory.getEditor(field, false);
-				addLine(field, f_AD_OrgTrx_ID, isMandatory);
-			}
-			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_Activity))
-			{
-				GridField field = m_mTab.getField("C_Activity_ID");
-				f_C_Activity_ID = WebEditorFactory.getEditor(field, false);
-				addLine(field, f_C_Activity_ID, isMandatory);
-			}
-			//	User1
-			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_UserElementList1))
-			{
-				GridField field = m_mTab.getField("User1_ID");
-				f_User1_ID = WebEditorFactory.getEditor(field, false);
-				addLine(field, f_User1_ID, isMandatory);
-			}
-			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_UserElementList2))
-			{
-				GridField field = m_mTab.getField("User2_ID");
-				f_User2_ID = WebEditorFactory.getEditor(field, false);
-				addLine(field, f_User2_ID, isMandatory);
-			}
-		}	//	Create Fields in Element Order
-
-		//	Add description
-		m_newRow = true;
-		Row row = new Row();
-		f_Description.setStyle("font-decoration: italic;");
-		Cell cell = new Cell();
-		cell.setColspan(4);
-		cell.appendChild(f_Description);
-		row.appendChild(cell);
-		row.setStyle("background-color: transparent; padding: 10px");
-		m_rows.appendChild(row);
 
 		//	Finish
 		m_query = new MQuery();
@@ -487,6 +389,154 @@ public final class WAccountDialog extends Window
 		return true;
 	}	//	initAccount
 
+	protected void layoutParameters() {
+		m_smallWidth = ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1);
+		
+		m_rows = new Rows();
+		m_rows.setParent(parameterLayout);
+
+		//	Alias
+		if (s_AcctSchema.isHasAlias())
+		{
+			GridField alias = m_mTab.getField("Alias");
+			if (f_Alias == null)
+				f_Alias = WebEditorFactory.getEditor(alias, false);
+			addLine(alias, f_Alias, false);
+		}	//	Alias
+
+		//	Combination
+		GridField combination = m_mTab.getField("Combination");
+		if (f_Combination == null)
+			f_Combination = WebEditorFactory.getEditor(combination, false);
+		addLine(combination, f_Combination, false);
+		m_newRow = true;
+
+		/**
+		 *	Create Fields in Element Order
+		 */
+		MAcctSchemaElement[] elements = s_AcctSchema.getAcctSchemaElements();
+		for (int i = 0; i < elements.length; i++)
+		{
+			MAcctSchemaElement ase = elements[i];
+			String type = ase.getElementType();
+			boolean isMandatory = ase.isMandatory();
+			//
+			if (type.equals(MAcctSchemaElement.ELEMENTTYPE_Organization))
+			{
+				GridField field = m_mTab.getField("AD_Org_ID");
+				if (f_AD_Org_ID == null)
+					f_AD_Org_ID = WebEditorFactory.getEditor(field, false);
+				addLine(field, f_AD_Org_ID, isMandatory);
+			}
+			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_Account))
+			{
+				GridField field = m_mTab.getField("Account_ID");
+				if (f_Account_ID == null)
+				{
+					f_Account_ID = WebEditorFactory.getEditor(field, false);
+					f_Account_ID.addValueChangeListener(this);
+				}
+				addLine(field, f_Account_ID, isMandatory);				
+			}
+			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_SubAccount))
+			{
+				GridField field = m_mTab.getField("C_SubAcct_ID");
+				if (f_SubAcct_ID == null)
+					f_SubAcct_ID = WebEditorFactory.getEditor(field, false);
+				addLine(field, f_SubAcct_ID, isMandatory);
+			}
+			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_Product))
+			{
+				GridField field = m_mTab.getField("M_Product_ID");
+				if (f_M_Product_ID == null)
+					f_M_Product_ID = WebEditorFactory.getEditor(field, false);
+				addLine(field, f_M_Product_ID, isMandatory);
+			}
+			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_BPartner))
+			{
+				GridField field = m_mTab.getField("C_BPartner_ID");
+				if (f_C_BPartner_ID == null)
+					f_C_BPartner_ID = WebEditorFactory.getEditor(field, false);
+				addLine(field, f_C_BPartner_ID, isMandatory);
+			}
+			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_Campaign))
+			{
+				GridField field = m_mTab.getField("C_Campaign_ID");
+				if (f_C_Campaign_ID == null)
+					f_C_Campaign_ID = WebEditorFactory.getEditor(field, false);
+				addLine(field, f_C_Campaign_ID, isMandatory);
+			}
+			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_LocationFrom))
+			{
+				GridField field = m_mTab.getField("C_LocFrom_ID");
+				if (f_C_LocFrom_ID == null)
+					f_C_LocFrom_ID = WebEditorFactory.getEditor(field, false);
+				addLine(field, f_C_LocFrom_ID, isMandatory);
+			}
+			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_LocationTo))
+			{
+				GridField field = m_mTab.getField("C_LocTo_ID");
+				if (f_C_LocTo_ID == null)
+					f_C_LocTo_ID = WebEditorFactory.getEditor(field, false);
+				addLine(field, f_C_LocTo_ID, isMandatory);
+			}
+			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_Project))
+			{
+				GridField field = m_mTab.getField("C_Project_ID");
+				if (f_C_Project_ID == null)
+					f_C_Project_ID = WebEditorFactory.getEditor(field, false);
+				addLine(field, f_C_Project_ID, isMandatory);
+			}
+			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_SalesRegion))
+			{
+				GridField field = m_mTab.getField("C_SalesRegion_ID");
+				if (f_C_SalesRegion_ID == null)
+					f_C_SalesRegion_ID = WebEditorFactory.getEditor(field, false);
+				addLine(field, f_C_SalesRegion_ID, isMandatory);
+			}
+			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_OrgTrx))
+			{
+				GridField field = m_mTab.getField("AD_OrgTrx_ID");
+				if (f_AD_OrgTrx_ID == null)
+					f_AD_OrgTrx_ID = WebEditorFactory.getEditor(field, false);
+				addLine(field, f_AD_OrgTrx_ID, isMandatory);
+			}
+			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_Activity))
+			{
+				GridField field = m_mTab.getField("C_Activity_ID");
+				if (f_C_Activity_ID == null)
+					f_C_Activity_ID = WebEditorFactory.getEditor(field, false);
+				addLine(field, f_C_Activity_ID, isMandatory);
+			}
+			//	User1
+			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_UserElementList1))
+			{
+				GridField field = m_mTab.getField("User1_ID");
+				if (f_User1_ID == null)
+					f_User1_ID = WebEditorFactory.getEditor(field, false);
+				addLine(field, f_User1_ID, isMandatory);
+			}
+			else if (type.equals(MAcctSchemaElement.ELEMENTTYPE_UserElementList2))
+			{
+				GridField field = m_mTab.getField("User2_ID");
+				if (f_User2_ID == null)
+					f_User2_ID = WebEditorFactory.getEditor(field, false);
+				addLine(field, f_User2_ID, isMandatory);
+			}
+		}	//	Create Fields in Element Order
+
+		//	Add description
+		m_newRow = true;
+		Row row = new Row();
+		f_Description.setStyle("font-decoration: italic;");
+		Cell cell = new Cell();
+		cell.setColspan(4);
+		cell.appendChild(f_Description);
+		row.appendChild(cell);
+		row.setStyle("background-color: transparent; padding: 10px");
+		m_rows.appendChild(row);
+	}
+
 	/**
 	 *	Add Editor to parameterPanel alernative right/left depending on m_newRow.
 	 *  Field Value changes update Editors
@@ -512,14 +562,27 @@ public final class WAccountDialog extends Window
 		}
 //		else
 //			m_gbc.gridx = 2;
-		Div div = new Div();
+		if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1))
-		div.setStyle("text-align: right");
+		{
-		div.appendChild(label);
+			Vlayout vlayout = new Vlayout();
-		m_row.appendChild(div);
+			vlayout.setHflex("1");
+			vlayout.setSpacing("0px");
+			vlayout.appendChild(label);
+			vlayout.appendChild(editor.getComponent());
+			m_row.appendCellChild(vlayout, 2);
+		}
+		else
+		{
+			Div div = new Div();
+			div.setStyle("text-align: right");
+			div.appendChild(label);
+			m_row.appendChild(div);
 	
-		m_row.appendChild(editor.getComponent());
+			m_row.appendChild(editor.getComponent());
+		}
 		editor.fillHorizontal();
 		editor.dynamicDisplay();		
+		
 		//
 		m_newRow = !m_newRow;
 	}	//	addLine
@@ -1228,4 +1291,19 @@ public final class WAccountDialog extends Window
 			}
 		}
 	}
+		
+	protected void onClientInfo() {
+		if (parameterLayout != null && parameterLayout.getRows() != null) {
+			boolean smallWidth = ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH-1);
+			if (smallWidth != m_smallWidth) {
+				parameterLayout.getRows().detach();
+				layoutParameters();
+				if (ThemeManager.isUseCSSForWindowSize()) {
+					ZKUpdateUtil.setCSSHeight(this);
+					ZKUpdateUtil.setCSSWidth(this);
+				}
+				this.invalidate();
+			}
+		}
+	}
 }	//	WAccountDialog

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/WAssignmentDialog.java

@@ -43,6 +43,7 @@ import org.adempiere.webui.component.Row;
 import org.adempiere.webui.component.Rows;
 import org.adempiere.webui.component.Textbox;
 import org.adempiere.webui.component.Window;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.compiere.model.MResourceAssignment;
 import org.compiere.model.MRole;
@@ -115,8 +116,11 @@ public class WAssignmentDialog extends Window implements EventListener<Event>
 			log.log(Level.SEVERE, "", e);
 		}
 		setDisplay();	//	from mAssignment
-		ZKUpdateUtil.setWidth(this, "600px");
+		if (!ThemeManager.isUseCSSForWindowSize())
+			ZKUpdateUtil.setWindowWidthX(this, 600);
 		setSizable(true);
+		setMaximizable(true);
+		setSclass("assignment-dialog");
 		//		
 	}	//	VAssignmentDialog
 

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/WChat.java

@@ -23,6 +23,7 @@ import java.util.Map;
 import java.util.logging.Level;
 
 import org.adempiere.webui.AdempiereWebUI;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.ConfirmPanel;
@@ -30,6 +31,7 @@ import org.adempiere.webui.component.Label;
 import org.adempiere.webui.component.Textbox;
 import org.adempiere.webui.component.Window;
 import org.adempiere.webui.event.DialogEvents;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.compiere.model.MChat;
 import org.compiere.model.MChatEntry;
@@ -130,13 +132,15 @@ public class WChat extends Window implements EventListener<Event>, DialogEvents
 	private Map<Integer, Component> entryMap = new HashMap<Integer, Component>();
 	private SimpleDateFormat m_format;
 
+	private String orientation;
+
 	/**
 	 * 	Static Init.
 	 *	@throws Exception
 	 */
 	private void staticInit () throws Exception
 	{
-		this.setSclass("popup-dialog");
+		this.setSclass("popup-dialog chat-dialog");
 		this.setStyle("position: absolute");
 		this.setAttribute(AdempiereWebUI.WIDGET_INSTANCE_NAME, "chat");
 		this.appendChild(mainPanel);
@@ -174,13 +178,44 @@ public class WChat extends Window implements EventListener<Event>, DialogEvents
 		south.appendChild(confirmPanel);
 		ZKUpdateUtil.setVflex(confirmPanel, "min");
 
-		ZKUpdateUtil.setHeight(this, "88%");
+		if (!ThemeManager.isUseCSSForWindowSize())
-		ZKUpdateUtil.setWidth(this, "500px");
+		{
+			ZKUpdateUtil.setHeight(this, "88%");
+			ZKUpdateUtil.setWindowWidthX(this, 500);
+		}
+		else
+		{
+			addCallback(AFTER_PAGE_ATTACHED, t -> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+			});
+		}
 		this.setMaximizable(true);
 		this.setSizable(true);
 		this.setBorder("normal");
 		this.setClosable(true);
-	}	//	staticInit
+		
+		if (ClientInfo.isMobile())
+		{
+			orientation = ClientInfo.get().orientation;
+			ClientInfo.onClientInfo(this, this::onClientInfo);
+		}
+	}
+	
+	protected void onClientInfo()
+	{		
+		if (getPage() != null)
+		{
+			String newOrienation = ClientInfo.get().orientation;
+			if (!newOrienation.equals(orientation))
+			{
+				orientation = newOrienation;
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+				invalidate();
+			}
+		}
+	}
 	
 	/**
 	 * 	Load Chat
@@ -359,5 +394,4 @@ public class WChat extends Window implements EventListener<Event>, DialogEvents
 	public void onEvent(Event event) throws Exception {
 		actionPerformed(event);
 	}
-
+}	//	WChat
-}	//	AChat

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/WEMailDialog.java

@@ -33,6 +33,7 @@ import java.util.regex.Pattern;
 import javax.activation.DataSource;
 
 import org.adempiere.webui.AdempiereWebUI;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.component.AttachmentItem;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Checkbox;
@@ -115,17 +116,23 @@ public class WEMailDialog extends Window implements EventListener<Event>, ValueC
 	{
 		super();
         this.setTitle(title);
-        this.setSclass("popup-dialog");
+        this.setSclass("popup-dialog email-dialog");
 		this.setClosable(true);
 		this.setBorder("normal");
-		ZKUpdateUtil.setWidth(this, "80%");
+		if (!ThemeManager.isUseCSSForWindowSize())
-		ZKUpdateUtil.setHeight(this, "80%");
+		{
+			ZKUpdateUtil.setWidth(this, "80%");
+			ZKUpdateUtil.setHeight(this, "80%");
+		}
 		this.setShadow(true);
 		this.setMaximizable(true);
 		this.setSizable(true);
 		        
 		fMessage = new CKeditor();
-		fMessage.setCustomConfigurationsPath("/js/ckeditor/config.js");
+		if (ClientInfo.isMobile())
+			fMessage.setCustomConfigurationsPath("/js/ckeditor/config-min.js");
+		else
+			fMessage.setCustomConfigurationsPath("/js/ckeditor/config.js");
 		fMessage.setToolbar("MyToolbar");
 		Map<String,Object> lang = new HashMap<String,Object>();
 		lang.put("language", Language.getLoginLanguage().getAD_Language());
@@ -219,6 +226,11 @@ public class WEMailDialog extends Window implements EventListener<Event>, ValueC
 		if (MUser.get(Env.getCtx()).isAddMailTextAutomatically()) {
 			addMailText();
 		}
+		if (newpage != null && ThemeManager.isUseCSSForWindowSize()) {
+			ZKUpdateUtil.setCSSHeight(this);
+			ZKUpdateUtil.setCSSWidth(this);
+			this.invalidate();
+		}
 	}
 
 	/**
@@ -835,5 +847,4 @@ public class WEMailDialog extends Window implements EventListener<Event>, ValueC
 			
 		}
 	}
-
 }	//	WEMailDialog

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/WFieldRecordInfo.java

@@ -79,8 +79,18 @@ public class WFieldRecordInfo extends Window implements EventListener<Event>
 		super ();
 		this.setTitle(title);
 		this.setAttribute(Window.MODE_KEY, Window.MODE_HIGHLIGHTED);
-		ZKUpdateUtil.setWidth(this, "640px");
+		if (!ThemeManager.isUseCSSForWindowSize())
-		ZKUpdateUtil.setHeight(this, "480px");
+		{
+			ZKUpdateUtil.setWindowWidthX(this, 640);
+			ZKUpdateUtil.setWindowHeightX(this, 480);
+		}
+		else
+		{
+			addCallback(AFTER_PAGE_ATTACHED, t-> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+			});
+		}
 		this.setBorder("normal");
 		this.setSizable(true);
 		this.setClosable(true);
@@ -153,6 +163,7 @@ public class WFieldRecordInfo extends Window implements EventListener<Event>
 		south.appendChild(confirmPanel);
 		
 		confirmPanel.addActionListener(Events.ON_CLICK, this);
+		setSclass("field-record-info-dialog");
 	}	//	init
 	
 	
@@ -378,5 +389,4 @@ public class WFieldRecordInfo extends Window implements EventListener<Event>
         
         popupMenu.appendChild(changeLogItem);
 	}
-
 }	// WFieldRecordInfo

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/WFieldSuggestion.java

@@ -11,6 +11,7 @@ import org.adempiere.webui.component.GridFactory;
 import org.adempiere.webui.component.Row;
 import org.adempiere.webui.component.Rows;
 import org.adempiere.webui.component.Window;
+import org.adempiere.webui.util.ZKUpdateUtil;
 import org.compiere.model.MField;
 import org.compiere.model.MFieldSuggestion;
 import org.compiere.util.Env;
@@ -119,11 +120,12 @@ public class WFieldSuggestion extends Window implements EventListener<Event> {
 		this.setSclass("popup-dialog");
 		this.setClosable(true);
 		this.setBorder("normal");
-		this.setWidth("550px");
+		ZKUpdateUtil.setWindowWidthX(this, 550);
-		this.setHeight("350px");
+		ZKUpdateUtil.setWindowHeightX(this, 350);
 		this.setShadow(true);
 		this.setAttribute(Window.MODE_KEY, Window.MODE_HIGHLIGHTED);
 		this.setSizable(true);
+		this.setMaximizable(true);
 	}
 
 	@Override

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/WImageDialog.java

@@ -20,6 +20,7 @@ import java.io.InputStream;
 import java.util.logging.Level;
 
 import org.adempiere.webui.AdempiereWebUI;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.apps.AEnv;
 import org.adempiere.webui.component.Button;
@@ -27,6 +28,7 @@ import org.adempiere.webui.component.ConfirmPanel;
 import org.adempiere.webui.component.Panel;
 import org.adempiere.webui.component.Textbox;
 import org.adempiere.webui.component.Window;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.apache.commons.codec.binary.Base64;
 import org.compiere.model.MImage;
@@ -130,10 +132,20 @@ public class WImageDialog extends Window implements EventListener<Event>
 	 */
 	void init() throws Exception
 	{
-		this.setSclass("popup-dialog");
+		this.setSclass("popup-dialog image-dialog");
 		this.setBorder("normal");
-		ZKUpdateUtil.setWidth(this, "640px");
+		if (!ThemeManager.isUseCSSForWindowSize()) 
-		ZKUpdateUtil.setHeight(this, "540px");
+		{
+			ZKUpdateUtil.setWindowWidthX(this, 640);
+			ZKUpdateUtil.setWindowHeightX(this, 540);
+		}
+		else
+		{
+			addCallback(AFTER_PAGE_ATTACHED, t-> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+			});
+		}
 		this.setShadow(true);
 		this.setAttribute(Window.MODE_KEY, Window.MODE_HIGHLIGHTED);
 		this.setSizable(true);
@@ -142,8 +154,14 @@ public class WImageDialog extends Window implements EventListener<Event>
 		captureDiv = new Div();
 		this.appendChild(captureDiv);
 		captureDiv.setStyle("position: absolute;");
-		ZKUpdateUtil.setHeight(captureDiv, "480px");
+		if (ClientInfo.maxHeight(539))
-		ZKUpdateUtil.setWidth(captureDiv, "640px");
+			ZKUpdateUtil.setHeight(captureDiv, (ClientInfo.get().desktopHeight-60)+ "px");
+		else
+			ZKUpdateUtil.setHeight(captureDiv, "480px");
+		if (ClientInfo.maxWidth(639))
+			ZKUpdateUtil.setWidth(captureDiv, ClientInfo.get().desktopWidth + "px");
+		else
+			ZKUpdateUtil.setWidth(captureDiv, "640px");
 		captureDiv.setVisible(false);
 		captureDiv.addEventListener("onCaptureImage", this);
 	    cancelCaptureButton = new Button(Util.cleanAmp(Msg.getMsg(Env.getCtx(), "Cancel")));

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/WLocationDialog.java

@@ -28,6 +28,7 @@ import java.util.StringTokenizer;
 import java.util.logging.Level;
 
 import org.adempiere.util.Callback;
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.component.Button;
 import org.adempiere.webui.component.Checkbox;
@@ -44,6 +45,7 @@ import org.adempiere.webui.component.Row;
 import org.adempiere.webui.component.Rows;
 import org.adempiere.webui.component.Textbox;
 import org.adempiere.webui.component.Window;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.compiere.model.GridField;
 import org.compiere.model.MAddressValidation;
@@ -205,9 +207,19 @@ public class WLocationDialog extends Window implements EventListener<Event>
 		setRegion();
 		initLocation();
 		//
-		ZKUpdateUtil.setWidth(this, "380px");
+		if (!ThemeManager.isUseCSSForWindowSize()) 
-		ZKUpdateUtil.setHeight(this, "420px"); // required fixed height for ZK to auto adjust the position based on available space
+		{
-		this.setSclass("popup-dialog");
+			ZKUpdateUtil.setWindowWidthX(this, 380);
+			ZKUpdateUtil.setWindowHeightX(this, 420); // required fixed height for ZK to auto adjust the position based on available space
+		}
+		else
+		{
+			addCallback(AFTER_PAGE_ATTACHED, t -> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+			});
+		}
+		this.setSclass("popup-dialog location-dialog");
 		this.setClosable(true);
 		this.setBorder("normal");
 		this.setShadow(true);
@@ -316,6 +328,14 @@ public class WLocationDialog extends Window implements EventListener<Event>
 		lstAddressValidation.setRows(0);		
 
 		mainPanel = GridFactory.newGridLayout();
+		
+		if (ClientInfo.isMobile())
+		{
+			if (ClientInfo.maxWidth(ClientInfo.EXTRA_SMALL_WIDTH) || ClientInfo.maxHeight(ClientInfo.SMALL_HEIGHT))
+			{
+				confirmPanel.addButtonSclass("btn-medium small-image-btn");
+			}
+		}
 	}
 
 	private void init()

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/WLocatorDialog.java

@@ -26,6 +26,7 @@ import java.sql.ResultSet;
 import java.sql.SQLException;
 import java.util.logging.Level;
 
+import org.adempiere.webui.ClientInfo;
 import org.adempiere.webui.LayoutUtils;
 import org.adempiere.webui.component.Checkbox;
 import org.adempiere.webui.component.Column;
@@ -40,6 +41,7 @@ import org.adempiere.webui.component.Row;
 import org.adempiere.webui.component.Rows;
 import org.adempiere.webui.component.Textbox;
 import org.adempiere.webui.component.Window;
+import org.adempiere.webui.theme.ThemeManager;
 import org.adempiere.webui.util.ZKUpdateUtil;
 import org.compiere.model.MLocator;
 import org.compiere.model.MLocatorLookup;
@@ -273,14 +275,32 @@ public class WLocatorDialog extends Window implements EventListener<Event>
 		southPane.appendChild(confirmPanel);
 		
 		this.setTitle(title);
-		this.setSclass("popup-dialog");
+		this.setSclass("popup-dialog locator-dialog");
 		this.setClosable(true);
 		this.setBorder("normal");
-		ZKUpdateUtil.setWidth(this, "260px");
+		if (!ThemeManager.isUseCSSForWindowSize()) 
-		ZKUpdateUtil.setHeight(this, "350px"); // required fixed height for ZK to auto adjust the position based on available space
+		{
+			ZKUpdateUtil.setWindowWidthX(this, 260);
+			ZKUpdateUtil.setWindowHeightX(this, 350); // required fixed height for ZK to auto adjust the position based on available space
+		}
+		else
+		{
+			addCallback(AFTER_PAGE_ATTACHED, t -> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+			});
+		}
 		this.setShadow(true);
 		this.setAttribute(Window.MODE_KEY, Window.MODE_HIGHLIGHTED);
 		this.setSizable(true); // Elaine 2009/02/02 - window set to resizable
+		
+		if (ClientInfo.isMobile())
+		{
+			ClientInfo.onClientInfo(this, () -> {
+				ZKUpdateUtil.setCSSHeight(this);
+				ZKUpdateUtil.setCSSWidth(this);
+			});
+		}
 	}
 	
 	private void initLocator()

org.adempiere.ui.zk/WEB-INF/src/org/adempiere/webui/window/WMediaDialog.java

@@ -105,7 +105,7 @@ public class WMediaDialog extends Window implements EventListener<Event>
 		{
 			log.log(Level.SEVERE, "", ex);
 		}		
-	} // WAttachment
+	} // WMediaDialog
 
 	/**
 	 *	Static setup.
@@ -125,9 +125,19 @@ public class WMediaDialog extends Window implements EventListener<Event>
 	
 	void staticInit() throws Exception
 	{
-		ZKUpdateUtil.setWidth(this, "500px");
+		if (!ThemeManager.isUseCSSForWindowSize())
-		ZKUpdateUtil.setHeight(this, "500px");
+		{
+			ZKUpdateUtil.setWindowWidthX(this, 500);
+			ZKUpdateUtil.setWindowHeightX(this, 500);
+		}
+		else
+		{
+			addCallback("afterPageAttached", t -> afterPageAttached());
+		}
+		this.setSclass("media-dialog");
 		this.setClosable(true);
+		this.setSizable(true);
+		this.setMaximizable(true);
 		this.setBorder("normal");
 		this.appendChild(mainPanel);
 		ZKUpdateUtil.setHeight(mainPanel, "100%");
@@ -185,6 +195,13 @@ public class WMediaDialog extends Window implements EventListener<Event>
 		
 		confirmPanel.appendChild(bOk);
 		confirmPanel.appendChild(bCancel);
+		confirmPanel.setStyle("float: right;");
+	}
+	
+	private void  afterPageAttached() {
+		ZKUpdateUtil.setCSSHeight(this);
+		ZKUpdateUtil.setCSSWidth(this);
+		
 	}
 
 	/**
@@ -352,4 +369,5 @@ public class WMediaDialog extends Window implements EventListener<Event>
 		return m_data;
 	}
 	
+	
 }