summaryrefslogtreecommitdiff
path: root/addons/web/static/src/scss/layout_background.scss
AgeCommit message (Collapse)Author
2020-03-02[FIX] web, base: make company-specific report assets staticLucas Perais (lpe)
Before this commit, the company specific colors and font were implemented by systematically overwriting a "virtual" report SCSS asset file before rendering each report. This caused many issues, forced frequent asset bundles recomputations (performance problem + cache invalidation causing random bugs). And it could simply not work in a multi-company setup where multiple styles are involved, as the asset management could be made not thread-safe. PR #44225 was a first attempt to mitigate the numerous problems by making the asset bundle invalidation less frequent. But the problems were still present and a more complete solution was necessary for multi-company setups. Besides, the design of the bundle forbade making company specific assets. This commit uses a different approach: instead of having a company-specific asset that needs to be constantly updated, a global "multi-company" asset is maintained and included in the report assets. It only needs to be generated when a company style changes, not for every rendering operation. Unfortunately this change cannot be fully performed without updating the template declarations, so it will require an update of the `web` (or `base`) module to be operational. As this represents a rather invasive change in a stable branch, extensive testing was conducted to minimize the effects and ensure proper degradation of features for production deployments where the new code would be deployed without forcing an update of the `web` module: - The report SCSS files were left untouched, to prevent any bundle invalidation, ensuring that old cached assets would remain valid. This means that single-company setups should not see any visible difference after pulling the code (with or without updating `web`). SCSS cleanup will be done later. - Existing Python methods were kept but emptied, to make sure that old templates and code would not crash. - For multi-companies, the last used colors will be applied for all reports until the `web` module is updated. The old behavior was not working correctly anyways, so the degradation is actually limited. - For all setups, changing the colors after deploying this patch will have no effect unless the `web` module is updated. /UPDATED FOR master on top of #44393/: - removed the `res_company.update_scss()` method entirely - fixed the report SCSS styles, as the variable names referred to the old behavior, e.g. "$o-company-primary-color" is nonsense. Renamed to "$o-default-report-primary-color" etc. -- Improves #44225 Forward of #44393 opw-2168623 opw-2171040 closes odoo/odoo#46647 X-original-commit: a5b1421aecf27b1de408434d3bb6d7ac81f57dc3 Signed-off-by: Olivier Dony (odo) <odo@openerp.com>
2019-07-29[IMP] base: Configure document layoutJulien Mougenot
The onboarding modal for setting up the few base fields of a company has now been moved to a wizard It is accessible from the general settings, but also in the onboarding section of sale and account modules. The following company settings are editable with that wizard: - Set report **layout**: The user can chose the overall look of the report. The current choices are : *Standard* (default), *Background*, *Boxed* and *Clean*. - Set company **logo**: Changes the company logo. - Set report **colors**: The user can set the primary and secondary colors of the report through a newly added widget allowing to pick a custom color. When changing the **logo**, colors are automatically set to its most dominant colors. > A "Reset colors" button also triggers the color calculation. - Set report **font**: Changes the overall font of the report. Only Google Fonts are used for enhanced compatibility. - Company **tagline**, also called "header" - **Footer** - **Paper format** - Report **preview**: A mockup of a final report Automatically updates when changing **layout**, **logo**, **colors** or **font** Co-authored by: Julien Mougenot <jum@odoo.com> closes odoo/odoo#33863 Signed-off-by: VincentSchippefilt <VincentSchippefilt@users.noreply.github.com> Co-authored-by: Lucas Perais <lpe@odoo.com>
2019-05-03[FIX] web: Use Noto as fallback to LatoJulien Castiaux
Arabic customers are complaining the Lato font is very odd looking for Arabic scripts. Furthermore, since #32312 Noto is used as the prefered font to display arabic scripts. The classes are used by the "Company Tagline" configured along with the template in use in the general settings. opw-1946109 closes odoo/odoo#33141 Signed-off-by: Martin Trigaux (mat) <mat@odoo.com>
2019-04-03[FIX] point_of_sale: background layout header iframeNicolas Lempereur
When a report with header is displayed in iframe with layout "Background", part of the header maybe outside of the page. For example on /my/invoices portal show of an invoice, the max width report iframe can set at 210mm (+/- 793.7px normally), the header in background layout has `min-width: 900px` so is wrongly centered and may have content outside of shown page (eg. company tagline). The same issue happen when using HTML rendering of the report in backend, but depends on the viewport width. This may be the expected configuration when printing (wkhtmltopdf should unzoom if something was too large to fit) but not when displaying html directly. opw-1915807 closes #32373 Signed-off-by: Nicolas Lempereur (nle) <nle@odoo.com>
2019-02-05[FIX] web: prevent footer linebreak.Rishabh Jadia
The purpose is, prevent the linebreak in the phone when using the document layouts 'background' in the footer. opw-1920752 closes odoo/odoo#30812
2018-12-03[FIX] account,purchase,repair,sale,web: fix report layoutsSébastien Theys
Following BS4 migration and adding sections and notes. ===== Document templates: - Remove margin from <p> in "informations" to allow them to be correctly centered vertically on their container. - Also add a mt- and mb- on their <div> to better handle them going to a new line when there are too many of them. - Add class for section and note to be able to customize them in layouts. - Add class for price_total to be able to customize it in layouts instead of relying on :last-child. - Add "page-break-inside: avoid;" on the "total" table to not split it between pages when it can be avoided. - Fix sale report template "Informations" to use col-auto just like invoice See 6b8d7bb6d68221f77dabb223de4160fdfb87a6f8 ===== Boxed layout: - fix section & note style - fix borders in general - fix the total table Background layout: - fix section style - fix the total table Clean layout: - fix page number vertical align task-1889346 closes odoo/odoo#27782
2018-10-11[FIX] web: improve style header background layoutNicolas Lempereur
As per fpodoo specification: - decrease max width of logo (from max 33% of header width, to max 22%) - decrease font-size of tagline by 30% So logo is smaller, and company address has less probability to get pushed lower (since sum of contents are larger than width). Sizing the header works as follow: If the header is equal to wkhtmltopdf page width or bigger, it is zoomed out until it fits. So with current configuration: - 100% of width is 900px, - company tagline is at maximum 33% (300/900), - company logo is at maximum 20% (200/900), - remaining (company address) is remaining space of 44% (400/900) closes #27641
2018-09-18[MERGE] forward port branch saas-11.4 up to a1b384d66beChristophe Simonis
2018-09-17[MERGE] forward port branch saas-11.3 up to 2de573440ebChristophe Simonis
2018-08-29[FIX] various: clean up portal and reports (sales and invoices)Sébastien Theys
The goal of this commit is to fix the various views and reports of sales and invoices. ====== Portal ====== Fix breadcrumbs Fix BS4 issues, alignment of various elements Better auto resize of the invoice iframe Fix invoice list for draft invoices Fix previous/next document pagers Remove unnecessary monetary widgets (not needed when using t-field if the field is Monetary) Standardize invoice and sale routes: - especially when related to displaying: html, pdf (print and download), text - by using the get_portal_url() also for invoices Add the total on the left column of sales order ================ Section and note ================ Improve general style: - notes in italics - sections: less padding, darker background, no borders ========= Demo Data ========= Fix sales order demo data to appear for the admin (instead of system) PR: #25997 task-1869469
2018-07-27[REF] *: BS4, adapt col-related classesqsm-odoo
col-lg-* -> col-xl-* col-md-* -> col-lg-* col-sm-* -> col-md-* col-xs-* -> col-* col-lg-offset-* -> offset-xl-* col-md-offset-* -> offset-lg-* col-sm-offset-* -> offset-md-* col-xs-offset-* -> offset-* col-lg-pull-* -> order-xl-1 col-md-pull-* -> order-lg-1 col-sm-pull-* -> order-md-1 col-xs-pull-* -> order-1 col-lg-push-* -> order-xl-2 col-md-push-* -> order-lg-2 col-sm-push-* -> order-md-2 col-xs-push-* -> order-2
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-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.