[IMP] theme_zap: update the theme

This commit updates the theme to improve the design with new colors, new
pictures and new snippet customizations.

task-2545207

X-original-commit: bbdfbba0d5
Part-of: odoo/design-themes#501
This commit is contained in:
Cocographique
2021-06-28 10:04:27 +00:00
committed by qsm-odoo
parent 6d999cfdc6
commit c4ca4397ae
25 changed files with 688 additions and 532 deletions
Binary file not shown.

After

Width:  |  Height:  |  Size: 279 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 94 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 184 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 121 KiB

After

Width:  |  Height:  |  Size: 92 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 164 KiB

After

Width:  |  Height:  |  Size: 119 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 128 KiB

After

Width:  |  Height:  |  Size: 150 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 128 KiB

After

Width:  |  Height:  |  Size: 142 KiB

+4 -7
View File
@@ -1,8 +1,6 @@
odoo.define("theme_zap.tour.zap", function (require) {
"use strict";
/** @odoo-module */
const wTourUtils = require("website.tour_utils");
var tour = require("web_tour.tour");
import wTourUtils from 'website.tour_utils';
const snippets = [
{
@@ -10,8 +8,8 @@ const snippets = [
name: 'Banner',
},
{
id: 's_numbers',
name: 'Numbers',
id: 's_three_columns',
name: 'Columns',
},
{
id: 's_color_blocks_2',
@@ -44,4 +42,3 @@ wTourUtils.registerThemeHomepageTour("zap_tour", [
wTourUtils.changeBackgroundColor(),
wTourUtils.selectColorPalette(),
]);
});
+15 -36
View File
@@ -3,74 +3,53 @@
//------------------------------------------------------------------------------//
// Headings
@if o-website-value('headings-font-number') == 1 {
// Roboto
@if o-website-value('headings-font') == 'Roboto' {
$o-theme-headings-font-weight: 500;
}
@else if o-website-value('headings-font-number') == 4 {
// Lato
$o-theme-headings-font-weight: 300;
}
@else if o-website-value('headings-font-number') == 5 {
// Advent Pro
$o-theme-h1-font-size-multiplier: 4;
$o-theme-h2-font-size-multiplier: 3.5;
@else if o-website-value('headings-font') == 'Nunito' {
$o-theme-headings-font-weight: 600;
}
@else if o-website-value('headings-font-number') == 6 {
// Oswald
$o-theme-h1-font-size-multiplier: 4;
$o-theme-h2-font-size-multiplier: 3.5;
@else if o-website-value('headings-font') == 'Advent Pro' {
$o-theme-headings-font-weight: 600;
}
// Body
@if o-website-value('font-number') == 1 {
// Roboto
@if o-website-value('font') == 'Roboto' {
$o-theme-font-weight-bold: 500;
}
@else if o-website-value('font-number') == 4 {
// Lato
@else if o-website-value('font') == 'Lato' {
$o-theme-font-weight-light: 300;
$o-theme-font-weight-bold: 600;
}
@else if o-website-value('font-number') == 5 {
// Advent Pro
@else if o-website-value('font') == 'Advent Pro' {
$o-theme-font-weight-bold: 600;
}
@else if o-website-value('font-number') == 6 {
// Oswald
@else if o-website-value('font') == 'Oswald' {
$o-theme-font-weight-light: 200;
$o-theme-font-weight-normal: 300;
$o-theme-font-weight-bold: 400;
}
@else if o-website-value('font-number') == 8 {
// Open Sans
@else if o-website-value('font') == 'Open Sans' {
$o-theme-font-weight-bold: 600;
}
@else if o-website-value('font-number') == 10 {
// Montserrat Alternates
@else if o-website-value('font') == 'Montserrat Alternates' {
$o-theme-font-weight-bold: 600;
}
// Buttons
@if o-website-value('buttons-font-number') == 1 {
// Roboto
@if o-website-value('buttons-font') == 'Roboto' {
$o-theme-btn-font-weight: 500;
}
@else if o-website-value('buttons-font-number') == 5 {
// Advent Pro
@else if o-website-value('buttons-font') == 'Advent Pro' {
$o-theme-btn-font-weight: 600;
}
@else if o-website-value('buttons-font-number') == 6 {
// Oswald
@else if o-website-value('buttons-font') == 'Oswald' {
$o-theme-btn-font-weight: 200;
}
@else if o-website-value('buttons-font-number') == 8 {
// Open Sans
@else if o-website-value('buttons-font') == 'Open Sans' {
$o-theme-btn-font-weight: 600;
}
@else if o-website-value('buttons-font-number') == 10 {
// Montserrat Alternates
@else if o-website-value('buttons-font') == 'Montserrat Alternates' {
$o-theme-btn-font-weight: 600;
}
@@ -4,24 +4,34 @@
$o-website-values-palettes: (
(
'color-palettes-name': 'zap-1',
'color-palettes-name': 'zap-1',
// Header
'header-template': 'hamburger',
'logo-height': 2.75rem,
'fixed-logo-height': 2rem,
'header-links-style': 'fill',
'header-font-size': (14 / 16) * 1rem,
'font-size-base': (14 / 16) * 1rem,
'hamburger-position': 'right',
// Font
'font': 'Roboto',
'headings-font': 'Montserrat Alternates',
'navbar-font': 'Roboto',
'buttons-font': 'Montserrat Alternates',
'font': 'Lato',
'headings-font': 'Lato',
'navbar-font': 'Lato',
'buttons-font': 'Lato',
// Buttons
'btn-padding-y': .625rem,
'btn-padding-x': 1.5rem,
'btn-padding-y-sm': .375rem,
'btn-padding-x-sm': .75rem,
'btn-padding-y-lg': .75rem,
'btn-padding-x-lg': 2rem,
'btn-ripple': true,
'input-padding-y': .75rem,
'input-padding-y-sm': .375rem,
'input-padding-y-lg': .75rem,
// Footer
'footer-template': 'links',
),
@@ -51,16 +61,18 @@ $o-theme-font-configs: (
'Advent Pro': (
'family': ('Advent Pro', sans-serif),
'url': 'Advent+Pro:300,300i,400,400i,600,600i',
'base': (
'font-size-base': 1.125rem,
),
'properties': (
'base': (
'font-size-base': 1.125rem,
),
)
),
'Oswald': (
'family': ('Oswald', sans-serif),
'url': 'Oswald:300,300i,400,400i,700,700i',
'properties': (
'base': (
'font-size-base': 1.25rem,
'font-size-base': 1.25rem,
),
)
),
@@ -82,7 +94,12 @@ $o-theme-font-configs: (
),
'Nunito': (
'family': ('Nunito', sans-serif),
'url': 'Nunito:300,300i,400,400i,700,700i',
'url': 'Nunito:300,300i,400,400i,600,600i',
'properties' : (
'base': (
'header-font-size': (15 / 16) * 1rem,
),
)
),
);
@@ -90,10 +107,6 @@ $o-theme-font-configs: (
$o-theme-h1-font-size-multiplier: 3;
$o-theme-h2-font-size-multiplier: 2.5;
$o-theme-h3-font-size-multiplier: 2;
$o-theme-h4-font-size-multiplier: 1.75;
$o-theme-h5-font-size-multiplier: 1.5;
$o-theme-h6-font-size-multiplier: 1.25;
$o-theme-headings-font-weight: 400;
@@ -118,46 +131,46 @@ $o-theme-btn-font-weight: 400;
$o-theme-color-palettes: map-merge($o-theme-color-palettes,
(
'zap-1': (
'alpha': #337ab7,
'beta': #5cb85c,
'gamma': #5bc0de,
'delta': #f0ad4e,
'epsilon': #d9534f,
'alpha': #337ab7,
'beta': #5cb85c,
'gamma': #5bc0de,
'delta': #f0ad4e,
'epsilon': #d9534f,
),
'zap-2': (
'alpha': #ed8c2b,
'beta': #cf4a30,
'gamma': #911146,
'delta': #35203b,
'epsilon': #88a825,
'alpha': #ed8c2b,
'beta': #cf4a30,
'gamma': #911146,
'delta': #35203b,
'epsilon': #88a825,
),
'zap-3': (
'alpha': #79bd8f,
'beta': #00a388,
'gamma': #046380,
'delta': #4bb5c1,
'epsilon': #beeb9f,
'alpha': #79bd8f,
'beta': #00a388,
'gamma': #046380,
'delta': #4bb5c1,
'epsilon': #beeb9f,
),
'zap-4': (
'alpha': #16c6cc,
'beta': #d72d3C,
'gamma': #ff6d3b,
'delta': #ffb733,
'epsilon': #ffd55c,
'alpha': #16c6cc,
'beta': #d72d3C,
'gamma': #ff6d3b,
'delta': #ffb733,
'epsilon': #ffd55c,
),
'zap-5': (
'alpha': #14212b,
'beta': #e6e2af,
'gamma': #c9de55,
'delta': #962d3e,
'epsilon': #413659,
'alpha': #14212b,
'beta': #e6e2af,
'gamma': #c9de55,
'delta': #962d3e,
'epsilon': #413659,
),
'zap-6': (
'alpha': #ee592f,
'beta': #59c1b0,
'gamma': #1fa58d,
'delta': #f8c63b,
'epsilon': #dcb038,
'alpha': #ee592f,
'beta': #59c1b0,
'gamma': #1fa58d,
'delta': #f8c63b,
'epsilon': #dcb038,
),
)
);
@@ -189,3 +202,9 @@ $o-color-palettes-compatibility-indexes: (
22: 'generic-16',
23: 'generic-17',
);
//------------------------------------------------------------------------------
// Shapes
//------------------------------------------------------------------------------
$o-bg-shapes: change-shape-colors-mapping('web_editor', 'Origins/04_001', (3: 4));