diff --git a/share/al-quran.reflectslight.io/CHANGELOG.txt b/share/al-quran.reflectslight.io/CHANGELOG.txt index 02d6a46..cd163b8 100644 --- a/share/al-quran.reflectslight.io/CHANGELOG.txt +++ b/share/al-quran.reflectslight.io/CHANGELOG.txt @@ -2,6 +2,12 @@ * vNEXT +** Apply Amiri font for Farsi +Similar to Arabic - apply the Amiri Regular font for the content +of a surah. With this change the distinction is more so between a +RTL language vs a LTR language rather than between Arabic vs English +vs Farsi + ** Center-align ~ul.body.stream~ For RTL languages we will show the content of a surah centered, and within a max width of 470px diff --git a/src/css/main/SurahStream.scss b/src/css/main/SurahStream.scss index bfaee6e..b143316 100644 --- a/src/css/main/SurahStream.scss +++ b/src/css/main/SurahStream.scss @@ -19,7 +19,7 @@ body .root .content.theme { } body .root .content.theme.rtl { - ul.body.stream[lang="ar"] { + ul.body.stream { li.ayah p { @extend .font-amiri; } diff --git a/src/js/components/SurahStream/Stream.tsx b/src/js/components/SurahStream/Stream.tsx index 2ca07a8..b1861a5 100644 --- a/src/js/components/SurahStream/Stream.tsx +++ b/src/js/components/SurahStream/Stream.tsx @@ -22,6 +22,7 @@ export function Stream({ }: Props) { const className = endOfStream || isPaused ? ["scroll-y"] : []; const isArabic = locale.name === "ar"; + const isRTL = locale.direction === "rtl"; const ref = useRef(null); const ul = useMemo(() => { return ( @@ -38,8 +39,8 @@ export function Stream({
  • @@ -63,7 +64,7 @@ export function Stream({

    {ayah.body}