devops_admin
/
odex30_standard
mirror of https://github.com/hydracp9/odex30_standard
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

expert odoo 18 theme module

This commit is contained in:
MohamedGad100 2025-12-14 15:42:54 +02:00
parent d8169d509b
commit 210f802fed
2 changed files with 0 additions and 488 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

176
odex30_base/expert_theme/COLOR_CUSTOMIZATION.md
View File

@ -1,176 +0,0 @@
# Expert Theme - Color Customization Guide
## 🎨 Overview
The Expert Theme includes a comprehensive color customization system that allows you to easily change the appearance of your Odoo backend. You can customize colors for:
- **Navbar** (top navigation bar)
- **Buttons** (Activate, Upgrade, Learn More, etc.)
- **Sidebar** (left navigation menu)
- **Backgrounds** (page background, content areas)
- **Text** (headings, body text, links)
- **Status colors** (success, warning, error, info)
## 🚀 Quick Start
### Method 1: Edit Configuration File (Recommended)
1. Open the file: `static/src/css/expert_theme_config.css`
2. Find the color you want to change in the `:root` section
3. Replace the hex color code with your desired color
4. Save the file and refresh your Odoo page
### Method 2: Use Pre-made Themes
The configuration file includes example color schemes. To use them:
1. Open `static/src/css/expert_theme_config.css`
2. Find the theme you want (Blue, Green, or Dark)
3. Uncomment the theme section (remove `/*` and `*/`)
4. Comment out the default theme section
5. Save and refresh
## 🎯 Color Variables Reference
### Primary Colors
```css
--expert-primary-color: #875A7B; /* Main brand color */
--expert-primary-hover: #6B4C6B; /* Hover state */
--expert-primary-light: #A67B9B; /* Light version */
```
### Secondary Colors
```css
--expert-secondary-color: #00A09D; /* Secondary brand color */
--expert-secondary-hover: #008B8A; /* Secondary hover */
```
### Button Colors
```css
--expert-btn-primary: #875A7B; /* Primary buttons (Activate) */
--expert-btn-secondary: #00A09D; /* Secondary buttons (Upgrade) */
--expert-btn-light: #F8F9FA; /* Light buttons (Learn More) */
```
### Background Colors
```css
--expert-bg-primary: #875A7B; /* Navbar background */
--expert-bg-secondary: #F8F9FA; /* Sidebar background */
--expert-bg-content: #FFFFFF; /* Content background */
--expert-bg-gradient-start: #f5f7fa; /* Page gradient start */
--expert-bg-gradient-end: #c3cfe2; /* Page gradient end */
```
### Text Colors
```css
--expert-text-primary: #212529; /* Main text */
--expert-text-secondary: #6C757D; /* Secondary text */
--expert-text-light: #FFFFFF; /* Light text */
```
### Status Colors
```css
--expert-success: #28A745; /* Success/Active */
--expert-warning: #FFC107; /* Warning */
--expert-danger: #DC3545; /* Error/Danger */
--expert-info: #17A2B8; /* Info */
```
## 🎨 Example Color Schemes
### Blue Theme
```css
:root {
--expert-primary-color: #007BFF;
--expert-primary-hover: #0056B3;
--expert-secondary-color: #6F42C1;
--expert-bg-primary: #007BFF;
--expert-bg-gradient-start: #E3F2FD;
--expert-bg-gradient-end: #BBDEFB;
}
```
### Green Theme
```css
:root {
--expert-primary-color: #28A745;
--expert-primary-hover: #1E7E34;
--expert-secondary-color: #20C997;
--expert-bg-primary: #28A745;
--expert-bg-gradient-start: #E8F5E8;
--expert-bg-gradient-end: #C3E6C3;
}
```
### Dark Theme
```css
:root {
--expert-primary-color: #343A40;
--expert-primary-hover: #23272B;
--expert-secondary-color: #6C757D;
--expert-bg-primary: #343A40;
--expert-bg-secondary: #495057;
--expert-bg-content: #F8F9FA;
--expert-bg-gradient-start: #2C3E50;
--expert-bg-gradient-end: #34495E;
--expert-text-primary: #FFFFFF;
--expert-text-secondary: #E9ECEF;
}
```
## 🔧 Advanced Customization
### Custom Color Combinations
You can create your own color schemes by:
1. **Choosing a primary color** - This will be your main brand color
2. **Creating a hover color** - Usually a darker shade of your primary
3. **Selecting a secondary color** - A complementary color for variety
4. **Setting background colors** - Light colors for readability
5. **Choosing text colors** - High contrast for accessibility
### Color Tools
Use these tools to help choose colors:
- **Color Picker**: Use your browser's developer tools
- **Color Palettes**: [Coolors.co](https://coolors.co), [Adobe Color](https://color.adobe.com)
- **Accessibility**: [WebAIM Contrast Checker](https://webaim.org/resources/contrastchecker/)
## 📝 Tips
1. **Test your colors** - Always preview changes in your browser
2. **Consider accessibility** - Ensure good contrast between text and backgrounds
3. **Keep it consistent** - Use the same color family throughout
4. **Start simple** - Begin with just changing the primary color
5. **Backup your changes** - Save a copy of your working configuration
## 🐛 Troubleshooting
### Colors not changing?
- Make sure you saved the file
- Clear your browser cache
- Check for syntax errors in the CSS
- Verify the file is being loaded (check browser developer tools)
### Colors look wrong?
- Check for typos in color codes
- Ensure you're using valid hex codes (e.g., #FF0000)
- Make sure you're editing the right file
### Need to reset?
- Restore the original `expert_theme_config.css` file
- Or copy the default values from the documentation above
## 📞 Support
If you need help with color customization, check:
1. This documentation
2. The example themes in the config file
3. Browser developer tools for debugging
4. Odoo community forums for additional help
---
**Happy Theming! 🎨**

312
odex30_base/expert_theme/TESTING_GUIDE.md
View File

@ -1,312 +0,0 @@
# Testing Guide - Login Page Templates Feature
## Prerequisites
- Odoo 18 installed and running
- Expert Theme module installed
- Admin access to Odoo backend
---
## Step 1: Install/Upgrade the Module
1. **Go to Apps Menu**
- Navigate to: `Apps` → Search for "Expert Theme"
- Click on the module
2. **Upgrade the Module**
- Click the "Upgrade" button (if already installed)
- OR click "Install" if not installed yet
- Wait for the upgrade/installation to complete
3. **Verify Installation**
- Check that no errors appear in the logs
- The module should show as "Installed"
---
## Step 2: Access Login Template Configuration
1. **Navigate to Configuration**
- Go to: `Expert Home` → `Login Page Templates`
- OR use the menu: `Expert Home` → `Login Page Templates` (should be above "Theme Colors")
2. **Verify Default Templates**
- You should see **2 templates** created by default:
- **Default Template** (White background #FFFFFF) - Should be **Active**
- **Light Gray Template** (Gray background #F5F5F5) - Should be **Inactive**
---
## Step 3: Test Template Switching
### Test 3.1: Switch to Gray Template
1. **Open the Gray Template**
- Click on "Light Gray Template" from the list
2. **Activate the Template**
- Click the "Activate" button in the form header
- OR toggle the "Active" field to `True`
- Click "Save"
3. **Verify Switch**
- The "Default Template" should automatically become **Inactive**
- Only "Light Gray Template" should be **Active**
- Check the list view - only one template should have the Active toggle ON
### Test 3.2: Switch Back to Default Template
1. **Open Default Template**
- Click on "Default Template" from the list
2. **Activate it**
- Click "Activate" button or toggle "Active" field
- Click "Save"
3. **Verify**
- "Light Gray Template" should become inactive
- "Default Template" should be active
---
## Step 4: Test Login Page Appearance
### Test 4.1: Test with Default Template (White)
1. **Logout from Odoo**
- Click on your user menu (top right)
- Click "Log out"
2. **Check Login Page**
- The login page should have a **white background** (#FFFFFF)
- All login form elements should be visible and functional
3. **Verify JavaScript Loading**
- Open browser Developer Tools (F12)
- Go to Console tab
- Check for any errors
- You should see the CSS variable being set: `--expert-login-bg-color`
### Test 4.2: Test with Gray Template
1. **Switch to Gray Template** (from Step 3.1)
2. **Logout and Check Login Page**
- Logout from Odoo
- The login page should now have a **light gray background** (#F5F5F5)
- Login form should still be visible and functional
3. **Verify Background Applied**
- Check browser DevTools → Elements tab
- Inspect `<body>` or `<html>` element
- Should have `background-color: #F5F5F5` applied
---
## Step 5: Test Color Customization
### Test 5.1: Edit Template Background Color
1. **Edit a Template**
- Go to `Login Page Templates`
- Open any template (e.g., "Default Template")
2. **Change Background Color**
- Click on the "Background Color" field
- Choose a different color (e.g., `#E3F2FD` - light blue)
- Click "Save"
3. **Test on Login Page**
- Logout and check login page
- Background should be the new color you selected
### Test 5.2: Create New Template
1. **Create New Template**
- Go to `Login Page Templates`
- Click "Create" button
2. **Fill Template Details**
- Name: "Blue Template"
- Background Color: `#2196F3` (or any blue color)
- Description: "Blue themed login page"
- Sequence: 3
- **DO NOT** activate it yet
3. **Save and Activate**
- Click "Save"
- Then click "Activate" button
- Verify other templates become inactive
4. **Test on Login Page**
- Logout and verify blue background appears
---
## Step 6: Test Edge Cases
### Test 6.1: Multiple Templates (Only One Active)
1. **Create Multiple Templates**
- Create 2-3 templates
- Try to activate multiple templates at once
2. **Expected Behavior**
- Only the last activated template should be active
- All others should automatically become inactive
- This ensures only one template is applied at a time
### Test 6.2: No Active Template
1. **Deactivate All Templates**
- Go to all templates and set `Active = False`
- Save all
2. **Check Login Page**
- Logout and check login page
- Should still work (fallback to default white or system default)
- OR a default template should be auto-created
### Test 6.3: Invalid Color Code
1. **Test Invalid Color**
- Edit a template
- Enter invalid color code (e.g., "invalid" or "12345")
- Save
2. **Expected Behavior**
- Should either:
- Show validation error
- OR fallback to default color (#FFFFFF)
---
## Step 7: Test API Endpoint
### Test 7.1: Check API Response
1. **Open Browser DevTools**
- Press F12
- Go to Network tab
2. **Access Login Page**
- Go to login page (while logged out)
3. **Check API Call**
- Look for request: `/expert_theme/get_login_template_styles`
- Click on it to see response
- Should return JSON:
```json
{
"success": true,
"styles": {
"background_color": "#F5F5F5"
}
}
```
4. **Verify Public Access**
- The API should work without authentication (public access)
- Try accessing directly: `http://your-odoo-url/expert_theme/get_login_template_styles`
---
## Step 8: Test Browser Compatibility
Test the login page in different browsers:
- ✅ Chrome/Edge (Chromium)
- ✅ Firefox
- ✅ Safari (if available)
Verify that:
- Background colors apply correctly
- Login form remains functional
- No JavaScript errors in console
---
## Step 9: Performance Testing
1. **Check Page Load Time**
- Login page should load quickly
- API call should be fast (< 100ms ideally)
2. **Check for Console Errors**
- Open DevTools → Console
- Should see no errors
- Only warnings are acceptable (e.g., if API fails, it should gracefully handle)
---
## Step 10: Final Verification Checklist
- [ ] Module installs/upgrades without errors
- [ ] Menu "Login Page Templates" appears in Expert Home
- [ ] Default templates are created (2 templates)
- [ ] Can switch between templates
- [ ] Only one template can be active at a time
- [ ] Login page background changes when template is switched
- [ ] Can edit template colors
- [ ] Can create new templates
- [ ] Login form remains functional with all templates
- [ ] API endpoint works (public access)
- [ ] No JavaScript errors in console
- [ ] Works in multiple browsers
---
## Troubleshooting
### Issue: Login page background doesn't change
**Solutions:**
1. Clear browser cache (Ctrl+Shift+Delete)
2. Hard refresh login page (Ctrl+F5)
3. Check browser console for JavaScript errors
4. Verify API endpoint is accessible: `/expert_theme/get_login_template_styles`
5. Check that a template is actually active in the backend
### Issue: Menu "Login Page Templates" not visible
**Solutions:**
1. Upgrade the module again
2. Check user permissions (should be available to all users)
3. Clear browser cache
4. Restart Odoo server
### Issue: Multiple templates active at once
**Solutions:**
1. This shouldn't happen - check the model's `write()` method
2. Manually deactivate all except one
3. Report as a bug if it persists
### Issue: API returns error
**Solutions:**
1. Check Odoo logs for Python errors
2. Verify the model `expert.login.template` exists
3. Check database for template records
4. Verify controller route is registered
---
## Expected Results Summary
✅ **Success Criteria:**
- Admin can configure login page templates from backend
- Can switch between templates easily
- Login page background changes immediately after switching
- Only one template active at a time
- Login functionality remains intact
- No errors in console or logs
---
## Notes
- The feature is designed to be simple initially (only background color)
- Future enhancements can add more customization options
- All changes take effect immediately (no server restart needed)
- Templates are stored in database, so they persist after module upgrades