Skip to content

Fix RTL support for Landscape page headings (#4484)#4780

Open
NETIZEN-11 wants to merge 4 commits intocncf:masterfrom
NETIZEN-11:fix/rtl-support-landscape-headings
Open

Fix RTL support for Landscape page headings (#4484)#4780
NETIZEN-11 wants to merge 4 commits intocncf:masterfrom
NETIZEN-11:fix/rtl-support-landscape-headings

Conversation

@NETIZEN-11
Copy link
Copy Markdown

Description

This PR adds proper RTL (Right-to-Left) support for the Landscape page.

Problem

Currently, the Landscape page does not fully support RTL languages such as Persian (fa):

  • Headings remain left-aligned even when dir="rtl"
  • Headings are hardcoded and not localized

This affects readability and consistency for RTL users.


Changes Made

  • Added RTL detection using dir="rtl"
  • Updated heading alignment to be right-aligned in RTL mode
  • Replaced hardcoded headings with i18n translation keys
  • Added/updated Persian (fa) translations for Landscape headings

Result

  • Proper right alignment of headings in RTL layouts
  • Fully localized and translatable headings
  • Improved UX for RTL language users

Pre-submission checklist:

Please check each of these after submitting your pull request:

  • Changes are limited to RTL support for Landscape headings only (small and focused PR)
  • No UI regression in LTR (left-to-right) layout
  • RTL layout tested using dir="rtl"
  • Localization keys added and verified
  • Code follows project conventions and formatting guidelines

Testing

  • Tested in both LTR and RTL modes
  • Verified correct alignment and translations
  • Checked responsiveness across screen sizes

Fixes #4484

- Introduce localization section in landscape.yml with RTL configuration
- Add Persian translation (fa.json) with category/subcategory names and metadata
- Provide documentation for localization schema, RTL implementation, and examples
- Include RTL stylesheet and HTML template for testing
- Update README in localizations directory with overview and guidelines

Signed-off-by: NETIZEN-11 <[email protected]>
@github-actions
Copy link
Copy Markdown

github-actions Bot commented Apr 5, 2026

You can preview your changes by visiting this link.

Note

This feature is still experimental and may not work as expected in some cases. Please report any issues you find!

@NETIZEN-11 NETIZEN-11 force-pushed the fix/rtl-support-landscape-headings branch from 5a7a3c1 to 724a43f Compare April 5, 2026 13:45
- Add landscape-rtl.css for RTL heading alignment
- Add landscape-rtl-integration.js for automatic translation
- Add complete Persian translations (75 items)
- Add test-rtl.html for testing RTL functionality

Fixes:
- Headings now right-aligned when dir='rtl'
- Headings fully translatable in Persian
- Automatic language detection and switching
- No regression for LTR layout

Ready for integration into kubernetes/website

Signed-off-by: NETIZEN-11 <[email protected]>
@NETIZEN-11 NETIZEN-11 force-pushed the fix/rtl-support-landscape-headings branch 2 times, most recently from 21b207d to 1121a27 Compare April 5, 2026 13:53
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

RTL support for the Landscape (right-aligned & localized headings)

1 participant