mirror of https://github.com/OCA/web.git
commit
c08a76c129
|
@ -103,6 +103,12 @@ Features for computers:
|
|||
|
||||
.. image:: https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/chatter.gif
|
||||
|
||||
* When the chatter is configured on the side part, the document viewer fills that
|
||||
part for side-by-side reading instead of full screen. You can still put it on full
|
||||
width preview clicking on the new maximize button.
|
||||
|
||||
.. image:: https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/document_viewer.gif
|
||||
|
||||
**Table of contents**
|
||||
|
||||
.. contents::
|
||||
|
|
|
@ -25,5 +25,6 @@
|
|||
'static/src/xml/apps.xml',
|
||||
'static/src/xml/form_view.xml',
|
||||
'static/src/xml/navbar.xml',
|
||||
'static/src/xml/document_viewer.xml',
|
||||
],
|
||||
}
|
||||
|
|
|
@ -75,3 +75,9 @@ Features for computers:
|
|||
* Followers and send button is displayed on mobile. Avatar is hidden.
|
||||
|
||||
.. image:: ../static/img/chatter.gif
|
||||
|
||||
* When the chatter is configured on the side part, the document viewer fills that
|
||||
part for side-by-side reading instead of full screen. You can still put it on full
|
||||
width preview clicking on the new maximize button.
|
||||
|
||||
.. image:: ../static/img/document_viewer.gif
|
||||
|
|
|
@ -430,6 +430,11 @@ See <a class="reference external" href="https://github.com/odoo/odoo/issues/3006
|
|||
<li><p class="first">Followers and send button is displayed on mobile. Avatar is hidden.</p>
|
||||
<img alt="https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/chatter.gif" src="https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/chatter.gif" />
|
||||
</li>
|
||||
<li><p class="first">When the chatter is configured on the side part, the document viewer fills that
|
||||
part for side-by-side reading instead of full screen. You can still put it on full
|
||||
width preview clicking on the new maximize button.</p>
|
||||
<img alt="https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/document_viewer.gif" src="https://raw.githubusercontent.com/OCA/web/12.0/web_responsive/static/img/document_viewer.gif" />
|
||||
</li>
|
||||
</ul>
|
||||
<p><strong>Table of contents</strong></p>
|
||||
<div class="contents local topic" id="contents">
|
||||
|
|
Binary file not shown.
After Width: | Height: | Size: 6.7 MiB |
|
@ -1,6 +1,8 @@
|
|||
/* Copyright 2018 Tecnativa - Jairo Llopis
|
||||
* License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). */
|
||||
|
||||
$chatter_zone_width: 35%;
|
||||
|
||||
@mixin full-screen-dropdown {
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
|
@ -499,7 +501,7 @@ html .o_web_client .o_main .o_main_content {
|
|||
|
||||
.o_chatter {
|
||||
border-left: 1px solid gray('400');
|
||||
flex: 0 0 35%;
|
||||
flex: 0 0 $chatter_zone_width;
|
||||
max-width: initial;
|
||||
min-width: initial;
|
||||
overflow: auto;
|
||||
|
@ -576,3 +578,106 @@ html .o_web_client .o_main .o_main_content {
|
|||
.oe_wait {
|
||||
cursor: progress;
|
||||
}
|
||||
|
||||
// Document Viewer
|
||||
.o_web_client.o_chatter_position_sided {
|
||||
.o_modal_fullscreen.o_document_viewer {
|
||||
// On-top of navbar
|
||||
z-index: 10;
|
||||
|
||||
&.o_responsive_document_viewer {
|
||||
/* Show sided viewer on large screens */
|
||||
@include media-breakpoint-up(lg) {
|
||||
width: $chatter_zone_width;
|
||||
margin-left: auto;
|
||||
|
||||
/* Show/Hide control buttons (next, prev, etc..) */
|
||||
&:hover .arrow, &:hover .o_viewer_toolbar {
|
||||
display: unset;
|
||||
}
|
||||
.arrow, .o_viewer_toolbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.o_viewer_img_wrapper {
|
||||
position: relative;
|
||||
|
||||
.o_viewer_pdf {
|
||||
width: 95%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.o_minimize_btn {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
&:not(.o_responsive_document_viewer) {
|
||||
.o_maximize_btn {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@include media-breakpoint-down(lg) {
|
||||
.o_minimize_btn, .o_maximize_btn {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/* Max/Min buttons only are usefull in sided mode */
|
||||
.o_web_client:not(.o_chatter_position_sided) {
|
||||
.o_minimize_btn, .o_maximize_btn {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
// Apply improvements for Document Viewer on all modes
|
||||
.o_modal_fullscreen .o_viewer_content {
|
||||
.o_viewer-header {
|
||||
.o_image_caption {
|
||||
display: contents;
|
||||
|
||||
.o_split_pdf_area {
|
||||
padding: 16px;
|
||||
margin-bottom: 0;
|
||||
position: relative;
|
||||
top: -5px;
|
||||
|
||||
label {
|
||||
margin-bottom: unset;
|
||||
}
|
||||
|
||||
.o_page_number_input {
|
||||
border: 1px solid white;
|
||||
border-radius: 3px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Hide 'split pdf' feature on small screens */
|
||||
@include media-breakpoint-down(xs) {
|
||||
.o_split_pdf_area {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Now uses a container to have more buttons
|
||||
.o_buttons {
|
||||
min-width: 35px;
|
||||
text-align: right;
|
||||
|
||||
// Now close button ('X') it's a fa-icon
|
||||
> .o_close_btn {
|
||||
top: unset;
|
||||
left: unset;
|
||||
bottom: unset;
|
||||
right: unset;
|
||||
font-size: unset;
|
||||
font-weight: unset;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.o_viewer_toolbar {
|
||||
width: max-content;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -14,6 +14,7 @@ odoo.define('web_responsive', function (require) {
|
|||
var Menu = require("web.Menu");
|
||||
var RelationalFields = require('web.relational_fields');
|
||||
var Chatter = require('mail.Chatter');
|
||||
var DocumentViewer = require('mail.DocumentViewer');
|
||||
|
||||
/*
|
||||
* Helper function to know if are waiting
|
||||
|
@ -525,4 +526,25 @@ odoo.define('web_responsive', function (require) {
|
|||
// Include the SHIFT+ALT mixin wherever
|
||||
// `KeyboardNavigationMixin` is used upstream
|
||||
AbstractWebClient.include(KeyboardNavigationShiftAltMixin);
|
||||
|
||||
// DocumentViewer: Add support to maximize/minimize
|
||||
DocumentViewer.include({
|
||||
events: _.extend(DocumentViewer.prototype.events, {
|
||||
'click .o_maximize_btn': '_onClickMaximize',
|
||||
'click .o_minimize_btn': '_onClickMinimize',
|
||||
}),
|
||||
|
||||
start: function () {
|
||||
this.$btnMaximize = this.$('.o_maximize_btn');
|
||||
this.$btnMinimize = this.$('.o_minimize_btn');
|
||||
return this._super.apply(this, arguments);
|
||||
},
|
||||
|
||||
_onClickMaximize: function () {
|
||||
this.$el.removeClass('o_responsive_document_viewer');
|
||||
},
|
||||
_onClickMinimize: function () {
|
||||
this.$el.addClass('o_responsive_document_viewer');
|
||||
},
|
||||
});
|
||||
});
|
||||
|
|
|
@ -0,0 +1,22 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<!-- Copyright 2019 Tecnativa - Alexandre Díaz
|
||||
License LGPL-3.0 or later (http://www.gnu.org/licenses/lgpl). -->
|
||||
|
||||
<template>
|
||||
<t t-extend="DocumentViewer">
|
||||
<t t-jquery=".o_modal_fullscreen" t-operation="attributes">
|
||||
<attribute name="class">modal o_modal_fullscreen o_document_viewer o_responsive_document_viewer</attribute>
|
||||
<attribute name="data-backdrop">false</attribute>
|
||||
</t>
|
||||
</t>
|
||||
|
||||
<t t-extend="DocumentViewer.Content">
|
||||
<t t-jquery=".o_close_btn" t-operation="replace">
|
||||
<div class="o_buttons float-right mr8">
|
||||
<a role="button" class="mr8 o_maximize_btn" tabindex="0" aria-label="Maximize" title="Maximize"><i class="fa fa-window-maximize"></i></a>
|
||||
<a role="button" class="mr8 o_minimize_btn" tabindex="0" aria-label="Minimize" title="Minimize"><i class="fa fa-window-minimize"></i></a>
|
||||
<a role="button" class="o_close_btn" tabindex="0" aria-label="Close" title="Close"><i class="fa fa-close"></i></a>
|
||||
</div>
|
||||
</t>
|
||||
</t>
|
||||
</template>
|
|
@ -11,8 +11,8 @@
|
|||
inherit_id="web.webclient_bootstrap"
|
||||
name="App Drawer - Web Client"
|
||||
>
|
||||
<xpath expr="//*[hasclass('o_main')]" position="attributes">
|
||||
<attribute name="t-attf-class">o_main o_chatter_position_{{ request.env.user.chatter_position or 'normal' }}</attribute>
|
||||
<xpath expr="//t[@t-set='body_classname']" position="attributes">
|
||||
<attribute name="t-value">'o_web_client o_chatter_position_' + (request.env.user.chatter_position or 'normal')</attribute>
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
|
|
Loading…
Reference in New Issue