Techsystech
/
web_techsystech
forked from Techsystech/web
3
0
Fork 0
Code Pull Requests Activity

Merge pull request #529 from Tecnativa/9.0-web_responsive-backport 

[9.0][web_responsive] Backport new features from 10.0
9.0
Pedro M. Baeza 2017-01-20 18:25:37 +01:00 committed by GitHub
parent d59e7d6b98 0fccd36830
commit 3db06ad79b
13 changed files with 372 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web_responsive/__openerp__.py
View File

@ -6,7 +6,7 @@
"name": "Web Responsive",
"summary": "It provides a mobile compliant interface for Odoo Community "
"web",
"version": "9.0.1.0.0",
"version": "9.0.2.0.0",
"category": "Website",
"website": "https://laslabs.com/",
"author": "LasLabs, Tecnativa, Odoo Community Association (OCA)",

4
web_responsive/i18n/es.po
View File

@ -9,8 +9,8 @@ msgid ""
msgstr ""
"Project-Id-Version: Odoo Server 9.0c\n"
"Report-Msgid-Bugs-To: \n"
"POT-Creation-Date: 2016-12-15 12:44+0000\n"
"PO-Revision-Date: 2016-12-15 12:44+0000\n"
"POT-Creation-Date: 2016-12-23 02:13+0000\n"
"PO-Revision-Date: 2016-12-23 02:13+0000\n"
"Last-Translator: Pedro M. Baeza <pedro.baeza@gmail.com>, 2016\n"
"Language-Team: Spanish (https://www.transifex.com/oca/teams/23907/es/)\n"
"MIME-Version: 1.0\n"

9
web_responsive/static/lib/css/drawer.3.2.0.css
View File

@ -66,6 +66,15 @@
.drawer-open .drawer-overlay {
display: block;
}
/* XXX: local patch waiting for:
https://github.com/blivesta/drawer/pull/36
*/
.drawer-open {
overflow: hidden;
}
/* end local patch */
/*!------------------------------------*\
Top
\*!------------------------------------*/

10
web_responsive/static/lib/js/drawer.3.2.0.js
View File

