summaryrefslogtreecommitdiff
path: root/addons/web/static/src/scss/control_panel.scss
AgeCommit message (Collapse)Author
2018-12-07[REF] web: move ControlPanel inside controllers/actionsGéry Debongnie
This branch introduces a large-scale reorganization of the component tree generated by the web client. The short version is that now, the control panel is a child of the view controller and no longer a sibling. Graphically (and simplified), we go from this: webClient / | \ ... ... actionManager / \ controlPanel viewController / \ to this: webClient / | \ ... ... actionManager | viewController / | \ ControlPanelController / \ CPRenderer CPModel The motivation is that this work moves the code where it should be. Before this commit, it was kind of weird to have code in the controllers to render buttons outside of their root node (in renderButtons). Also, the action manager had to take care of coordinating search view states between view transitions. So, this work simplifies the code. It also makes it easier to extend. We see day after day that Odoo needs to take care of more complex UI needs, and in many cases, these needs were quite difficult to implement (we prefer spaghettis in our plates, not in our code). The changes in this branch should open the way to implement these features. For example, - it will now be easy to add the possibility of views (for example, the search view or a new ControlPanel view) to add custom buttons (of type action or object) in the control panel. - Another need will be to serialize/ restore the state of the search view across action boundaries (needed by the dashboard). - Another example is the possibility for views to customize easily the presence/absence of sub menus (filters/groupbys/favorites/ time range/...) - Another need is an easier way for views/client action to customize their control panel. This commit also contains a large rewrite of the search view (so it is more inline with our architecture and easier to maintain). Part of task 1893568 Co-authored-by: Aaron Bohy <aab@odoo.com> Co-authored-by: Mathieu Duckerts-Antoine <dam@odoo.com> Co-authored-by: Martin Geubelle <mge@odoo.com>
2018-07-27[REF] *: BS4, adapt tables (and list view)qsm-odoo
`table-condensed` -> `table-sm` Also SCSS variables were renamed. Also restore list view design.
2018-07-27[REF] *: BS4, review breadcrumb structureqsm-odoo
Now, the 'breadcrumb-item' class has to be put explicitely on breadcrumb items.
2018-07-27[REF] *: BS4, review color systemqsm-odoo
Odoo used to declare two main colors: primary and optional (which are purple and turquoise in enterprise). Those were respectively assigned to the 'primary' bootstrap variable and the 'btn-primary' bootstrap variable. BS4, however, does not allow to have a different primary color for buttons. Instead, the 'primary' color is used for all 'primary' related components and utility classes, same as for all other colors. So, if we want to keep our enterprise buttons green, our 'optional' colors had to become our 'primary' color. The old odoo primary is then renamed to the 'odoo' color. The palette of grays is now larger by default and is numbered from 100 to 900 alongside the $black and $white variables. The equivalence for older variables and the way we used them is: $gray-darker -> gray 900 (unused before) $gray-dark -> gray 900 $gray -> gray 700 $gray-light -> gray 600 $gray-lighter-darker -> gray 400 (the old variable was created by us) $gray-lighter-dark -> gray 300 (the old variable was created by us) $gray-lighter -> gray 200 Fortunately, the 'lighter' variations we created fit well in the default BS4 system ! Unfortunately, our $gray-lighter which carried the same function as $gray-200 (see above) is very close to the new default $gray-100 and quite distant from the new $gray-200. This will be handled in the next commit.
2018-07-27[REF] *: BS4, rename btn-default to btn-secondaryqsm-odoo
BS4 "btn-default" class was replaced with "btn-secondary", which makes more sense.
2018-07-27[REF] *: BS4, adapt media queriesqsm-odoo
media queries that target a specific screen size handled by bootstrap have now a more convenient way to be defined: ``` @​media (min-width: $screen-sm-min) { ... } -> @​include media-breakpoint-up(sm) { ... } ``` ``` @​media (max-width: $screen-sm-max) { ... } -> @​include media-breakpoint-down(sm) { ... } ``` ``` @​media (min-width: $screen-sm-min) and (max-width: $screen-sm-max) { ... } -> @​include media-breakpoint-only(sm) { ... } ``` ``` @​media (min-width: $screen-sm-min) and (max-width: $screen-md-max) { ... } -> @​include media-breakpoint-between(sm, md) { ... } ``` Also, bootstrap has changed the values for its default screen sizes: ------------------ | BS3 | BS4 | ------------------ 0 | XS | XS | -> Portrait Mobile 576 | / | SM | -> Landscape Mobile 768 | SM | MD | -> Portrait Tablet 992 | MD | LG | -> Landscape Tablet / Small Desktop 1200 | LG | XL | -> Desktop ------------------ While it is possible to configure BS variables to behave as BS3, we took the decision to keep the BS4 variables untouched. BS4 system seems indeed better and having the purest bootstrap possible is better for Odoo to be used as a framework.
2018-07-27[REF] *: get rid of vendor prefixesqsm-odoo
BS4 do not provide vendor prefixes scss mixins anymore as it is meant to be used with the 'autoprefixer' library. As we only support the last version of every major browsers in Odoo, we took the decision to not use the library as it was also complex to integrate in Odoo. We decided to do the library's work by hand if it ever become necessary.
2018-07-25[IMP] base_import, web: add view switcher and h 'Import' button in mobileHiral Bhavsar
As there are a few chance that someone will import something on a mobile view. So, we hide the button 'Import' in a mobile view. For mobile view, we added a view switcher button and it'll display a list of views buttons. Also set active view's icon as its icon. Related to Task: 1857696 Co-authored-by: Mohammed Shekha <msh@openerp.com>
2018-05-23[IMP] web,mail: improve search view for mobile devicesGéry Debongnie
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
2018-04-25[IMP] base(_import),web: mute Add/Create button in x2mDipali Tank
... by setting it 'btn-default', because users hesitate between that button, and those in the control panel. Task 32950 Co-authored-by: dbh <dbh@odoo.com> Co-authored-by: aab-odoo <aab@odoo.com>
2018-04-18[REF] *: review scss variables handlingqsm-odoo
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).
2018-04-18[REF] *: convert less content to scss contentqsm-odoo
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
2018-04-18[REF] *: rename all LESS files to SCSSqsm-odoo
This is a simple renaming without adaptation.