mirror of
https://github.com/odoo/design-themes.git
synced 2025-10-07 01:18:52 +07:00
7411ad6b49
Theme Kiddo's design has been revamped by adding the following
improvements:
- Theme palette has been changed, using less contrasted colours.
- Fonts have been reviewed, replacing 'Bubblegum Sans' with 'Varela
Round'.
- Header and footer default values have been reviewed and changed to
'default' and 'descriptive'.
- Buttons' default design has been revamped, using now outline buttons
by default.
- Theme's tour has been reviewed and changed, using 's_picture' as a
third block.
- Theme's screenshot and description have been updated.
- Theme's tour snippet design has been revamped, by using animated
shapes ('s_banner', 's_picture'), new shapes ('s_image_text',
's_call_to_action'), a bg video + img placeholder ('s_banner'), a
illustration with dynamic colours ('s_image_text'), a new copywriting
('s_picture'), better text block design ('s_banner'), better design in
smaller viewports ('s_banner', 's_product_list') and a brand new
snippet design ('s_product_list').
- In order to add a better integration with the Website Configurator,
's_cover' design has also been improved.
Additionally, duplicated commented text lines in
'bootstrap_overridden.scss' have been removed.
task-2573229
X-original-commit: 0173ac6c44
Part-of: odoo/design-themes#501
190 lines
5.6 KiB
SCSS
190 lines
5.6 KiB
SCSS
//------------------------------------------------------------------------------
|
|
// Colors
|
|
//------------------------------------------------------------------------------
|
|
|
|
// Theme colors
|
|
$o-theme-color-palettes: map-merge($o-theme-color-palettes,
|
|
(
|
|
'kiddo-1': (
|
|
'alpha': #ffffff,
|
|
'beta': #47464b,
|
|
'gamma': #f3997b,
|
|
'delta': #add3ce,
|
|
'epsilon': #a7c7d5,
|
|
),
|
|
'kiddo-2': (
|
|
'alpha': #ffffff,
|
|
'beta': #d699ae,
|
|
'gamma': #B24774,
|
|
'delta': #72c2d0,
|
|
'epsilon': #ed8354,
|
|
),
|
|
'kiddo-3': (
|
|
'alpha': #ffffff,
|
|
'beta': #79CCC2,
|
|
'gamma': #F05A12,
|
|
'delta': #C5FFF8,
|
|
'epsilon': #0F7F72,
|
|
),
|
|
'kiddo-4': (
|
|
'alpha': #ffffff,
|
|
'beta': #53a1cc,
|
|
'gamma': #116899,
|
|
'delta': #aab3ca,
|
|
'epsilon': #ffc9c1,
|
|
),
|
|
'kiddo-5': (
|
|
'alpha': #ffffff,
|
|
'beta': #3b2c3c,
|
|
'gamma': #D2546D,
|
|
'delta': #303347,
|
|
'epsilon': #171827,
|
|
),
|
|
'kiddo-6': (
|
|
'alpha': #ffffff,
|
|
'beta': #2F343B,
|
|
'gamma': #C77966,
|
|
'delta': #703030,
|
|
'epsilon': #E3CDA4,
|
|
),
|
|
)
|
|
);
|
|
|
|
//------------------------------------------------------------------------------
|
|
// Fonts
|
|
//------------------------------------------------------------------------------
|
|
|
|
$o-theme-h1-font-size-multiplier: (40 / 14);
|
|
$o-theme-h2-font-size-multiplier: (32 / 14);
|
|
$o-theme-h3-font-size-multiplier: (28 / 14);
|
|
$o-theme-h4-font-size-multiplier: (24 / 14);
|
|
$o-theme-h5-font-size-multiplier: (20 / 14);
|
|
$o-theme-h6-font-size-multiplier: (16 / 14);
|
|
|
|
$o-theme-font-configs: (
|
|
'Varela Round': (
|
|
'family': ('Varela Round', sans-serif),
|
|
'url': 'Varela+Round:300,300i,400,400i,600,600i',
|
|
),
|
|
'Montserrat': (
|
|
'family': ('Montserrat', sans-serif), // font update - Proxima -> Montserrat
|
|
'url': 'Montserrat:300,300i,400,400i,600,600i',
|
|
),
|
|
'Comic Neue': (
|
|
'family': ('Comic Neue', cursive), // font update - Comic Sans MS -> Comic Neue
|
|
'url': 'Comic+Neue:300,300i,400,400i,700,700i',
|
|
),
|
|
'Bubblegum Sans': (
|
|
'family': ('Bubblegum Sans', cursive), // font update - Fontastique -> Bubblegum+Sans
|
|
'url': 'Bubblegum+Sans:300,300i,400,400i,700,700i',
|
|
),
|
|
'Eagle Lake': (
|
|
'family': ('Eagle Lake', serif), // font update - Luminari -> Eagle Lake
|
|
'url': 'Eagle+Lake:300,300i,400,400i,700,700i',
|
|
),
|
|
'Marcellus': (
|
|
'family': ('Marcellus', sans-serif), // font update - Fecske -> Marcellus
|
|
'url': 'Marcellus:300,300i,400,400i,700,700i',
|
|
),
|
|
'Roboto': ( // stable ! Din -> Roboto
|
|
'family': ('Roboto', sans-serif),
|
|
'url': 'Roboto:300,300i,400,400i,700,700i',
|
|
),
|
|
'Oxygen': (
|
|
'family': ('Oxygen', sans-serif),
|
|
'url': 'Oxygen:300,300i,400,400i,700,700i',
|
|
),
|
|
'Cabin': (
|
|
'family': ('Cabin', sans-serif),
|
|
'url': 'Cabin:300,300i,400,400i,700,700i',
|
|
),
|
|
'Abel': (
|
|
'family': ('Abel', sans-serif),
|
|
'url': 'Abel:300,300i,400,400i,700,700i',
|
|
),
|
|
'Advent Pro': (
|
|
'family': ('Advent Pro', sans-serif),
|
|
'url': 'Advent+Pro:300,300i,400,400i,700,700i',
|
|
),
|
|
'Muli': (
|
|
'family': ('Muli', sans-serif),
|
|
'url': 'Muli:300,300i,400,400i,700,700i',
|
|
),
|
|
'Noto Sans': (
|
|
'family': ('Noto Sans', sans-serif),
|
|
'url': 'Noto+Sans:300,300i,400,400i,700,700i',
|
|
),
|
|
);
|
|
|
|
//------------------------------------------------------------------------------
|
|
// Website customizations
|
|
//------------------------------------------------------------------------------
|
|
|
|
$o-website-values-palettes: (
|
|
(
|
|
'color-palettes-name': 'kiddo-3',
|
|
|
|
'font-size-base': (14 / 16) * 1.075rem,
|
|
'header-font-size': 1.15rem,
|
|
'logo-height': 3rem,
|
|
'fixed-logo-height': 3rem,
|
|
'btn-border-radius': 2rem,
|
|
'btn-border-radius-lg': 2rem,
|
|
'btn-padding-y': .5rem,
|
|
'btn-padding-x': 1.25rem,
|
|
'btn-padding-y-lg': .75rem,
|
|
'btn-padding-x-lg': 1.5rem,
|
|
'font': 'Montserrat',
|
|
'headings-font': 'Varela Round',
|
|
'navbar-font': 'Varela Round',
|
|
'buttons-font': 'Varela Round',
|
|
'link-underline': 'never',
|
|
'header-template': 'default',
|
|
'footer-template': 'descriptive',
|
|
'btn-primary-outline': true,
|
|
),
|
|
);
|
|
|
|
$o-palette-priority-prefix: 'kiddo';
|
|
|
|
$o-color-palettes-compatibility-indexes: (
|
|
1: 'kiddo-3',
|
|
2: 'kiddo-2',
|
|
3: 'kiddo-1',
|
|
4: 'kiddo-4',
|
|
5: 'generic-1',
|
|
6: 'generic-2',
|
|
7: 'generic-3',
|
|
8: 'generic-4',
|
|
9: 'generic-5',
|
|
10: 'generic-6',
|
|
11: 'generic-7',
|
|
12: 'generic-8',
|
|
13: 'generic-9',
|
|
14: 'generic-10',
|
|
15: 'generic-11',
|
|
16: 'generic-12',
|
|
17: 'generic-13',
|
|
18: 'generic-14',
|
|
19: 'generic-15',
|
|
20: 'generic-16',
|
|
21: 'generic-17',
|
|
);
|
|
|
|
$o-gray-color-palettes-compatibility-indexes: (
|
|
1: 'kiddo-1',
|
|
2: 'kiddo-2',
|
|
3: 'kiddo-3',
|
|
4: 'kiddo-4',
|
|
5: 'kiddo-5',
|
|
6: 'kiddo-6',
|
|
);
|
|
|
|
//------------------------------------------------------------------------------
|
|
// Shapes
|
|
//------------------------------------------------------------------------------
|
|
|
|
$o-bg-shapes: change-shape-colors-mapping('web_editor', 'Origins/14_001', (3: 2, 4: rgba(0, 0, 0, 0)));
|
|
$o-bg-shapes: change-shape-colors-mapping('web_editor', 'Origins/16', (3: 3));
|
|
$o-bg-shapes: add-footer-shape-colors-mapping('web_editor', 'Wavy/22', (3: 'footer'));
|