Created attachment 182880 [details] RTL: Dropdown menus to have background colors that make text unreadable Hello everyone, Currently, the staff interface loads both regular CSS files for LTR and then adds `right-to-left.css` on top when in RTL (bidi) mode. This approach is inefficient and can lead to styling conflicts. The OPAC interface already correctly loads RTL-specific CSS files directly when in RTL mode. The right-to-left.css file is manually maintained and not generated by Gulp, unlike other RTL files that are automatically generated from their LTR counterparts. This results in inconsistent RTL styling. Currently, right-to-left.css is causing dropdown menus to have background colors that make text unreadable (see attachment). I preparing a patch to fix that.
Created attachment 182881 [details] [review] Bug 40040: RTL CSS files not loaded in templates; legacy right-to-left.css causing UI issues This patch removes the legacy right-to-left.css file, which is no longer maintained and has started causing issues in the RTL (Right-to-Left) UI. We now use Gulp-generated RTL CSS files for better maintainability. In limited cases, we use /*rtl:raw: to target RTL-specific styles. This does not affect the default LTR (Left-to-Right) UI, as rtl:raw is handled by the gulp-rtlcss plugin during the build phase. To test: 1. Install the Arabic translation: koha-translate -i ar-Arab 2. Open the staff interface (with the broken CSS) and confirm the issue by browsing several pages. 3. Apply this patch. 4. Run: yarn css:build 5. Browse several pages in Arabic and confirm the issue is resolved. 6. Browse several pages in English and confirm not affected.
Created attachment 182920 [details] [review] Bug 40040: RTL CSS files not loaded in templates; legacy right-to-left.css causing UI issues This patch removes the legacy right-to-left.css file, which is no longer maintained and has started causing issues in the RTL (Right-to-Left) UI. We now use Gulp-generated RTL CSS files for better maintainability. In limited cases, we use /*rtl:raw: to target RTL-specific styles. This does not affect the default LTR (Left-to-Right) UI, as rtl:raw is handled by the gulp-rtlcss plugin during the build phase. To test: 1. Install the Arabic translation: koha-translate -i ar-Arab 2. Open the staff interface (with the broken CSS) and confirm the issue by browsing several pages. 3. Apply this patch. 4. Run: yarn css:build 5. Browse several pages in Arabic and confirm the issue is resolved. 6. Browse several pages in English and confirm not affected. Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Thanks, Owen — appreciate your sign-off. By the way, it’s not clear to me whether any additional steps are needed to include the RTL files in the final Debian package. I checked version 25.05.1, and it doesn’t contain the RTL files for the staff interface — even though they were part of the Gulp build before this change. Missing files in the Debian package: • calendar-rtl.css • holds-rtl.css • ill-requests-rtl.css • installer-rtl.css • mainpage-rtl.css • staff-global-rtl.css I checked in /usr/share/koha/intranet/htdocs/intranet-tmpl/prog/css. let me know if I need to work on this in some other parts / scripts.