summaryrefslogtreecommitdiff
path: root/addons/web_editor/static/src/less/web_editor.ui.less
AgeCommit message (Collapse)Author
2018-04-18[REF] *: rename all LESS files to SCSSqsm-odoo
This is a simple renaming without adaptation.
2018-03-22[MERGE] forward port branch 11.0 up to 39d9c362c5bChristophe Simonis
2018-03-21[FIX] web_editor: set correct zindex on translation navbarPratima Gupta
Commit c06f0f3a352 changed the base navbar zindex. But the navbar of the translation mode still had old zindex values making the navbar invisible, in fact under the base navbar. task-1804662
2018-01-16[REF] web_editor, website(_*): refactore media & link dialogsqsm-odoo
* blog, gengo, sale
2018-01-10[REF] web_editor, website: LESS simplification and correctionqsm-odoo
The variables.less file was producing CSS which was then multiplicated by the number of bundles (see less_helpers). Also simplify some LESS.
2018-01-10[REF] portal, website, web, *: improve LESS splitqsm-odoo
* website_sale
2018-01-10[REF] portal, website, web: rename/regroup LESS filesqsm-odoo
2018-01-08[IMP] web_editor, *: change height/margin system to padding systemqsm-odoo
* web, website, mass_mailing Before this commit, the editor allowed defining the margin of some elements and the height of some elements. There were three main problems with this system: 1) When an user dragged the arrow, he often expected to change the size of the element while he was in fact changing the margin 2) When changing the margin, you increase the space between two elements but with a white space (while most users want a space with the same color of the block they are resizing = padding) 3) When changing the height, the user was able to hide snippet parts and the height was not consistent accross screen sizes Now, the only thing you can edit is padding. There is only one arrow for each direction, which allows increasing spacing and consistent dimension at the same time. The only feature that is lost with this change is the ability to control vertical alignement of colored columns. This is not a problem as colored columns are rare in our current snippets and there still have the possibility to add margin classes by hand if necessary (there are also plans to control vertical alignement another way). Note: margin classes are kept for compatibility.
2017-09-30[FIX] web_editor: open customize menus to the left/rightKishan Gajjar
Open customize options menus to the left if there is not enough space on the right.
2017-08-16[REF] web_editor, website, *: complete refactoringqsm-odoo
* mass_mailing, payment, point_of_sale, portal, survey, web, web_tour, website_blog, website_crm_partner_assign, website_event, website_event_questions, website_form, website_forum, website_gengo, website_hr_recruitment, website_links, website_mail, website_mail_channel, website_mass_mailing, website_quote, website_sale, website_sale_options, website_slides, website_twitter This commit reviews the whole "JS side" of the web_editor and website apps. This is a first step to be able to improve them with new and better functionnalities; this commit is not supposed to change any visual behavior. The main goal was to achieve a structure similar to the backend one. Now, the frontend side also has a root widget (like the WebClient) and all other widgets are attached to it one way or another. This allows the benefits of using the 'trigger_up' functionnality for example. As RPC are now mainly done with the `this._rpc` functionnality (being possible thanks to the parent hierarchy), the frontend will also be possible to test thanks to QUnit in a future update (besides the "text" editor side which still requires a refactoring to be able to do that). --- Here are some of the changes: (-) conventions and documentation The code has been updated to follow JS conventions and a lot of code has been commented (around +2000 lines of comment). This also means that lots of functions have been renamed to use camelCase or simply to make their name understandable. See https://github.com/odoo/odoo/wiki/Javascript-coding-guidelines. (-) deprecated: web_editor.base The "web_editor.base" module has been split and does not force the modules which require it to wait for DOM ready anymore. This was indeed slowing loading times, but also prevented to use some modules in some contexts (see the LESS editor use in web_studio which is the subject of another task). Now the "editor context" can be got thanks to the "web_editor.context" JS module with its "get" function. The "web_editor.base" module should probably not be used anymore (see its code and recent updates). (-) new: web.dom_ready If a JS module should wait for the DOM to be ready to be executed, a new JS module has been created: "web.dom_ready". This should always be used in a module which only want to instantiate stuff. Do not extend (or worst, include) classes after DOM ready. (-) website.website The "website.website" module has been split. "website.website" does not return anything useful anymore, it just initialize some miscellaneous stuff, without waiting for the DOM to be ready. You might want to check "website.utils", "website.content.compatibility" or `WebsiteRoot`. Also `website.form` has been deleted (use `this._rpc`), so has been `website.error`. `website.prompt` will be removed in a future update to be replaced by `Dialog.prompt`. (-) widgets are great Many classes which were not widgets are now widgets. This allows them to use the 'events', the 'xmlDependencies' and the 'this._rpc' features for example. Here are some of the main ones: - Snippet options: these were classes with a `$el` for the menu element and `$target` for the customized element. This is still the case but following standard `Widget` structure (one exception: using `this.$(...)` searches in the `$target` as before this update). - Snippet animations: instead of class instances with a `$target` element which can be `start` and `stop`, these are now standard widgets which can be `start` and `destroy`. `this.$target` is an alias to `this.$el` for ease of compatibility. - Snippet editors: instead of class instances in charge of an editor overlay, these are now widgets. Each "child" snippet editor is properly attached as a "child", which allows editors to communicate and to be properly destroyed. (-) root widgets and website navbar The frontend is different of the backend. In the backend, the page has an empty <body/> element and all the components are instantiated from parent to children (i.e. the `WebClient` is instantiated and is in charge of instantiating the `ControlPanel`, etc). The frontend cannot work like that on page loadings as they are way more frequent than in the backend and we do not want them to flicker. A frontend page is loaded as a <body/> element which already contains the website navbar and its menus and the whole content page. JS code has to be "attached" to these existing elements. This is possible thanks to the `RootWidget` instances and the specialized `WebsiteRoot`, `IframeRoot` and `WebsiteNavbar` (see code for details). (-) lazy loading No more (or at least a lot less) XML/JS has to be loaded on page loading, thanks to the use of the `Widget.xmlDependencies` feature. XML which have to be lazy loaded is loaded only on related Widget instantiation if necessary, which allows to execute a lot of JS code before the DOM is ready and to start many widgets on DOM ready (not later). A visual benefit of this is clicking on the 'edit' button as soon as it is possible: before this commit, this was sometimes not doing anything as event handlers were not binded yet. Still a possible exception: loading the session and locales. This may be asynchronous stuff which is still required before widget instantiations but this will be the subject of another task. (-) deprecated code and code location More than reviewing code and organizing it, many apparent dead code was removed. More importantly, mislocated code was put in the right app. This is the case for snippet animations which is a concept for website apps but was defined in the web_editor app, or some translation concepts which were part of website but should have been part of web_editor. --- There are probably more things to say about this commit but I will let the comments speak for those.
2017-07-10[IMP] web_editor: improve margins system UXstefanorigano
- Clearly show margins' size on editing - Top margin icons/cursors: by an user point of view, adding a margin-top will move the content 'down', so change handler's icons and cursors accordingly - Highlight handles during editing and if previously edited - Vertically center handle's icon if enough room is available
2017-07-07[MERGE] forward port branch saas-16 up to 0f2b2c4e2b9Christophe Simonis
2017-07-05[FIX] web_editor: style if website not installedNicolas Lempereur
web_editor can be installed without website, thus missing needed CSS causing e.g the widget sidebar to overlay and hide the mass mailing content if website is not installed. This fix implement a simple middle ugly solutions, but doing something more in stable would be an hassle (for example in 88c2b684 the #wrapwrap CSS is included in report module). opw-748975 closes #18005
2017-07-04[IMP] web_editor, website(_*): show all snippets even if module is not installedKishan Gajjar
* 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.
2016-09-23[IMP] web_editor: mark dirty text to translate with the translated colorqsm-odoo
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.
2016-09-20[IMP] mass_mailing, web_editor: improve themes/snippets/templatesstefanorigano
2016-09-07[IMP] web_editor, website: add colorpicker palettes customizationsstefanorigano
* 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
2016-09-07[IMP] web_editor: change design of transparent colors palettestefanorigano
* Add a "transparent" button * Add a special background for transparent background buttons + Some minor colorpicker design change
2016-09-05[REF] mass_mailing: convert templates to themes and clean codeqsm-odoo
* 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
2016-09-05[REF] mass_mailing: change/add snippets/themes layout/designCsaba Fazekas
* Airmail/Lemon/Tech template/Odoo template * Add bg color option * Clean snippets
2016-09-05[REF] mass_mailing: change theme/template selection and add new snippetsChristophe Matthieu
* remove theme/template selection screen for mass_mailing * allow to use different layout on edition * add new snippets
2016-09-05[FIX] web_editor: saved mass_mailing have small difference with editionChristophe Matthieu
2016-08-31[REF] web_editor: editor UI style and stability improvementsstefanorigano
* 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
2016-08-31[IMP] web_editor: force web_editor overlay option buttons to stay on one lineqsm-odoo
Before this commit, when the snippet was too narrow, the buttons broke over multiple lines.
2016-08-19[IMP] *: replace snippet sections menu by a titleqsm-odoo
* 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.
2016-08-19[IMP] web_editor: come back to a more regular summernote colorpickerqsm-odoo
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
2016-08-19[FIX] web_editor: paragraph dropdown styleqsm-odoo
Before commit a8ee18e172d406e846764b1dd79c65ee270ca7f4, 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).
2016-08-19[FIX] web_editor: make save/discard btns visible when too many optionsqsm-odoo
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.
2016-07-29[MERGE] forward port branch saas-11 up to 3aea814Christophe Simonis
2016-07-25[FIX] web_editor: secure the paddings of btn in the editorqsm-odoo
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).
2016-07-04[IMP] website,web_editor: snippet option li iconsqsm-odoo
+ Some content changes
2016-07-04[IMP] web_editor,website: snippet options (parent & deletion)qsm-odoo
* 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) * ...
2016-07-04[IMP] website,web_editor: review style / contentqsm-odoo
* 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
2016-07-04[REF] web_editor: code refactoring and simplificationqsm-odoo
* 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 * ...
2016-05-26[FIX] web_editor: display background color to translateChristophe Matthieu
2016-05-02[FIX] web_editor: backend editor styleqsm-odoo
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.
2016-04-06[FIX] web_editor, website: snippet handles and add job offerqsm-odoo
* 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).
2016-04-01[MERGE] forward port of branch saas-9 up to f4d1adcChristophe Simonis
2016-02-24[REF] web,web_editor,website,report,mass_mailing,mail: LESSqsm-odoo
* 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
2016-02-24[REF] website,web_editor: complete restylingstefanorigano