IDEMPIERE-4515 Mobile: Paging control at detail pane overlapped with toolbar (#349)

- Use more compact layout for small width screen
- Always enable click to popup for status message for small width screen
This commit is contained in:
hengsin 2020-11-03 21:05:05 +08:00 committed by GitHub
parent d046842ef5
commit 5ceae6cbe3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 32 additions and 4 deletions

View File

@ -9,6 +9,7 @@ import java.util.List;
import java.util.Map;
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;
@ -447,8 +448,8 @@ public class DetailPane extends Panel implements EventListener<Event>, IdSpace {
messageContainer.setAlign("center");
messageContainer.setSclass("adwindow-detailpane-message");
messageContainer.setId("messages");
toolbar.appendChild(new Space());
if (ClientInfo.minWidth(ClientInfo.SMALL_WIDTH))
toolbar.appendChild(new Space());
toolbar.appendChild(messageContainer);
toolbar.setSclass("adwindow-detailpane-toolbar");
ZKUpdateUtil.setVflex(toolbar, "0");
@ -582,7 +583,10 @@ public class DetailPane extends Panel implements EventListener<Event>, IdSpace {
label.setStyle("cursor: pointer");
messageContainer.appendChild(label);
label.addEventListener(Events.ON_CLICK, this);
}
} else if (ClientInfo.maxWidth(ClientInfo.SMALL_WIDTH)) {
label.addEventListener(Events.ON_CLICK, this);
label.setStyle("cursor: pointer");
}
messageContainer.appendChild(new Space());
}

View File

@ -400,4 +400,28 @@
@keyframes slide-left-in {
0% { transform: translateX(100%); }
100% { transform: translateX(0%); }
}
}
@media only screen
and (max-device-width: 700px) {
.adwindow-detailpane-toolbar .z-paging-button {
margin-right: 2px;
}
.adwindow-detailpane-toolbar .z-paging-input {
margin-left: 3px;
}
.adwindow-detailpane-toolbar .z-paging-text {
margin-right: 3px;
}
.adwindow-detailpane-toolbar {
padding-left: 0px;
padding-right: 0px;
}
}
@media only screen
and (max-device-width: 350px) {
.adwindow-detailpane-toolbar .z-paging-input {
width: 30px;
}
}