livrare lot 2

backend/services/gateway-auth-layer/didiKeycloak/themes/README.md

@@ -0,0 +1,72 @@
+# Keycloak Custom Theme Setup
+
+## Automatic Setup
+
+Run the provided script after Keycloak is running:
+```bash
+./docker/keycloak/set-theme.sh
+```
+
+## Manual Setup
+
+1. Access Keycloak Admin Console:
+   - URL: http://localhost:8180
+   - Username: admin
+   - Password: keycloak_admin_password_123
+
+2. Select your realm:
+   - Click on the realm dropdown (top left)
+   - Select "misinformation-analyzer"
+
+3. Configure the theme:
+   - Go to "Realm Settings" in the left menu
+   - Click on the "Themes" tab
+   - In "Login theme" dropdown, select "misinformation-theme"
+   - Click "Save"
+
+4. Test the theme:
+   - Logout from admin console
+   - Go to your application: http://localhost:3001
+   - You should see the styled login page
+
+## Theme Customization
+
+The theme files are located in:
+- CSS: `misinformation-theme/login/resources/css/login.css`
+- Logo: `misinformation-theme/login/resources/img/logo.png`
+- Properties: `misinformation-theme/login/theme.properties`
+
+### Customization Options:
+
+1. **Colors**: Edit the CSS variables in login.css
+2. **Logo**: Replace logo.png with your own
+3. **Fonts**: Update font-family in the CSS
+4. **Layout**: Modify the CSS selectors
+
+### Available CSS Variables:
+```css
+--primary-color: #1976d2;
+--primary-dark: #115293;
+--primary-light: #4791db;
+--secondary-color: #dc004e;
+--gradient-trust: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+--gradient-bloom: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
+```
+
+## Troubleshooting
+
+If the theme doesn't appear:
+1. Ensure the theme folder is mounted correctly in docker-compose.yml
+2. Restart Keycloak: `docker compose restart keycloak`
+3. Clear browser cache
+4. Check Keycloak logs: `docker compose logs keycloak`
+
+## Preview
+
+The custom theme includes:
+- Gradient background matching your app
+- Custom logo
+- Styled input fields with focus effects
+- Matching button styles
+- Consistent color scheme
+- Responsive design