Render three columns

share/al-quran.reflectslight.io/CHANGELOG

@@ -2,6 +2,10 @@
 
 ** vNEXT
 
+**** Render three columns on ~SurahIndex.tsx~
+The ~SurahIndex.tsx~ component renders three columns for RTL
+languages (compared with two columns before)
+
 **** Revisit ~SurahStream.tsx~ for RTL languages
 The appearance of the ~SurahStream.tsx~ component was revisted
 for RTL languages, especially Arabic

src/js/components/SurahIndex/index.tsx

@@ -46,7 +46,7 @@ export function SurahIndex({ locale, surahs, t }: Props) {
           <li
             className={classNames("flex justify-center surah", {
               "w-full": locale.direction === "ltr",
-              "w-1/2": locale.direction === "rtl",
+              "w-1/3": locale.direction === "rtl",
             })}
             key={key}
           >