@ -121,7 +121,10 @@
return $this
.removeClass(__.settings.class.close)
.addClass(__.settings.class.open)
.css({ 'overflow': 'hidden' })
// XXX: local patch waiting for:
// https://github.com/blivesta/drawer/pull/36
//.css({ 'overflow': 'hidden' })
// end local patch
.drawerCallback(function triggerOpenedListeners() {
__.settings.state = true;
$this.trigger(__.settings.events.opened);
@ -136,7 +139,10 @@
return $this
.removeClass(__.settings.class.open)
.addClass(__.settings.class.close)
.css({ 'overflow': 'auto' })
// XXX: local patch waiting for:
// https://github.com/blivesta/drawer/pull/36
//.css("overflow", "auto")
// end local patch
.drawerCallback(function triggerClosedListeners() {
__.settings.state = false;
$this.trigger(__.settings.events.closed);

9
web_responsive/static/src/js/web_responsive.js
View File

@ -4,7 +4,6 @@
odoo.define('web_responsive', function(require) {
'use strict';
var $ = require('$');
var Menu = require('web.Menu');
var Class = require('web.Class');
var SearchView = require('web.SearchView');
@ -83,12 +82,18 @@ odoo.define('web_responsive', function(require) {
'-': this.LEFT,
};
this.initDrawer();
var $clickZones = $('.openerp_webclient_container, ' +
var $clickZones = $('.odoo_webclient_container, ' +
'a.oe_menu_leaf, ' +
'a.oe_menu_toggler, ' +
'a.oe_logo, ' +
'i.oe_logo_edit'
);
$('.o_content').scroll(function() {
$('.o_control_panel').css(
'margin-top',
-$(this).scrollTop() + 'px'
);
});
$clickZones.click($.proxy(this.handleClickZones, this));
core.bus.on('resize', this, this.handleWindowResize);
core.bus.on('keydown', this, this.handleNavKeys);

13
web_responsive/static/src/less/app_drawer.less
View File

@ -11,10 +11,15 @@
border-radius: @border-radius-base;
.box-shadow(0 6px 12px rgba(0, 0, 0, .175));
background-clip: padding-box;
z-index: 10000;
.o_tooltip {
z-index: 1051;
}
.oe_logo {
img {
margin-top: -@app-drawer-navbar-padding-vertical;
margin-top: -@app-drawer-navbar-padding-vertical * 2;
height: @app-drawer-title-height;
}
.oe_logo_edit {
@ -24,7 +29,7 @@
padding: 4px;
margin: 14px 0;
display: none;
color: #eee;
color: @odoo-list-footer-bg-color;
background: rgba(37,37,37,0.9);
}
&:hover .oe_logo_edit_admin {
@ -45,7 +50,7 @@
}
.app-drawer-panel-title {
margin-top: 5px;
margin-top: 4px;
}
.app-drawer-icon-app {
@ -65,14 +70,12 @@
position: absolute;
height: @app-drawer-title-height;
width: 100%;
z-index: 9999;
}
}
.drawer-nav {
width: @app-drawer-width;
z-index: 9999;
}
.drawer--left .drawer-nav {

90
web_responsive/static/src/less/form_view.less 100644
View File

@ -0,0 +1,90 @@
/* Copyright 2016 Ponto Suprimentos Ltda.
* License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). */
.openerp .oe_formview .oe_form {
// Form must fill 100% width in any size
.oe_form_sheetbg {
padding: 16px;
.oe_form_sheet_width {
min-width: auto;
max-width: 100%;
}
@media (max-width: @screen-sm-max) {
padding: 0;
.oe_form_sheet_width {
border: none;
}
}
}
// No overflowing buttons or titles
.oe_button_box, .oe_title {
max-width: 100%;
}
@media (max-width: @screen-sm-max) {
.oe_form_field > .ui-autocomplete-input {
width: 80%;
}
.oe_form_group_row .oe_form_group_row {
margin: 0;
}
.oe_form_group, .oe_form_group_row, .oe_form_group_cell {
&, & tbody {
display: block;
margin-top: 8px;
width: 100%;
}
&.oe_group_right {
padding: 0;
}
.oe_form_group_row {
display: table;
}
.oe_form_group_cell {
margin: 0;
width: 100%;
}
.oe_form_group_cell_label {
@media (min-width: @screen-sm-min) {
display: table-cell;
min-width: 30%;
width: 30%;
}
@media (max-width: @screen-xs-max) {
border: none;
}
+ .oe_form_group_cell {
@media (min-width: @screen-sm-min) {
display: table-cell;
max-width: 70%;
width: 70%;
}
}
}
}
}
// Make image editing controls always available, instead of depending on
// resolution or hover
.oe_form_field_image > .oe_form_field_image_controls {
display: block;
opacity: 0.7;
}
// Adapt chatter widget to small viewports
.oe_chatter {
min-width: inherit;
}
}

46
web_responsive/static/src/less/main.less
View File

@ -22,6 +22,48 @@ main {
overflow: hidden;
}
div.oe_footer {
display: none;
.navbar {
z-index: 10;
}
.o_cp_switch_buttons {
.active {
z-index: 10;
}
}
.oe_leftbar {
.oe_logo {
display: none;
}
.oe_footer {
display: none;
}
}
.o_tooltip.active {
z-index: 1051;
}
.o_web_client {
>.o_main {
overflow: auto;
> .o_main_content {
overflow: initial;
> .o_content {
overflow: initial;
}
}
}
}
// Remove z-index from CP buttons so it doesn't overlap the menu
.o_control_panel {
.btn-group > .btn.active {
z-index: initial;
}
}
.o_chat_window {
z-index: 1000;
}

187
web_responsive/static/src/less/navbar.less
View File

@ -1,23 +1,178 @@
/* Copyright 2016 LasLabs Inc.
* License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). */
.main-nav {
margin-bottom: 0;
min-height: @app-drawer-navbar-height;
}
header {
margin: 0;
padding: 0;
.main-nav ul.nav > li > a {
padding: @app-drawer-navbar-padding-vertical @app-drawer-padding-horizontal;
}
> .main-nav {
display: block;
white-space: nowrap;
.oe_topbar_avatar {
margin-top: -@app-drawer-padding-horizontal;
height: @app-drawer-navbar-height;
border-radius: 50%;
.navbar-systray {
white-space: nowrap;
@media (max-width: @screen-xs-max) {
position: absolute;
top: 0;
right: 56px;
}
> .oe_user_menu_placeholder > li > a {
> .oe_topbar_avatar {
border-radius: 50%;
margin-top: -8px;
max-height: 36px;
height: 36px;
width: 36px;
}
.oe_topbar_name {
position: relative;
top: -3px;
@media (max-width: @screen-xs-max) {
display: none;
}
}
.caret {
position: relative;
top: -3.5px;
}
}
> .oe_systray > li > a {
.fa {
position: relative;
top: 3px;
font-size: 16px;
}
.caret {
position: relative;
top: 0.5px;
}
}
}
.navbar-right {
float: right;
> li {
float: left;
}
@media (max-width: @screen-xs-max) {
.navbar-nav .open .dropdown-menu {
position: fixed;
top: 46px;
bottom: 0;
left: 0;
right: 0;
overflow: auto;
float: left;
background-color: @odoo-view-background-color;
border: 1px solid rgba(0, 0, 0, 0.15);
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
}
}
}
.container-fluid:before, .container-fluid:after, .navbar-collapse:before, .navbar-collapse:after {
display: inline;
}
> .container-fluid {
margin: 0;
padding: 0;
@media (max-width: @screen-xs-max) {
> .navbar-collapse {
margin: 0;
padding: 0;
overflow: auto;
&.collapsing {
overflow: hidden;
}
}
}
> .navbar-header {
margin: 0;
padding: 0;
> .drawer-toggle, .navbar-toggle {
margin: 0;
padding: 0;
border: 1px solid @nav-tabs-active-link-hover-border-color;
> i.fa, div.fa {
padding: 16px 14px 15px;
}
}
}
.oe_leftbar > .oe_secondary_menus_container > .oe_secondary_menu {
ul.dropdown-menu > li.dropdown-header {
color: @odoo-view-background-color;
text-decoration: none;
background-color: @odoo-main-color-muted;
font-weight: bold;
}
@media (min-width: @screen-sm-min) {
height: @navbar-height;
}
margin: 0;
padding: 0;
> li {
@media (min-width: @screen-sm-min) {
height: @navbar-height;
}
margin: 0;
padding: 0;
&.app-name {
display: block;
padding: 7px 8px;
> .oe_menu_text {
font-size: 20px;
}
@media (min-width: @screen-sm-min) {
padding: 8.5px 12px;
}
}
> a {
margin: 0;
@media (min-width: @screen-sm-min) {
height: @navbar-height;
padding: 14px 8px;
}
}
}
}
}
> .navbar-right.o_menu_systray {
display: inline;
margin: 0;
padding: 0;
> ul {
margin: 0;
padding: 0;
> li > a {
margin: 0;
padding: 13px 8px;
height: @navbar-height;
}
}
}
.badge {
position: absolute;
top: 3px;
right: @navbar-padding-horizontal / 2;
}
ul.nav > li > a {
padding: @app-drawer-navbar-padding-vertical @app-drawer-padding-horizontal;
}
.o_planner_systray > .progress {
margin-top: 15px;
}
}
}
a.navbar-collapse.collapse {
@media (min-width: @screen-sm) {
@media (min-width: @screen-sm-min) {
padding-bottom: @app-drawer-navbar-padding-vertical;
padding-top: @app-drawer-navbar-padding-vertical;
}
@ -26,11 +181,3 @@ a.navbar-collapse.collapse {
.dropdown-scrollable {
overflow-x: hidden;
}
@media (max-width: @screen-xs-max) {
#odooMenuBarNav[aria-expanded="false"] {
/* Hack to hide the visibly expanded mobile menu on load. */
position: absolute;
z-index: -9999;
}
}

11
web_responsive/static/src/less/variables.less
View File

@ -5,9 +5,18 @@
@app-drawer-icon-size: 6em;
@app-drawer-icon-margin: 1em;
@app-drawer-width: 80%;
@app-drawer-title-height: @navbar-height;
@app-drawer-title-height: 54px;
// Navbar
@navbar-height: 46px;
@navbar-margin-bottom: 0;
@app-drawer-navbar-height: @navbar-height / 2;
@app-drawer-navbar-padding-vertical: @navbar-padding-vertical / 2;
@app-drawer-padding-horizontal: @navbar-padding-horizontal / 2;
// Drawer Toggle
@drawer-toggle-height: @navbar-height;
@drawer-toggle-width: @navbar-height;
// Backported from v10
@odoo-list-footer-bg-color: #eee;

2
web_responsive/tests/test_ui.py
View File

@ -2,7 +2,7 @@
# Copyright 2016 LasLabs Inc.
# License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl.html).
from openerp.tests import HttpCase
from odoo.tests import HttpCase
class TestUi(HttpCase):

5
web_responsive/views/assets.xml
View File

@ -22,6 +22,9 @@
<link rel="stylesheet"
href="/web_responsive/static/src/less/app_drawer.less"
/>
<link rel="stylesheet"
href="/web_responsive/static/src/less/form_view.less"
/>
<link rel="stylesheet"
href="/web_responsive/static/src/less/variables.less"
/>
@ -37,7 +40,7 @@
</xpath>
</template>
<template id="qunit_suite" inherit_id="web.qunit_suite">
<xpath expr="//html/head" position="inside">
<xpath expr="//head" position="inside">
<script type="application/javascript"
src="/web_responsive/static/tests/js/web_responsive.js"
/>

44
web_responsive/views/web.xml
View File

@ -25,7 +25,7 @@
<xpath expr="//nav[@id='oe_main_menu_navbar']" position="replace">
<t t-set="body_classname" t-value="'drawer drawer--left'" />
<t t-set="body_classname" t-value="'drawer drawer--left o_web_client'" />
<header role="banner">
<nav id="odooAppDrawer" class="app-drawer-nav drawer-nav" role="navigation">
@ -40,8 +40,7 @@
<div class="navbar-header">
<a href="#"
class="drawer-toggle navbar-collapse collapse btn btn-default app-drawer-toggle"
<a class="drawer-toggle navbar-collapse collapse btn btn-default app-drawer-toggle"
accesskey="A"
>
<span class="sr-only">Toggle App Drawer</span>
@ -73,7 +72,7 @@
</div>
<div class="collapse navbar-collapse text-center"
<div class="collapse navbar-collapse"
id="odooMenuBarNav"
data-parent="#odooMenuBarToggle"
aria-expanded="false"
@ -83,16 +82,12 @@
>
<t t-call="web.menu_secondary" />
</div>
<div class="nav navbar-nav navbar-right">
<ul class="nav navbar-nav navbar-right oe_user_menu_placeholder"
style="display: none;"
/>
<ul class="nav navbar-nav navbar-right oe_systray"
style="display: none;"
/>
</div>
</div>
</div>
<div class="nav navbar-nav navbar-right navbar-systray o_menu_systray">
<ul class="nav navbar-nav navbar-right navbar-systray-item oe_user_menu_placeholder"/>
<ul class="nav navbar-nav navbar-right navbar-systray-item oe_systray"/>
</div>
</nav>
</header>
@ -106,16 +101,20 @@
name="App Drawer - Secondary Menu"
>
<xpath expr="//a[@class='oe_logo']" position="replace" />
<xpath expr="//div[@class='oe_secondary_menus_container']/t" position="replace">
<t t-foreach="menu_data['children']" t-as="menu">
<ul class="oe_secondary_menu nav navbar-nav"
t-att-data-menu-parent="menu['id']"
style="display: none;"
>
<t t-call="web.menu_secondary_submenu" />
<ul style="display: none"
class="oe_secondary_menu nav navbar-nav"
t-att-data-menu-parent="menu['id']">
<li class="app-name">
<span class="oe_menu_text">
<t t-esc="menu['name']"/>
</span>
</li>
<li>
<t t-call="web.menu_secondary_submenu" />
</li>
</ul>
</t>
@ -140,8 +139,7 @@
</t>
</t>
<t t-if="not submenu">
<a href="#"
class="dropdown-toggle"
<a class="dropdown-toggle"
data-toggle="dropdown"
role="button"
aria-haspopup="true"
@ -215,7 +213,7 @@
<div class="panel-heading" id="appDrawerAppPanelHead">
<div class="col-xs-6">
<h4 class="app-drawer-panel-title pull-left">
<a href="#" class="app-drawer-icon-close drawer-toggle">
<a class="app-drawer-icon-close drawer-toggle">
<i class="fa fa-lg fa-chevron-left"
t-translation="off"
aria-hidden="true"
@ -244,7 +242,7 @@
</t>
</li>
<li id="menu_more_container" class="dropdown" style="display: none;">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">More <b class="caret"></b></a>
<a class="dropdown-toggle" data-toggle="dropdown">More <b class="caret"></b></a>
<ul id="menu_more" class="dropdown-menu"></ul>
</li>
</ul>