Skip to Content
Menu
This question has been flagged
4 Replies
9813 Views

How can change color button in all apps ? and what paths the file of all colors

Thank you.


Avatar
Discard
Best Answer

1. Identify the CSS Class: Determine the CSS class associated with the buttons whose color you want to change. You can use web development tools in your browser to inspect the button element and find its CSS class. Common classes for buttons in Odoo include `btn`, `btn-primary`, `btn-secondary`, `btn-success`, `btn-danger`, etc.

2. Locate the CSS Stylesheet: In Odoo, the CSS stylesheets are typically stored in the addon folders of each module. The specific path may vary depending on your Odoo version and installation method. By default, the CSS files can be found in the following path:

addons//static/src/css/

Note: Each module may have its own CSS file(s) or use a shared CSS file like `web.assets_backend.css` for the backend interface.

3. Modify the CSS: Open the CSS file associated with the module or the shared CSS file and locate the CSS class identified in step 1. You can add or override CSS properties to change the button color. For example, you can modify the `background-color` property, `color` property, or other relevant properties to achieve the desired color effect.

4. Apply the Changes: After making the necessary CSS modifications, save the CSS file.

5. Update Assets: To ensure the changes take effect, you need to update the assets of the Odoo database. This can be done by navigating to the Developer Tools in the Odoo backend, then selecting "Assets" from the "Settings" menu. Click on the "Update" button to update the assets.

6. Clear Browser Cache: To see the updated button colors, clear your browser cache or perform a hard refresh (Ctrl + F5) to load the updated CSS styles.

It's important to note that modifying CSS files directly may not be the recommended approach in all cases. It's recommended to use Odoo's custom modules or themes to override CSS styles in a more sustainable and upgrade-safe manner.

Avatar
Discard
Author Best Answer

Thank you guys, you solved my problem

Avatar
Discard
Best Answer

Hi,

If you go through the web module in odoo, you can see all the related styles:  /odoo/addons/web/static/src/scss

Thanks

Avatar
Discard
Best Answer

Hi,
If it's a primary button, then you can change the color using '.btn-primary' class. Just use the selector and change the color in css. If it's not working, try adding '!important' in the end.Your css should look something like this:
.btn-primary {
​background: #color !important;
​}
The same applies if it's a secondary button. Just need to change the selector.

Hope it helps

Avatar
Discard
Related Posts Replies Views Activity
0
Nov 23
1536
1
Aug 15
3309
2
Dec 24
5305
1
May 24
2701
2
Apr 24
4312