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
* 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.
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.
* Bad forward port of saas-9 created a bug where the snippet handles
were wrongly positioned.
* The add job offer button did not work as the modal was marked to
dismiss itself on click (and because this button has not any handler
attached to it; it's the only real link amongst the add buttons).
Bootstrap handles the primary color in a different way than the other
colors. So to not break the backend UI, the o-create-color-classes
mixin has to consider this difference.
Notice that colors management should be further improved in the future.
* Convert some CSS to LESS
* Split/Join LESS files
* Remove duplicates between website and web_editor
* UI improvements
* Allow simple customizations thanks to LESS var&mixins for website
The original commit by fka used to define less variables like this:
@px-4: 4px
@px-8: 8px
The goal was to be able to change the margin values in
media queries for smaller screens.
However, as the less is only compiled once in css, those
variables didn't really help as you couldn't redefine them
from inside a media query and have the less magically
reassign the margins on the fly.
I created less helper functions to be able to easily redefine
the margins for smaller screens from inside media queries.
The task also required to replace the nbsp in the html by the
newly created mr and ml classes.
This is also the first phase of the sass -> less transition.
stefanorigano