Fix RTL text direction in AI Studio Google for Arabic language only
// ==UserScript==
// @name AI Studio Arabic RTL Fix
// @namespace http://tampermonkey.net/
// @version 1.3
// @description Fix RTL text direction in AI Studio Google for Arabic language only
// @author Adapted from Javad's script
// @match https://aistudio.google.com/*
// @grant none
// @license MIT
// ==/UserScript==
(function() {
'use strict';
// Function to detect Arabic text only
function containsArabic(text) {
// Unicode range for Arabic characters only
const arabicRegex = /[\u0600-\u06FF\u0750-\u077F\u08A0-\u08FF\uFB50-\uFDFF\uFE70-\uFEFF]/;
return arabicRegex.test(text);
}
// Function to apply RTL direction to elements
function applyRTLDirection() {
// Target message containers and text elements
const textElements = document.querySelectorAll('.message-container, .message-content, p, li, pre, h1, h2, h3, h4, h5, h6');
textElements.forEach(element => {
const text = element.innerText || element.textContent;
if (!text) return;
if (containsArabic(text)) {
element.dir = "rtl";
element.style.textAlign = "right";
// Handle parent elements for lists
if (element.tagName === 'LI') {
const parentList = element.closest('ul, ol');
if (parentList) {
parentList.dir = "rtl";
parentList.style.paddingRight = "40px";
parentList.style.paddingLeft = "0";
parentList.style.marginRight = "0";
parentList.style.marginLeft = "0";
}
// Improved bullet point and number alignment
element.style.listStylePosition = "outside";
element.style.marginRight = "20px";
}
} else {
element.dir = "ltr";
element.style.textAlign = "left";
// Reset list styling for LTR if needed
if (element.tagName === 'LI') {
const parentList = element.closest('ul, ol');
if (parentList && !containsArabic(parentList.innerText)) {
parentList.dir = "ltr";
parentList.style.paddingLeft = "40px";
parentList.style.paddingRight = "0";
parentList.style.marginLeft = "0";
parentList.style.marginRight = "0";
}
}
}
});
// Specifically target lists and apply RTL styling
const lists = document.querySelectorAll('ul, ol');
lists.forEach(list => {
const text = list.innerText || list.textContent;
if (containsArabic(text)) {
list.dir = "rtl";
list.style.paddingRight = "20px";
list.style.paddingLeft = "0";
list.style.marginRight = "0";
list.style.marginLeft = "0";
// Apply RTL to all child list items with improved alignment
const items = list.querySelectorAll('li');
items.forEach(item => {
item.dir = "rtl";
item.style.textAlign = "right";
item.style.listStylePosition = "outside";
// Add custom styling for better alignment
if (list.tagName === 'OL') {
// For numbered lists
list.style.listStyleType = "arabic-indic";
item.style.marginRight = "20px";
} else {
// For bullet points
item.style.marginRight = "20px";
}
});
}
});
// Add specific styling for Arabic code blocks
const codeBlocks = document.querySelectorAll('pre, code');
codeBlocks.forEach(block => {
const text = block.innerText || block.textContent;
if (containsArabic(text)) {
block.dir = "rtl";
block.style.textAlign = "right";
block.style.fontFamily = "Tahoma, Arial, sans-serif";
}
});
// Add custom CSS for better RTL list alignment
addCustomCSS();
}
// Function to add custom CSS for better RTL list alignment
function addCustomCSS() {
if (document.getElementById('rtl-fix-css')) return;
const styleEl = document.createElement('style');
styleEl.id = 'rtl-fix-css';
styleEl.textContent = `
[dir="rtl"] ul {
list-style-type: disc;
padding-right: 20px !important;
padding-left: 0 !important;
}
[dir="rtl"] ol {
list-style-type: arabic-indic;
padding-right: 20px !important;
padding-left: 0 !important;
}
[dir="rtl"] li {
display: list-item;
text-align: right !important;
margin-right: 20px !important;
}
`;
document.head.appendChild(styleEl);
}
// Run initially
applyRTLDirection();
// Set up periodic check
setInterval(applyRTLDirection, 1000);
// Set up MutationObserver to detect new content
const observer = new MutationObserver(function(mutations) {
applyRTLDirection();
});
// Start observing the document
observer.observe(document.body, {
childList: true,
subtree: true,
attributes: false,
characterData: false
});
})();