* mail_channel, mass_mailing, twitter, event
- t-install attribute holds the technical name of the module that
needs to be install to use a particular snippet.
- Disable the drag & drop feature for these dummy snippets.
- Move some images to website module.
- Installed snippets display at the top of the list.
- Hide not-installed module snippets if user don't have rights to install module.
Since the new views merge, a lot of design elements were broken. This
was particularly impacting the fields in the editable list view; indeed
the editable list view is not using an inline form view anymore so the
fields in the list were not properly styled as the LESS was still
defined assuming the form view environment (for example the invalid
fields were red for o2m fields in form view but not in editable list
view even though they got the right CSS class).
This commit refactor the LESS following these rules:
- No more division of non-layout and layout rules. Dividing LESS rules
in x_layout.less and x.less was a mistake. Many rules can be
considered to be layout and not layout at the same time, developers
always have to switch from one file part to the other, many CSS
selectors (and rules!) are duplicated for nothing, ...
- Field style is extracted from x_view.less and put in the new
fields.less file. As before, the fields_extra.less will contain the
rules specific to community so that the enterprise repo can override
those by replacing the whole file.
- Many classes have been renamed so that o_form_x_y becomes o_x_y as
many classes can now be applied outside of form view. These classes
should not be used in templates anyway.
The commit also changes the DOM of fields so that it is more minimalist
(no useless parent div, etc).
Input elements are not automatically styled anymore, they have to get
the o_input class explicitely. This allows to fix lots of small style
bugs of previous versions (required monetary field had not the proper
style, readonly m2m tags appeared as editable, ...). This also improves
the LESS code.
The editable list view should also completely stop flickering on chrome
and firefox.
The commit also removes the orange outline on list view dirty cells.
The commit also removes deprecated static xml, LESS and other code.
Notice there are still styles to restore/fix and LESS to improve.
Commit 3c9e6c89e7 made big changes to the
link editor dialog... but also broke many features with it.
Commit 9a1ea6dc08 already fixed some of
them but this commit fixes a bigger one. Indeed, the menu edition
feature was totally broken since the changes. Also, the DOM was messy
which broke form navigation, etc.
This commit also simplifies the LESS which was uselessly big.
The select DOM element which allows to select the template or
the LESS file to edit has been replaced by a select2 element
to improve usability.
- Add search bar
- Allow to add "customized", "unsaved changes" and level indentation
a better way (styled and icons)
- Add debug info (full less url / xml_id) only in debug, in small
The old "HTML" editor now handles LESS edition. The editor has now a
button to switch between XML and LESS edition. By default, it only
displays the odoo files which only appear in the assets_frontend bundle
and in debug mode, it allows to see all the files that influenced the
page design.
The new editor has a new set of options which allows to use it as a
xml editor only or a less editor only if needed.
Also: make the "include bundles" option appear only in debug mode.
Technical details:
- When saving a modified LESS file, an attachment is created with the
full modified content and an extension view xpaths the bundle where
the original file was added to link this attachment instead. This
relies on the fact that qweb, when generating assets bundle,
replaces missing files by the "datas" contents of the ir.attachment's
which have an "url" field equal to the urls it is searching.
- If a LESS error is introduced, the recent changes in assets bundle
generation (see c248674a5c) will not break
the design but only open a dialog on page loading, with the LESS error.
The user can then go to the LESS editor and reset its changes.
This feature code has been started with original work of @pga-odoo
Commit 3c9e6c89e7 made big changes
to the link dialog.
This commit fixes two bugs it introduced:
* The color class preview was not properly set when opening a dialog
(so changing nothing and saving would change the result)
* New btn color classes were wrongly initialized. It did not use less
generation and made the button text always white. This could
introduce bugs when using different colors in themes.
Note: this code is already being refactored anyway.
Specification
=============
- no boxes around fields
- use regular form style for input fields
- don't split page/URL into two fields, just do one URL field, with autocomplete
- Add alpha, beta, gamma, delta and epsilon color in color selection because they are used in mass mailing and themes also.
- Add a selection option with label "L" inside circle for link.
- Add Color selector for choosing button color
- Remov select2 page selector and used jquery autocomplete on same input
- Fix issue of page search in ir.http
Before this commit, it's was only possible to resize the width
of the ace editor when it was on the right side of the screen.
In studio, we need to put the ace editor on the left.
So, we needed to add a new resize bar.
For that, we also add a new option to know the position of the
ace_editor.
We also prevent the width of the ace editor from being recorded
too many times in the local storage for nothing.
This is why we added _.debounce.
* web_editor, website_portal_sale, website_project,
website_project_issue, website_project_issue_sheet
- Use bootstrap grid the right way (missing row)
- Use table-responsive for website portal tables
- Remove web_editor table layout style if inside a table-responsive
in mobile mode
Stop using ugly code for ace editor.
* Really close the ace editor by changing its display property thanks
to the dedicated do_show and do_hide method.
* Make the common part of ace editors (website, web_studio) consistent
so that the extensions are really small.
* Do not do RPC to retrieve data already retrieved (now, there is only
one unique RPC when the editor starts an one RPC per view changed
on save).
* Fix born-dead code so that the website editor starts automatically
if the URL contains its associated hash and loads the correct view
* Better handle errors (previous behavior only worked partially and
only on chrome):
- Jump to the error line and make it red.
- Do not open a Dialog with mostly incomprehensible message but
allow to open it on click of the error marker.
- Do not save any changed file if one contains an error.
- Do not allow formatting a file if it contains an error (show the
error instead).
* Do not use different routes to get the same content (remove the
/website/customize_template_get route as it returns the same
content as /web_editor/customize_template_get route). Note: in
a further commit this route will be refactored.
* In a general way, use consistent method names and behaviors /
comment the code / lint files / ...
* Open the code to extensions (so that it may later load other data
than XML).
Note: this refactoring allowed to fix bugs in previous odoo versions
but this commit message will not detail them.
* add and use preservation mixins to prevent undesired customizations
made by themes
* remove some style preservation code (and use the mixins instead)
* add UI states' colour variables
Change color #a24689 to #875A7B
Commit https://github.com/odoo/enterprise/commit/8ac1c19fac7615fecd51e670f798d13158a4e53c
changed the odoo interface violet by changing the main LESS variable
but forgot there was many direct occurences in XML/HTML/... (for
example for the mobile browser color).
Even if it's community the odoo interface violet is used at many places
(module description, XML demo data, ...).
The commit e59a7fe3ff has moved
the ACE editor from website to web_editor. As some code on ir_ui_view
was used for this widget, the code has also been moved to web_editor.
The content to translate is yellow and the translated content is green
in page translation mode. When the user starts translating a paragraph
it stayed yellow, making it difficult to see the remaining content to
translate when translating a big page.
This commit colors the dirty text in a paler green so that the user can
see the distinction.
* Add the ability to define palettes custom selection.
* Add the ability to define a custom title for the colorpicker dropdown
* Define a custom layout for single (unique) palette layout
* Define overlay color options based on new colopicker for
Cover and Banner text containers
* Define default palettes
* Remove mass mailing template switching system (lemon, airmail, ...)
and replace it with a theme selector which only toggle a different
class on the body.
* Lint JS files.
* Change the way the editor is overridden by mass_mailing in a more
odoo way (put the JS in assets and check on runtime if it must be
applied.
+ fix editor style
+ remove useless code
+ remove odoo template
These colors were usually hardcoded in some snippets (.s_banner for
example) to increase text legibility over background images.
This commit will let the user personalize them.
* Review style of some UI components
* Rename some content
* Define a font-family less variable to be used to avoid that themes
customizations affect the UI. Note: theme should ideally not redefine
the font family of the body but of the #wrapwrap element but this is
done for safety.
* Overwrite other theme's customisations
* Minor style fixes
Before this commit, the focus point the user can move on the image in
the background position configuration dialog was only following the
mouse as we want if the image original width was larger than the dialog
one. This is because the javascript relies on the fact the image takes
100% width of its container. To fix this, the container now does not
take 100% of modal width but the size of its internal image (with a
max-width of 100%).
* web_editor, website, mass_mailing
This menu allowed to scroll to the snippets sections by clicking on
their corresponding icons. It was useless as the sections are not
taking a lot of height. This also appeared buggy as clicking on the
last icon highlighted only the second one as this second one was still
the first section visible on the screen when the last section was
fully visible.
This also added fours buttons to the interface which contains already a
lot of them. Now this is replaced by a title "Add blocks" which makes
the editor cleaner and also improved the performance to enter the edit
mode.
Splitting the summernote colorpicker into bg colorpicker and foreground
colorpicker seems to have been a bad idea as people tend to click on
the recent color button thinking it will open a dropdown.
This commit keeps the design that had been decided for colorpicker
template and do not change the "background-color" snippet option.
However, the colors for background and foreground text changes are
now displayed in an unique dropdown again, with reviewed style.
+ adapt the rte tour
Before commit a8ee18e172, the paragraph alignment dropdown menu was
too large for its content, so it was ugly. After that commit, it became
too small for its content, which is even more ugly.
This fix sets the width of this specific dropdown so that its content
fills exactly in (as with original summernote).
The editor bar is sometimes filled with too many options, and these
hide the save and discard buttons on small screens. To solve the
problem, the description option (which take a lot of space) has now
a max-width and the save and discard buttons are always on top.
Before commit a8ee18e172, the paragraph alignment dropdown menu was
too large for its content, so it was ugly. After that commit, it became
too small for its content, which is even more ugly.
This fix sets the width of this specific dropdown so that its content
fills exactly in (as with original summernote).
The editor bar is sometimes filled with too many options, and these
hide the save and discard buttons on small screens. To solve the
problem, the description option (which take a lot of space) has now
a max-width and the save and discard buttons are always on top.
The less refactoring in 5b65befcd8
wrongly removed the css directive that hide some elements in edit mode.
As a side effect, the product price was appearing twice when editing a
product. Commit 44ca4317a9 tempt to fix
it but removed the edition part.
opw:683343
Prevent the padding of editor .btn's to change when a theme modifies
them (by mistake or not).
Once again, this is a problem of css isolation between the editor and
the website customization. A theme cannot safely, at this time, do
"#wrapwrap .btn" to isolate its rules because it may override some
bootstrap rules like ".btn-group .btn" which would became less
important. It cannot changes the bootstrap variables either as it is
still used by the odoo ui in some places.
There is no safe good solution to "share" bootstrap theming between
odoo ui and website ui. The safest solution is to force the design
of odoo ui elements that may be overridden by themes (in the end,
it's the same as progressively removing bootstrap from odoo ui).
* Always allow to delete a part (and delete parent if empty)
* Show parent options (by displaying the snippet name if any,
"column" for col-* and "Block" otherwise)
* ...
* Mobile preview dialog
* Add page dialog (allow to click anywhere to close the modal)
* Change label for "auto resize" and "resize" options to "auto size"
and "fixed size" and add a checkmark to the currently active one
* Overlay border / Options dialog content
* Hide the odoo navbar after a delay when the editor starts
* Remove dead code + optimization
* Use Dialog API from web module
* Reorganize files
* Correct buggy $() function for snippet option class
* Add comments
* Fix the snippet parent navigation :
If a page contained a three level snippet structure (i.e A contains
B contains C), when editing the following bug occured :
If B or C was selected first, parenting buttons were correctly set.
But if selecting A then C, clicking on the parent lead to going back
on A instead of going on B.
* Fix snippet thumbnail layout
* Better isolate ui css from themes
* MediaDialog image list : prevent displaying empty attachments
* ...
The web_editor.colorpicker defines a series of color buttons which
toggle the bg-* and text-* classes. The problem is that themes can
define new buttons whose bg-* and text-* classes only exist in the
frontend. So these buttons should not be displayed in the backend.
Only solution for the current implementation is to add this ugly rule
(in this backend file) which hides every button and redisplayed the
default ones.
This fix is temporary and has to be improved in next versions.
The editor had been restyled thinking its DOM structure was the same
in every context. The problem is that the message composer editor
DOM structure is different. So, some important style like button
icons were missing in this context.
Kishan Gajjar