Browse Source

[FIX][web_responsive] Fit view to screen.

This patch makes the `.oe_web_client` element to fit exactly inside the viewport, instead of overflowing it as before.
pull/560/head
Jairo Llopis 8 years ago
parent
commit
4a12a5efcc
  1. 9
      web_responsive/README.rst
  2. 22
      web_responsive/static/src/less/main.less
  3. 2
      web_responsive/views/web.xml

9
web_responsive/README.rst

@ -10,11 +10,10 @@ This module provides a mobile compliant interface for Odoo Community web.
Features:
* New navigation with an App drawer
* Keyboard shortcuts for easier navigation
* Display kanban views for small screens format if an action or field One2x
has a kanban view
* New navigation with an App drawer
* Keyboard shortcuts for easier navigation
* Display kanban views for small screens format if an action or field One2x
has a kanban view
Installation
============

22
web_responsive/static/src/less/main.less

@ -4,6 +4,8 @@
body {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
// Do not fix the search part, it's too big for small screens
@media (max-width: @screen-sm-max) {
@ -14,6 +16,11 @@ body {
}
}
}
> header {
flex-grow: 0;
flex-shrink: 0;
}
}
main {
@ -45,16 +52,11 @@ main {
z-index: 1051;
}
.o_web_client {
>.o_main {
overflow: auto;
> .o_main_content {
overflow: initial;
> .o_content {
overflow: initial;
}
}
}
.oe_web_client {
flex-shrink: 0;
flex-grow: 1;
display: flex;
flex-direction: column;
}
// Remove z-index from CP buttons so it doesn't overlap the menu

2
web_responsive/views/web.xml

@ -20,7 +20,7 @@
<meta name="MobileOptimized" content="320" />
<meta name="HandheldFriendly" content="True" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, user-scalable=no" />
</xpath>
<xpath expr="//nav[@id='oe_main_menu_navbar']" position="replace">

Loading…
Cancel
Save