diff options
Diffstat (limited to 'addons/web/static/src/scss')
| -rw-r--r-- | addons/web/static/src/scss/base_document_layout.scss | 162 | ||||
| -rw-r--r-- | addons/web/static/src/scss/colorpicker.scss | 4 | ||||
| -rw-r--r-- | addons/web/static/src/scss/fields.scss | 9 | ||||
| -rw-r--r-- | addons/web/static/src/scss/fonts.scss | 24 | ||||
| -rw-r--r-- | addons/web/static/src/scss/layout_background.scss | 26 | ||||
| -rw-r--r-- | addons/web/static/src/scss/layout_boxed.scss | 22 | ||||
| -rw-r--r-- | addons/web/static/src/scss/layout_clean.scss | 35 | ||||
| -rw-r--r-- | addons/web/static/src/scss/layout_standard.scss | 19 | ||||
| -rw-r--r-- | addons/web/static/src/scss/report.scss | 5 |
9 files changed, 272 insertions, 34 deletions
diff --git a/addons/web/static/src/scss/base_document_layout.scss b/addons/web/static/src/scss/base_document_layout.scss new file mode 100644 index 00000000000..20378848e26 --- /dev/null +++ b/addons/web/static/src/scss/base_document_layout.scss @@ -0,0 +1,162 @@ +.o_document_layout .o_group { + display: flex; + .o_document_layout_company { + flex: 5; + @include media-breakpoint-up(sm, $o-extra-grid-breakpoints) { + max-width: 50%; + } + img { + max-height: 100px; + } + .o_document_layout_colors { + vertical-align: middle; + display: flex; + flex-direction: row; + align-items: center; + .o_field_widget { + width: 30px; + margin: 0 5px 0 0; + } + .btn { + padding: 0; + margin-left: 10px; + .o_form_label { + height: 30px; + font-size: 18px; + margin: 0; + cursor: pointer; + } + } + } + select.o_input { + height: 25px; + } + + } + .o_document_layout_preview { + flex: 4; + border: 1px solid; + border-color: gray; + margin-right: 12px; + padding: 12px; + display: flex; + min-height: 420px; + flex-direction: column; + } +} + +.o_document_layout_preview_logo img { + padding-left: 5px; + max-height: 45px; +} + +.o_document_layout_preview_html { + flex: 1; + .o_readonly { + height: 100%; + } + .o_preview_layout { + display: flex; + flex-direction: column; + height: 100%; + } + .header { + padding: 0 10px; + border-top: 1px solid; + h2 { + margin: 40px 0; + } + .o_layout_information { + margin-bottom: 20px; + } + } + .article { + flex: 1; + padding: 0 10px; + table th, table td { + text-align: right; + &:first-child { + text-align: left; + } + } + } + .footer { + border-top: 1px solid; + } + .o_preview_background_layout { + background-image: url(/base/static/img/bg_background_template.jpg); + background-size: cover; + background-position: bottom center; + background-repeat: no-repeat; + .table tbody tr:nth-child(odd) { + background-color: rgba(220, 205, 216, 0.2); + } + .row table tbody tr:nth-child(odd) { + background-color: transparent !important; + } + .footer { + border-bottom: 1px solid; + } + } + .o_preview_clean_layout { + .header { + border: none; + } + .article table { + border-bottom: 1px solid; + border-top: 1px solid; + margin: 0; + } + .clearfix table { + border-top: none; + .o_subtotal td { + border: none; + } + } + thead th { + border-top: 1px solid; + text-transform: uppercase; + } + } + .o_preview_standard_layout { + .o_subtotal, .o_total { + td { + border-top: 1px solid; + } + } + } + .o_preview_boxed_layout { + table { + border: 1px solid gray('700'); + thead th { + border: 1px solid gray('700'); + text-transform: uppercase; + } + tbody tr td { + border-top: none; + border-right: 1px solid gray('700'); + } + } + .o_subtotal td, .o_total td { + border-right: none; + border-top: 1px solid gray('700'); + } + .o_total td { + strong, span { + color: white; + } + } + } +} + +@media (max-width: 620px) { + .o_document_layout .o_group { + flex-direction: column; + } +} + +@media (max-width: 992px) { + .clearfix td { + display: flex; + } +} diff --git a/addons/web/static/src/scss/colorpicker.scss b/addons/web/static/src/scss/colorpicker.scss index ade14ca9c7c..ab8d2fb4a90 100644 --- a/addons/web/static/src/scss/colorpicker.scss +++ b/addons/web/static/src/scss/colorpicker.scss @@ -53,12 +53,12 @@ } } .o_color_picker_inputs { - display: -webkit-flex; + display: flex; flex-direction: column; & > .form-row { flex: 1; .col { - display: -webkit-flex; + display: flex; flex-direction: column; justify-content: space-around; } diff --git a/addons/web/static/src/scss/fields.scss b/addons/web/static/src/scss/fields.scss index 120896dceee..d7c332d5369 100644 --- a/addons/web/static/src/scss/fields.scss +++ b/addons/web/static/src/scss/fields.scss @@ -447,6 +447,15 @@ } } } + + & > .o_field_color { + border: 2px solid rgba(0, 0, 0, 0.25); + border-radius: 100px; + width: 30px; + height: 30px; + margin: 0 5px 0 0; + display: inline-block; + } } span.o_field_copy:empty { diff --git a/addons/web/static/src/scss/fonts.scss b/addons/web/static/src/scss/fonts.scss index 0a8793c9a18..2324883532b 100644 --- a/addons/web/static/src/scss/fonts.scss +++ b/addons/web/static/src/scss/fonts.scss @@ -65,3 +65,27 @@ $lato-font-path: '../fonts/lato'; @include lato-font-pair('Reg', 400); @include lato-font-pair('Bol', 700); @include lato-font-pair('Bla', 900); + +// ------------------------------------------------------------------ +// Google fonts +// ------------------------------------------------------------------ +$google-font-path: '../fonts/google'; + +@mixin google-font($family, $type, $weight, $style) { + @font-face { + font-family: $family; + src: url('#{$google-font-path}/#{$family}/#{$family}-#{$type}.ttf') format('truetype'); + font-weight: $weight; + font-style: $style; + } +} + +@mixin google-font-pair($family) { + @include google-font('#{$family}', 'Regular', 400, normal); +} + +@include google-font-pair('Montserrat'); +@include google-font-pair('Open Sans'); +@include google-font-pair('Oswald'); +@include google-font-pair('Raleway'); +@include google-font-pair('Roboto'); diff --git a/addons/web/static/src/scss/layout_background.scss b/addons/web/static/src/scss/layout_background.scss index 93ac948b2ad..12dc0f109dc 100644 --- a/addons/web/static/src/scss/layout_background.scss +++ b/addons/web/static/src/scss/layout_background.scss @@ -1,5 +1,5 @@ + .o_background_footer, .o_background_header, .o_report_layout_background { - font-family: 'Lato', 'Noto'; color: gray('700'); } .o_background_header { @@ -11,7 +11,7 @@ margin-right: 16px; } h3 { - color: $o-brand-odoo; + color: $o-company-primary-color; font-weight: 700; font-size: 1.25rem; max-width: 300px; @@ -22,12 +22,12 @@ white-space: nowrap; } ul { - border-top: 1px solid $o-brand-odoo; - border-bottom: 1px solid $o-brand-odoo; + border-top: 1px solid $o-company-secondary-color; + border-bottom: 1px solid $o-company-secondary-color; padding: 4px 0; margin: 0 0 4px 0; li { - color: $o-brand-odoo; + color: $o-company-secondary-color; } } } @@ -37,7 +37,10 @@ background-position: bottom center; background-repeat: no-repeat; min-height: 620px; - + + strong { + color: $o-company-secondary-color; + } .table { border-top: 1px solid gray('300'); } @@ -45,8 +48,11 @@ .table td, .table th { border-top: none; } - thead tr th, h2 { - color: $o-brand-odoo; + h2 { + color: $o-company-primary-color; + } + thead tr th { + color: $o-company-secondary-color } tbody { color: gray('700'); @@ -75,9 +81,11 @@ &.o_total { border-top: none !important; td { - color: $o-brand-odoo; border-top: 1px solid gray('400') !important; } + strong { + color: $o-company-primary-color; + } } } } diff --git a/addons/web/static/src/scss/layout_boxed.scss b/addons/web/static/src/scss/layout_boxed.scss index 8b2d555365e..a32c09379cd 100644 --- a/addons/web/static/src/scss/layout_boxed.scss +++ b/addons/web/static/src/scss/layout_boxed.scss @@ -1,5 +1,4 @@ .o_boxed_footer, .o_boxed_header, .o_report_layout_boxed { - font-family: 'Lato', 'Noto'; color: gray('700'); font-size: 15px; } @@ -17,15 +16,24 @@ .o_boxed_footer { margin-top: 200px; white-space: nowrap; - border-top: 3px solid gray('700'); + border-top: 3px solid $o-company-secondary-color; ul { margin: 4px 0; } } .o_report_layout_boxed { + #total strong { + color: $o-company-primary-color; + } + #informations strong { + color: $o-company-secondary-color; + } > h2 { text-transform: uppercase; } + h2 span { + color: $o-company-primary-color; + } table { border: 1px solid gray('700'); thead { @@ -33,6 +41,7 @@ tr th { text-transform: uppercase; border: 1px solid gray('700'); + color: $o-company-secondary-color; } } tbody { @@ -50,12 +59,12 @@ border-bottom: 1px solid gray('700'); } &.o_line_section td { - background-color: gray('700'); + background-color: rgba($o-company-primary-color, 0.7); color: #fff; } &.is-subtotal, td.o_price_total { - background-color: gray('200'); + background-color: rgba($o-company-secondary-color, 0.1); } } } @@ -83,13 +92,16 @@ } &:last-child td, &.o_total td { - background-color: gray('700'); + background-color: rgba($o-company-primary-color, 0.9); color: #fff; &:first-child { border-right: none; } } + &.o_total strong { + color: white; + } } } } diff --git a/addons/web/static/src/scss/layout_clean.scss b/addons/web/static/src/scss/layout_clean.scss index 0a8f4b065af..0a62584ea88 100644 --- a/addons/web/static/src/scss/layout_clean.scss +++ b/addons/web/static/src/scss/layout_clean.scss @@ -1,25 +1,21 @@ .o_clean_footer, .o_clean_header, .o_report_layout_clean { - font-family: 'Lato', 'Noto'; color: #000; } -.o_clean_header { - border-bottom: 1px solid $o-brand-primary; - img { - max-height: 90px; - max-width: 300px; - } +.o_clean_header img { + max-height: 90px; + max-width: 300px; } .o_clean_footer { margin: 0 3px; margin-top: 200px; - border-top: 3px solid $o-brand-odoo; + border-top: 3px solid $o-company-secondary-color; h4 { - color: $o-brand-odoo; + color: $o-company-secondary-color; font-weight: bolder; } .pagenumber { - border: 3px solid $o-brand-odoo; - background-color: $o-brand-primary; + border: 3px solid $o-company-primary-color; + background-color: $o-company-secondary-color; color: white; padding: 4px 8px; text-align: center; @@ -27,11 +23,11 @@ } .o_report_layout_clean { h1, h2, h3 { - color: $o-brand-primary; + color: $o-company-primary-color; font-weight: bolder; } strong { - color: $o-brand-odoo; + color: $o-company-secondary-color; } table { &.o_main_table { @@ -39,13 +35,11 @@ } thead { - color: $o-brand-odoo; + color: $o-company-secondary-color; tr th { - border-top: 3px solid $o-brand-odoo !important; + border-top: 3px solid $o-company-secondary-color !important; text-transform: uppercase; } - tr th:last-child { - } tr th:first-child { width: 48%; } @@ -56,7 +50,7 @@ border-top: none; } tr:last-child td { - border-bottom: 3px solid $o-brand-odoo; + border-bottom: 3px solid $o-company-secondary-color; } tr { td { @@ -67,6 +61,11 @@ } } } + #total { + strong { + color: $o-company-secondary-color; + } + } /*Total table*/ /* compat 12.0 */ .row:not(#total) > div:has(table) { diff --git a/addons/web/static/src/scss/layout_standard.scss b/addons/web/static/src/scss/layout_standard.scss index acc0e07bf1c..e992d25b796 100644 --- a/addons/web/static/src/scss/layout_standard.scss +++ b/addons/web/static/src/scss/layout_standard.scss @@ -1,3 +1,22 @@ .o_standard_footer { margin-top: 200px; } + +.o_report_layout_standard { + h2 { + color: $o-company-primary-color; + } + + #informations strong { + color: $o-company-secondary-color; + } + + #total strong{ + color: $o-company-primary-color; + } + table { + thead { + color: $o-company-secondary-color; + } + } +} diff --git a/addons/web/static/src/scss/report.scss b/addons/web/static/src/scss/report.scss index e901b5b9364..f6fcdeb9407 100644 --- a/addons/web/static/src/scss/report.scss +++ b/addons/web/static/src/scss/report.scss @@ -1,3 +1,7 @@ +$o-company-font: 'Lato' !default; +$o-company-primary-color: rgb(0, 0, 0) !default; +$o-company-secondary-color: rgb(0, 0, 0) !default; + html, body { height: 100%; direction: ltr; @@ -6,6 +10,7 @@ html, body { body { color: #000 !important; word-wrap: break-word; + font-family: $o-company-font; } .border-black td, .border-black th { border-top: 1px solid black !important; |
