Odoo Primary Color Change - #fecd4f

Summary

Successfully changed the entire Odoo site's primary color to #fecd4f (Golden Yellow).

Changes Made

1. Created Theme Variables File

File: d:\Odoo\addons\dine360_dashboard\static\src\css\theme_variables.css

Defined CSS custom properties (variables) for the primary color and all variations
Applied primary color to all common Odoo UI elements:
- Buttons (primary, save, create)
- Links and hover states
- Active/selected states
- Badges and tags
- Progress bars
- Checkboxes and radio buttons
- Focus states
- Navigation bar
- Menu items
- Kanban views
- Pagination
- Tabs
- Dropdowns
- Search bars

File: d:\Odoo\addons\dine360_dashboard\static\src\css\home_menu.css

App card hover effects now use primary color (#fecd4f)
App name hover color changed to primary color
User avatar background uses gradient with primary color
Badge notifications use primary color
AI icon gradient updated to include primary color

3. Updated Manifest

File: d:\Odoo\addons\dine360_dashboard\__manifest__.py

Added theme_variables.css to assets list (loads first)

File: d:\Odoo\addons\dine360_dashboard\static\src\css\login_style.css

Already uses #fecd4f in the gradient background
Login button uses gradient from secondary to primary color

Color Palette

Primary Colors

Primary: #fecd4f (Golden Yellow)
Primary Dark: #e5b846
Primary Light: #ffd970
Primary Lighter: #ffe599

Secondary Colors

Secondary: #2bb1a5 (Teal/Turquoise)
Secondary Dark: #259a8f
Secondary Light: #4dc4b8

Gradients

Primary Gradient: linear-gradient(135deg, #fecd4f 0%, #ffd970 100%)
Primary to Secondary: linear-gradient(135deg, #fecd4f 0%, #2bb1a5 100%)
Secondary to Primary: linear-gradient(to right, #2bb1a5, #fecd4f)

Next Steps

To Apply Changes:

Restart Odoo Service:
```
docker-compose restart odoo
```

Update the Module:

docker-compose exec odoo odoo -u dine360_dashboard -d FOODIES-DELIGHT --stop-after-init

Clear Browser Cache:
- Press Ctrl + Shift + Delete (Windows)
- Clear cached images and files
- Or use hard refresh: Ctrl + F5

Verification:

After restarting, check these elements for the primary color:

✅ Login page background and buttons
✅ Home dashboard app cards (hover effect)
✅ Primary buttons throughout Odoo
✅ Links and active menu items
✅ Form save/create buttons
✅ Navigation bar
✅ Selected items in lists/kanban views
✅ Badges and tags
✅ Focus states on input fields

Customization

To change the primary color in the future, simply edit: d:\Odoo\addons\dine360_dashboard\static\src\css\theme_variables.css

Update the --primary-color variable at the top of the file:

:root {
    --primary-color: #YOUR_COLOR_HERE;
    /* ... */
}

Then restart Odoo and clear browser cache.

3.0 KiB Raw Blame History