A powerful Chrome extension for managing RTL (Right-to-Left) and LTR (Left-to-Right) text direction on web pages.

• Quick toggle of text direction for any selected element
• Save direction settings for specific elements on a page
• Settings persist across page reloads
• Enable/disable saved settings with a simple toggle

• Apply custom CSS properties to elements
• Fine-grained control over text direction and styling
• Edit saved settings through a user-friendly interface
• Three-dot menu for managing saved settings (edit/delete)

1. Toggle Direction for Entire Page: Quickly change the direction of all text on the page
2. Toggle Vazir Font: Add or remove the Vazir font with two application modes:
   • As Default Font: Apply Vazir font to all elements on the page
   • For Advanced CSS: Load the font for use in custom CSS settings

• Clean and intuitive popup interface
• Scrollable list of saved settings
• Confirmation dialogs for important actions
• Visual feedback through notifications
• Edit dialog for modifying saved settings
• All Domains tab to manage settings across all websites

• Added: Comprehensive debugging system with configurable settings
• Enhanced: Improved Vazir font application with user-friendly dialog
• Added: Debug console utilities for developers
• Fixed: Better font application to RTL elements for improved rendering
• Improved: More robust error handling and state logging

• Added: New "All Domains" tab that lets you view and manage settings from all websites in one place
• Fixed: Toggle functionality now correctly disables settings without deleting them
• Fixed: Changes made in the advanced panel now apply immediately without requiring a page refresh
• Improved: Better handling of empty or disabled CSS settings
• Enhanced: Support for Single Page Applications (SPAs) with automatic style reapplication on navigation
• Updated: All notifications and messages are now in English
• Optimized: Codebase cleanup and performance improvements

• Fixed: RTL settings now correctly apply on page load without requiring manual toggling
• Improved: Enhanced CSS application to ensure RTL/LTR styles take precedence over existing page styles
• Added: Multiple initialization points to handle dynamic content loading
• Enhanced: Better cleanup of styles when toggling RTL/LTR settings
• Improved: MutationObserver now watches for attribute changes that might affect text direction

1. Right-click on any element to toggle its text direction
2. Use the popup to view and manage saved settings
3. Toggle settings on/off using the switch in the popup

1. Click the three-dot menu on any saved setting to:
   • Edit the selector, direction, and custom CSS
   • Delete the setting
2. Use the context menu to:
   • Toggle direction for the entire page
   • Add Vazir font (with options for application mode)
3. Use the "All Domains" tab to:
   • View settings from all websites
   • Edit settings for any domain
   • Delete individual settings from any domain
   • Clear all settings across all domains with a single button

1. Right-click anywhere on the page
2. Select "Toggle Vazir Font"
3. Choose how to apply the font:
   • "As Default Font" to apply it to all elements
   • "For Advanced CSS" to use it in custom CSS settings
   • "Test Font" to preview the font with a sample text

1. Debugging System:
   • Open the browser console and type rtlUtils.help() to see available commands
   • Enable debug mode with rtlUtils.setDebugMode(true)
   • Enable verbose logging with rtlUtils.setDebugMode(true, true)
   • Set component-specific debugging with rtlUtils.setDebugComponents()
   • View current state with debugRTL() or rtlDebug.logState()

1. Clone this repository
2. Open Chrome and go to chrome://extensions/
3. Enable "Developer mode"
4. Click "Load unpacked" and select the extension directory

Feel free to submit issues and enhancement requests!

The extension includes a comprehensive debugging system to help with development and troubleshooting:

1. Debug Console Commands:

   // Enable basic debugging
   rtlUtils.setDebugMode(true);
   
   // Enable verbose debugging
   rtlUtils.setDebugMode(true, true);
   
   // Debug specific components
   rtlUtils.setDebugComponents({ 
     ui: true,
     settings: true,
     observer: false,
     messaging: false,
     initialization: true
   });
   
   // View current debug settings
   rtlUtils.getDebugSettings();
   
   // View current extension state
   rtlDebug.logState();
   // or use the shorthand
   debugRTL();

2. Debug Configuration:

   • Debug settings are stored in the global state
   • Default settings have debugging disabled for production use
   • The debug module provides structured logging with clear prefixes

This project is licensed under the MIT License - see the LICENSE file for details.

If you encounter any problems or have suggestions, please open an issue on GitHub.

• Initial work - afzali

• Thanks to all contributors who help improve this extension
• Special thanks to the open source community

Made with ❤️ for the multilingual web