-
-
Notifications
You must be signed in to change notification settings - Fork 1.9k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[ADD] new module web_theme_classic to identify better buttons and fie…
…lds in Odoo form views
- Loading branch information
1 parent
413a747
commit 915090d
Showing
11 changed files
with
147 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
../../../../web_theme_classic |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,6 @@ | ||
import setuptools | ||
|
||
setuptools.setup( | ||
setup_requires=['setuptools-odoo'], | ||
odoo_addon=True, | ||
) |
Empty file.
Empty file.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,24 @@ | ||
# Copyright (C) 2022 - Today: GRAP (http://www.grap.coop) | ||
# @author: Sylvain LE GAL (https://twitter.com/legalsylvain) | ||
# License AGPL-3.0 or later (http://www.gnu.org/licenses/agpl.html). | ||
|
||
{ | ||
"name": "Web Theme Classic", | ||
"summary": "Contrasted style on fields to improve the UI.", | ||
"version": "16.0.1.0.1", | ||
"author": "GRAP, Odoo Community Association (OCA)", | ||
"maintainers": ["legalsylvain"], | ||
"website": "https://github.com/OCA/web", | ||
"license": "AGPL-3", | ||
"category": "Extra Tools", | ||
"depends": [ | ||
"web", | ||
], | ||
"assets": { | ||
"web.assets_backend": [ | ||
"/web_theme_classic/static/src/scss/web_theme_classic.scss", | ||
], | ||
}, | ||
"installable": True, | ||
"application": True, | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1 @@ | ||
* Sylvain LE GAL (https://www.twitter.com/legalsylvain) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
This module extend the Odoo Community Edition ``web`` module to improve visibility | ||
of form view. | ||
|
||
**Rational:** | ||
In Odoo V16, the design is very pure. That's great, but it generates some problem for | ||
users : | ||
|
||
* buttons and fields are not identifiable. (we can not know exactly where there are | ||
until you hover over them with the cursor) | ||
|
||
* there is no indication for the required fields until trying to save (or exit the screen) | ||
|
||
In a way, this module restores the form display of version 15, but preserving the "save on the fly" new feature. | ||
|
||
**Without this module** | ||
|
||
.. figure:: ../static/description/product_template_form_without_module.png | ||
|
||
**With this module** | ||
|
||
.. figure:: ../static/description/product_template_form_with_module.png |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
* For the time being, the module improves form and search view. Some other improvement could | ||
be done on other part of the UI. |
Binary file added
BIN
+56.8 KB
web_theme_classic/static/description/product_template_form_with_module.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added
BIN
+61.8 KB
web_theme_classic/static/description/product_template_form_without_module.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,92 @@ | ||
/*********************************************************** | ||
Variables | ||
************************************************************/ | ||
|
||
$input-border-color: #cccccc; | ||
$input-border-color-focus: #71639e; | ||
$input-background-color-required: #d2d2ff; | ||
$input-color-placeholder-required: #6c757d; | ||
|
||
$button-border-color: #dee2e6; | ||
|
||
/*********************************************************** | ||
Form View : Handle Fields Borders | ||
************************************************************/ | ||
|
||
.o_input, | ||
.o_field_html > .note-editable { | ||
/* Add border for all editable fields */ | ||
border: 1px solid $input-border-color !important; | ||
border-radius: 3px; | ||
|
||
/* add darker border on focus */ | ||
&:focus { | ||
border-color: $input-border-color-focus !important; | ||
} | ||
} | ||
|
||
.o_field_many2many_selection { | ||
.o_input { | ||
/* Prevent to have double border for many2many tags input fields */ | ||
border: 0px solid !important; | ||
} | ||
} | ||
|
||
/*********************************************************** | ||
Form View : Handle Button Borders | ||
************************************************************/ | ||
|
||
.btn-secondary, | ||
.btn-light { | ||
border-color: $button-border-color; | ||
} | ||
|
||
.btn-light { | ||
&:hover { | ||
border-color: $button-border-color; | ||
} | ||
} | ||
|
||
/*********************************************************** | ||
Form View : Handle Background for required fields | ||
************************************************************/ | ||
|
||
.o_required_modifier { | ||
.o_input { | ||
/* Add background for all editable and required fields */ | ||
background-color: $input-background-color-required !important; | ||
|
||
/* darker placeholder as the background is darker */ | ||
&::placeholder { | ||
color: $input-color-placeholder-required; | ||
} | ||
} | ||
} | ||
|
||
.o_required_modifier.o_field_selection { | ||
/* Specific case for field selection */ | ||
background-color: $input-background-color-required !important; | ||
} | ||
|
||
/*********************************************************** | ||
Search View : Search Bar Input | ||
************************************************************/ | ||
div.o_searchview[role="search"] { | ||
/* Add border for the searchable zone */ | ||
border: 1px solid $input-border-color !important; | ||
border-radius: 3px; | ||
|
||
/* add darker border when input inside has focus */ | ||
&:focus-within { | ||
border-color: $input-border-color-focus !important; | ||
} | ||
} | ||
|
||
/* Adjust padding to avoid items to be sticked to borders */ | ||
div.o_searchview_facet[role="img"] { | ||
padding-left: 2px; | ||
} | ||
|
||
i.o_searchview_icon[role="img"] { | ||
padding-right: 2px; | ||
} |