readium-css
readium-css copied to clipboard
Space between words on RTL
Could any one provide any additional references or solutions for adjusting word-spacing in RTL layout?
As it's mention it works on LTR layout only.
/** * Space between words. * * Only effective when: * - the publication is reflowable * - the layout is LTR */ val wordSpacing: RangePreference<Double> = RangePreferenceDelegate( getValue = { preferences.wordSpacing }, getEffectiveValue = { state.settings.wordSpacing ?: 0.0 }, getIsEffective = ::isWordSpacingEffective, updateValue = { value -> updateValues { it.copy(wordSpacing = value) } }, supportedRange = 0.0..1.0, progressionStrategy = DoubleIncrement(0.1), valueFormatter = percentFormatter(), )
So it’s not exported in ReadiumCSS distributed stylesheets for RTL as we don’t really know how to handle it, either because we didn’t find answers in The W3C Internationalization resources or we haven’t had people fluent in one or several RTL languages, and their typography, help us through feedback or feature requests, and details how to implement it properly.
This means the following submodule is not available in RTL: https://github.com/readium/readium-css/blob/develop/css/src/modules/user-settings-submodules/ReadiumCSS-wordSpacing_pref.css
It’s an issue we’ve had in the past, cf. https://github.com/edrlab/thorium-reader/issues/1207 but nothing has really progressed on that front.
At some point I know Thorium had to implement letter-spacing for Japanese. and we backported the feature in ReadiumCSS a few weeks ago.
CC’ing @danielweck as it would therefore be beneficial to see how ReadiumCSS can improve support for this feature in RTL instead of having it implemented in forks, etc.
Hi @JayPanoz Maybe I can help on this. I am an expert with CSS RTL, Hebrew and Arabic have a really big user base, so it will be grate to have support for Word spacing and Letter spacing on RTL. Can you send me exactly where you have an issue ?
Thanks for your patience.
So the overarching issue was that no one could really confirm to us whether these settings were used in RTL languages and if what browsers currently do is what one would expect – we’re just using CSS’ letter- and word-spacing behind the scenes, or whether it was a lot more complex than that.
In practice, in the first case it’s one module to enable in ReadiumCSS’ RTL export and some docs to update.
In the second case then guidance and examples would have to be provided so that I can take a look at how to do it with pure CSS.
Thank you for the information. Could you please clarify what exactly you meant by using readium-css? I'm not sure how it should be applied or integrated, especially in terms of letter-spacing and word-spacing.
ReadiumCSS, this repository, is the library of CSS styles that Thorium and Readium Toolkits (Kotlin, Swift, TypeScript/web) use to implement user settings.
The user setting for word-spacing is a simple set of declarations, it's just that is it not exported for RTL at the moment.
But if the CSS properties do what is expected by users for RTL, it can be added very quickly.
Hi @JayPanoz Please see the video attached As you can see word-spacing works exactly the same in Hebrew as it works in English So you can just export it for RTL and it will work
Word-spacing for RTL is now available in develop branch (so that’s version 2 of ReadiumCSS).
I’m expecting it will take some additional time for it to propagate and the setting be available in apps since they have to migrate to this new version of ReadiumCSS though.
Thank you @JayPanoz ! How long do you think it will take to see it is live on the Apps ?
I know the migration is on the roadmap of Thorium and Readium Toolkits for the end of this year but let me check more precisely with their maintainers.
I'll get back to you once I have more details.
It will likely not be done before next year on the mobile toolkits. On the web toolkit it will be done very soon.
@mickael-menu Hi, Is there a way that I can migrate it on my project Apps so I will be able to use the word-spacing on my RTL mobile Applications?