- JS Modals were not correctly built anymore, their .modal-body element
was duplicated and many without-effect JS lines were introduced (as a
side effect, the form view design was broken when inside modals)
- Tests were changed to make bugs go unnoticed. For example, the media
dialog functionnality was entirely broken because the .modal-dialog
element was not receiving the correct class anymore.
- The JS translation function is _t, not _
- Do not use the <title/> tag as a regular DOM element, it is meant to
be unique, in the <head/> section
- CSS rules were added to the utils.scss file, which is meant to contain
functions and mixins, otherwise, the rule is duplicated in every asset
- Some icons were still broken, as missed by https://github.com/odoo/odoo/commit/f90cf060a3cfeb37a67bec83264c0aaab8892b56
- Tests were changed to use [role="dialog"]/footer/header in their
selectors without any reason, this commit restores some of that to
avoid rebase conflicts with the BS4 work.
- ...
Note: other elements should still be discussed, like the direct use of
the 'o_form_label' class in views definition... but those do not cause
direct problems.
Clicking outside the new content options should close the overlay.
Every options are triggering a JS event (mostly opening a modal) that works
fine.
But the 'New Job offer' options is simply a href link which is not going
through anymore since there was a call to `preventDefault`.
opw-1860196
The purpose of this commit is to hide the Create menu when the user click on
any area other than the link icons.
Note: It was already the case in V10.0 since the options were inside a modal.
Natively bootstrap would close the modal when clicking outside of it.
We lost that behavior while refactoring in V11.0 with 297297696 that
replaced the modal by a pseudo-dropdown
opw-1860196
Closes#25389
Description of the issue/feature this PR addresses:
Accessibility improvements forbids the use of the syntax
`<i class="fa fa-check"/> Some text`
to create a labelled icon. But, by this, some fonts are changed.
Desired behavior after PR is merged:
The old syntax can be used.
Today, Odoo is really tricky to use without seeing the screen, it must be improved to be usable.
This PR forbid to use labels without a "for" attribute, add some title, rule and aria attributes in HTML. With that, Odoo will be fully usable with a screen reader.
* [IMP] Labels must have a for attribute. Improve accessibility.
* [IMP] Better error message when trying to read a missing cached value
* [FIX] Add some aria-label and title attributes for screen readers.
* [FIX] Template name is not included in the error message in case of SyntaxError in QWeb
* [FIX] Improve the Tour failed at step error message to be more explicit.
* [IMP] Add aria-labels
* [FIX] Add missing aria-label on failing test
* [IMP] aria-hidden means hidden. Fix all bad aria-hidden and hide aria-hidden for all.
* [IMP] Color names on kanban views and many2many tags
* [IMP] Add some checks on views for accessibility.
* [IMP] Add `alt` attribute on `img` tags.
* [IMP] Add aria-label and title on non-described icons
* [IMP] Add button role to widgets with btn class
* [IMP] Translate aria and formatted attributes.
* [IMP] Remove wrong aria-labelledby
* [IMP] Add menu role on dropdowns
* [IMP] Buttons must be focusable
* [IMP] Add aria attributes on progress bars
* [IMP] Improve accessibility of basic widgets
* [IMP] Change main layout to more semantic tags
* [IMP] Add menuitem role when missing
* [IMP] Remove wrong role='presentation'
* [IMP] Improve accessibility of tab panels
* [IMP] Add aria-invalid on invalid fields
* [IMP] Add aria-sort on ordered columns
* [IMP] Add role on alerts
* [IMP] Use dialog role, header, main and footer tags for modals
* [IMP] Add labels on o_status
* [IMP] Improve accessibility of kanban view with feeds and articles
* [IMP] Add alerts in case of new messages
* [IMP] Add widget, navigation or img role to aria-labelled items
* website, website_mail_channel
Before this commit, when using the 'number of columns' option from a
column's snippet editor, the snippet overlay remained floating in the
void if the current column was removed by the option. This was because
the option did a simple "destroy" on the column without caring about
the snippet editors.
This commit introduces a new event which can be trigger_up'ed to ask
the editor to properly remove a DOM portion (destroy related editors,
call the 'onRemove' callbacks, ...).
Previously, customizing the website footer was not very easy. This
commit will allow users to customize the footer like any other
snippet area.
There are several behavior changes, as mentioned below:
- Removed toggles 'Automatic Footer' and 'Payment Icons' from the
Customize menu
- Language Selector was moved near the 'Copyright' section of the footer
and features a dropdown (dropup technically) to select the language
- Moved some footer links from various modules to top menu
List of the added menus / changed menus:
(a) Resellers (new menu for previous footer link 'Resellers')
(b) References (new menu for previous footer link 'Our References')
(c) Forums (renamed from 'Forum', as a replacement of 'Forums'
footer link, showing all the forums instead of 'Help', as there
is no link available to all forums after this commit)
(d) Live Support (new menu for previous footer link
'Livechat Support')
(e) Mailing Lists (new menu for previous footer link 'Mailing List')
(f) Members (new menu for previous footer link 'Members')
- Links which were already available as a website menus (Presentations,
Jobs, Events, News, Documentation, etc) are simply removed
Technical Notes:
- Introduced a new template called 'brand_promotion' in website.
This will help to avoid adding redundant footer content (like
copyright, language selector etc) from several modules (website_sale,
website_event, website_quote, etc) while the only intention is to
replace module page links.
- Removed summernote related fix in portal.less (caused by xpath)
because footer is now customizable and added padding to structure
instead of footer itself so that bg-color/img can be applied on
whole footer.
- Few of the tours are improved to drag and drop snippets at proper
places and not inside the footer.
- Used Flex in copyright portion of footer, so that text will always be
horizontally centered (Some themes have different padding for buttons,
etc, so if we don't align text dynamically, it has to be managed in
particular theme and in particular layouts like full-screen / boxed.
And if someone changes height of this portion, we have to re-design
this portion again, etc).
task-38069
Closes https://github.com/odoo/odoo/pull/22298
Co-authored-by: Dharmraj <dja@odoo.com>
With this commit, it is now possible to delete a page directly from it's page
properties dialog.
Before this commit, you had to go into the page manager and then find your page
that could take some time.
task-1850578
Closes#24861
With this commit, we introduce a better screen to manipulate the search
view in a mobile device.
Note: most of this work was initially done by suh-odoo, then was adapted
and moved to community by myself.
task 31464
This commit:
1. removed the possibility to create page from the menu manager.
The usability of this feature wasn't great since create menu as a new page
would redirect to that newly created page without saving the menu manager
state.
Plus, there is already the 'NEW' button on the navbar to create a new page,
the menu manager should, as its name hint, only manage menus.
2. Handle a new case (officially at least) of menu: menu container.
Those menu are simply menus with '#' as URL. It will be usefull to create a
menu as a dropdown list container.
Note: We should take care of a menu's URL being updated to '#' to avoid the
menu's page URL to be also edited to '#'.
opw-1825883 & opw-1824263
Unlike LESS, SCSS variables are not lazy loaded. Our system has thus
to be updated. This commit creates new templates which are t-called
in assets bundles (to replace the old less_helpers template):
- web._assets_utils: regroups the mixins and functions which *can*
(and so should) be available in every asset bundle
- web._assets_primary_variables: regroups the variables (or mixins
used as variables) which *can* (and so should) be available in
every asset bundle
- web._assets_secondary_variables: same as above but provides an
environnement where all the 'primary' ones are accessible. This is
for example useful to handle the community/enterprise split:
// Community primary variables
$o-pink-color: pink; // enterprise color
$o-brand-primary: blue;
// Enterprise primary variables
$o-brand-primary: $o-pink-color;
// Community secondary variables
$o-my-darker-primary: darken($o-brand-primary, 5%);
=> If there was only one variable template, enterprise edition would
have been able to define its primary color at the end but the
darker primary would not have been updated. Using the "!default"
system and putting enterprise definition above would not have
solved the problem as the $o-pink-color would not have been
accessible.
- web._assets_backend_helpers: regroups the variables, mixins and
functions which *can* (and so should) be available in the backend
asset bundle only. This is especially (only?) useful for bootstrap
variables overriddes.
- web._assets_frontend_helpers: regroups the variables, mixins and
functions which *can* (and so should) be available in the frontend
asset bundle only. This is especially (only?) useful for bootstrap
variables overriddes.
Note: bootstrap variables are not accessible in any of those anymore.
If you have variables that should depend on bootstrap, you have 3
solutions:
- Find another way: your variable is probably useless, use bootstrap
variables directly or create a variable that will influence the
value of bootstrap variables. E.g. instead of declaring:
`$myvar: $bootstrapvar * 3`
and using $myvar alone, declare:
`$myvar: 3` and use `$myvar * $bootstrapvar` where needed.
- Declare a copy of the bootstrap variable and use that one. In that
case, you should also force-set the real bootstrap one to be sure
they match (this should be done in appropriate templates mentioned
above). E.g.
```
$o-boostrapvar: 5;
...
$boostrapvar: $o-bootstrapvar;
```
- Set your variable to null and set it to your bootstrap expression
in the file you will need it (where bootstrap variables are accessible)
without forgetting to add the !default flag to allow overriddes.
```
$myvar: null;
...
$myvar: $bootstrapvar * 5 !default;
```
This commit also partly changes the variable names to follow the
convention:
$o-<app_id>-<name> where 'app_id' is the current's app name or a
meaningful unique identifier ("theme" for all themes for example, as
no multiple themes can be installed).
Convert content so that the assets compile on app installation. The
style is still broken after this as the variables/mixins/... are not
defined in the right order (as it did not matter in LESS but does in
SCSS).
This commit basically changes:
- Variables: @var_hello -> $var-hello
- Mixins: .mixin_world() {} -> @mixin mixin-world {}
- Classes used as mixin: .my_class() -> @extend .my_class
- Here there were no other solution than to convert the use of
a mixin call by the use of an extend as a first approximation
- LESS functions -> SCSS functions (e.g. fade -> rgba)
- Move first variable definition before the variable is used
- Still need to make sure last variable definition is at the
right place
The 'oe_link' class is not linked to any style. The class is
automatically converted to 'btn-link' for <button/> elements but this
will not be done on <a/> elements as they are (nearly) unprocessed
node during views rendering.
Also there is minor difference between a '.btn-link' element and a
<a/> element anyway (and maybe there should not be at all).
Note: original work of @dbh-odoo was to have + and - buttons on the
editor overlay but specs changed to use a standard dropdown (the work
of @dbh-odoo was thus adapted for this).
See task-46094
Closes https://github.com/odoo/odoo/pull/22197
Move zoom next the original picture
Disable it if same img and max size with ratio < 1.5
Allow to enable zoom automatically
...
Task-33499
Co-authored-by: Jérémy Kersten <jke@odoo.com>
This commit reverts part of f5912cb since the spec changed afterwards.
Unpublished page will have a red toggle, which even if it is small should be
enough to draw user attention, and not a ribbon anymore.
Task-44005
Before this commit, 2 usability issues were reported:
1. Some people would get stuck with unpublished content without even knowing it
since they would not understand the page is unpublished.
2. People would have a hard time finding the publish button (small toggle on
the navbar).
Now:
1. We now display a red ribbon on the top right corner specifying the page is
unpublished. Hopefully it can't be missed.
2. This publish button will be more visible for unpublished content since it
will be red (danger) color. Hopefully people will notice it at first look.
Note: It is implemented in a generic way so any 'o_switch' can be turned
into this version by simply adding the 'o_switch_danger' class to it.
task-44005
Closes#23282
Before this commit:
1. The date would be displayed as UTC regardless of the user timezone.
2. The date would be sent to the backend in the browser timezone
Now we correctly take the user timezone into consideration when handling date.
Step to reproduce:
- Install a second language where time format is: %H.%M.%S or %H,%M,%S
(eg: Finnish, Bulgarian, Albanian )
- Set it as website default's language
- Open page properties dialog on any page
- The date looks correctly displayed but it is in fact the UTC hour and not
the user timezone date. (eg: 2 hours missing in Albanian case, it would
show '2018-Pri-05 02.11.02.' instead of '2018-Pri-05 04.11.02.')
- If you save, it will crash since it will send the wrong date format to the
backend that is expecting 'YYYY-MM-DD HH:MM:SS' format.
Closes#23500, closes#23566
- Go to 'Contact Us' page
- Edit, then try to change company data
- A dialog window asks if the user wants to edit the company data
- Confirm
It redirects to an unexisting page.
opw-1825662
Christophe Simonis