Larger default font size? Topic is solved

[Jenga218]

I've been thinking it myself but tolerating it, but others have raised this too (https://duolingo.hobune.stream/comment/ ... d=56107546).

Just wondering if a slight increase to the default font size is possible? I know you're working on making the forum look more 'familiar' - I note that the default font size on Duolingo is quite a bit bigger than the default font here.

Thanks!

[duome]

This can now be tweaked in User Control Panel - Board preferences. The options are:

• Would you prefer the font to be larger?
• Would you prefer a different font size for mobile devices?

[Deleted User 133]

While at it, is it possible to add a set of professionally-looking free fonts? Google fonts maybe?
https://fonts.google.com/

[luo-ning]

This can now be tweaked in User Control Panel - Board preferences.

There's a bug in the implementation of these options: they're implemented by setting a percentage font-size on the selector *, meaning that every child element is scaled by that amount, relative to its parent. So an element with 3 ancestors is rendered at [percentage] ^ (3 + 1), e.g. for 105% it would be ~121.55%; meanwhile, an element with 10 ancestors would be rendered at 105% ^ (10 + 1) ≈ 171.03%.

To put it another way, <span><span>abc</span></span> is bigger than <span>abc</span>, even if those span elements have no styling info associated with them!

This already looks a little off if you choose "130%" (the actual value used for this is 104%, presumably because actually using 130% would look horrendous). Worse, if you choose the maximum "400%" (actual value 120%), elements closer to the root are rendered at a reasonable but slightly-increased size, whereas elements further from the root are rendered at a GIGANTIC size. Here's an example:

400pct.png (75.65 KiB) Viewed 6186 times

---

===
To fix this, the > selector can be used to only affect direct descendents of body, like this:

Code: Select all

body > * {
    font-size: 150%;
}

This would give consistent scaling across all of the UI.

[duome]

While at it, is it possible to add a set of professionally-looking free fonts? Google fonts maybe?
https://fonts.google.com/

Which one do you prefer?

[Deleted User 133]

I'm looking mainly at fonts that are made for both Arabic and Latin letters. My favorite is Dubai font, but for diversity's sake, a few others would be nice to add as well, like Tajawal, Ruqa and Amiri.

[luo-ning]

I'm looking mainly at fonts that are made for both Arabic and Latin letters. My favorite is Dubai font, but for diversity's sake, a few others would be nice to add as well, like Tajawal, Ruqa and Amiri.

Using different fonts for each supported script (Arabic, Hindi, Cyrillic, Greek, Hebrew, Korean, Chinese, Hiragana/Katakana) could get complicated, and multiple typefaces for each script could become resource-heavy too. Unless the idea is to have users select from a dropdown and only download/use the selected font? But I can't find any existing extensions that enable that functionality.

[luo-ning]

It might still be worth looking into fancy Google fonts or other webfonts, but for now can we at least remove Verdana from the font list? I just noticed the horrendous violence it inflicts on the poor letter “ǎ”:

verdana-a.PNG (1.96 KiB) Viewed 6067 times

Fix:

Code: Select all

body, legend, input, textarea, optgroup, select, dl, a.button1, input.button1,
a.button2, input.button2, .successbox h3, .errorbox h3, .button, h4,
dl.details, .pagination li.active span, .postbody h3, .content, .content p,
dl.faq, p.author, .notice, dl.file, dl.file dt, dl.thumbnail dd,
fieldset.polls, fieldset, select optgroup option, .message-box textarea,
input.button3, h1, h2, h3, h1 a, h2 a, h3 a, .author, .date {
    font-family: Oxygen, Helvetica, Arial, sans-serif;
}

[duome]

I'm looking mainly at fonts that are made for both Arabic and Latin letters. My favorite is Dubai font, but for diversity's sake, a few others would be nice to add as well, like Tajawal, Ruqa and Amiri.

I added Dubai font for <div[dir="RTL"]> (i.e. RTL BBCode content).
I'm also trying a slightly bigger/narrower font for the rest of the forum, which would also help cyrillic letters - there shouldn't be such a huge diffrence between cyrillic and latin now. Please, see if it's better like this... (just a quick test of different font-styles here).

Ctrl+F5...

[Deleted User 133]

"في منتصف رحلة الحياة
استيقظت لأجد نفسي في غابة مظلمة
لأني انحرفت عن الطريق الصحيح
يا إلهي كم يصعب وصفها
كم كانت تلك الغابة قاسية ووحشية
مجرد التفكير فيها يعيد بعث الخوف بداخلي
الذهاب إلى الجحيم والعودة منه"

الكوميديا الإلهية

---

Looking great!
Thank you.

[Basler Biker]

"في منتصف رحلة الحياة
استيقظت لأجد نفسي في غابة مظلمة
لأني انحرفت عن الطريق الصحيح
يا إلهي كم يصعب وصفها
كم كانت تلك الغابة قاسية ووحشية
مجرد التفكير فيها يعيد بعث الخوف بداخلي
الذهاب إلى الجحيم والعودة منه"

الكوميديا الإلهية

---

Looking great!
Thank you.

even I can read it now !

[Deleted User 133]

I'm also trying a slightly bigger/narrower font for the rest of the forum, which would also help cyrillic letters - there shouldn't be such a huge diffrence between cyrillic and latin now. Please, see if it's better like this... (just a quick test of different font-styles here).

If you ask me, I'd say the computer version should have even bigger font sizes. There is so much space going to waste. The sentences don't even occupy half of the content body. If you take a look at most of the instructive sites, you'll find that the sizes of fonts are kinda big, that plays a big role in making the reader stay and continue reading. I know there is an option to increase the size in the UCP but that increases the size of everything, and would require the users to be registered to begin with, while the people we want to attract with the content and make them stay --register as well-- are the visitors, who do not have such control. I can imagine many visitors disregarding the forums just because they have difficulties reading its content. So maybe it's worth taking that into consideration if it's going to attract more people here and make them stay.

[duome]

Bigger font sizes - I need to get used to them now that I have been watching the smaller fonts for so many weeks, even this +1px was killing me for the first few minutes when I kept switching those variants back and forth, now another +1px doesn't look like a disaster, but... give me just a little more time ))

RTL text size can be increased independently. We could start with this.. )

[Basler Biker]

I'm also trying a slightly bigger/narrower font for the rest of the forum, which would also help cyrillic letters - there shouldn't be such a huge diffrence between cyrillic and latin now. Please, see if it's better like this... (just a quick test of different font-styles here).

If you ask me, I'd say the computer version should have even bigger font sizes. There is so much space going to waste. The sentences don't even occupy half of the content body. If you take a look at most of the instructive sites, you'll find that the sizes of fonts are kinda big, that plays a big role in making the reader stay and continue reading. I know there is an option to increase the size in the UCP but that increases the size of everything, and would require the users to be registered to begin with, while the people we want to attract with the content and make them stay --register as well-- are the visitors, who do not have such control. I can imagine many visitors disregarding the forums just because they have difficulties reading its content. So maybe it's worth taking that into consideration if it's going to attract more people here and make them stay.

Just on a personal note ... to say that the larger the text on an advertizing paper coming in by post here, I throw away, because I have seen it in a blink of an eye without reading. And also if there is a picture that I recognize and don't like, in the recycle bin. BUT... the smaller the font, and no picture, I tend to read before I throw away... But that's maybe not applicable for flashy pages and web-articles ...

Whatever font, it must be very readable, yet BIGger is not more readable. We used to have a nice font on the former computers (forgot the name) then came verdana and suddenly all I saw everywhere was verdana (or was it calibri . Anyway, about readability, Time new Roman, from the newspaper The Times, must have been somewhat readable too ...

Here a screenshot from Word at 100%, just something I wanted to check on readability...12 pt is too big of course. This was the older Word standard. They changed it to default 11 pt. I often set it to 10, because 11 is the fools number. Don't like 9 either, so for smaller textx I go to 8. But that's all very personal of course.

That said - I have my PC browser chrome at 100% now, and can read all duome text and the screenshot text very well, and not even with my "computer" reading glasses on. Also the italics and the bold.

[Basler Biker]

https://gathercontent.com/blog/what-mak ... -read-font

[Deleted User 133]

I added Dubai font for <div[dir="RTL"]> (i.e. RTL BBCode content).

Back here again... So far, that Dubai font update was great. It still is.
The problem now is that, unless the RTL is manually added to the text in the editor, the text will remain aligned from left to right, and the font won't change.
And since the users of Arabic already have the whole forums in Arabic language (topics are automatically aligned correctly), they can't tell the difference, and only those who have the forums in a different language can (like the learners of Arabic who have the forums in English).

I wonder if there is a way to make the editor --in the Arabic forum specifically-- force the RTL code by default. That would be immense!
Moreover, I have an idea that I want to try with you to merge the Dubai font with the default font of the website, PT Sans isn't it?
[mention]duome[/mention]

[luo-ning]

[mention]Alivated[/mention] it might be possible to leverage the code I added for A/B testing for this. The original idea was to apply certain code only to the testing forum while trialing new functionality, but it should work equally well for applying code only to the Arabic/Hebrew forums and their subforums. I'll look into it probably today or tomorrow.

[Deleted User 133]

That's really great news and promises many features for the Arabic/Hebrew side of this site that I was worried won't be possible.

[luo-ning]

[mention]Alivated[/mention] [mention]MatOzone[/mention] [mention]duome[/mention] as you three thanked me for my post, I've opted you into the A/B test of this feature you three should now see that RTL is the default direction for post content display and editing in the Arabic, Hebrew, and Yiddish subforums (but not the corresponding "I'm learning..." forums from English — the assumption is that the base language for those is still English).

The logic also works in reverse — if your language is set to Arabic but you're in an LTR subforum, post content etc. will be LTR by default.

I've also added an [ltr] BBCode to correspond to the [rtl] one — as you'd expect, it does the exact opposite (forces LTR in otherwise RTL contexts).

Let me know if that looks good. If so, I'll enable it for all users.

[Deleted User 133]

the assumption is that the base language for those is still English.

Correct!

you three should now see that RTL is the default direction for post content display and editing in the Arabic, Hebrew, and Yiddish subforums

The logic also works in reverse — if your language is set to Arabic but you're in an LTR subforum, post content etc. will be LTR by default.

That is some brilliant work indeed.

Let me know if that looks good. If so, I'll enable it for all users.

The functionality is perfect. The aesthetics need a bit of tweaking.
Take a look at how the editor looks like when switching to Arabic (didn't try Hebrew).

Screenshot 2022-04-11 at 23-12-56 Duolingo Forum @ duome.eu - إضافة موضوع جديد.png (42.63 KiB) Viewed 5984 times

I think it has to do with the Font Awesome tag [fa] not being compatible with RTL. That is why the alignment icons don't show, as well as when I tried [fa] in posts with RTL before.

[luo-ning]

That's with the whole forum language set to Arabic, right? The whole-forum layout issues will take quite a bit more fixing, as they're due to the underlying ProLight theme.

It might be worth simply forking ProLight and naming the forked version "Duome theme" or something, as the version we use is already somewhat customized. Fixing everything in RTL will need quite a few changes, but might be doable with minimal pain by using a plugin to change all "physical" CSS properties to "logical" ones (e.g. xyz-left -> xyz-inline-start). But if we fork, that also means we'll need to maintain it ourselves in the long term.

I believe the ProLight license requires all derivative work to be released under the same free software license, but that's true of most phpBB extensions/styles anyway.

[Deleted User 133]

Can we contact the author to include the edits in his updates, at least the basic edits that will allow us to further customize individual forums? That will exempt us from maintaining a forked version and would also upgrade --in a sense-- ProLight's support for Arabic.

[Corinnebelle]

[mention]Alivated[/mention] [mention]luo-ning[/mention] This idea of a default RTL for "I speak" Hebrew and Arabic is great! I have to use the full editor to access that option right now, but it would be great if it was just automatic from the quick reply. I don't know if that is something the current system doesn't cater for.

[luo-ning]

Can we contact the author to include the edits in his updates, at least the basic edits that will allow us to further customize individual forums? That will exempt us from maintaining a forked version and would also upgrade --in a sense-- ProLight's support for Arabic.

Potentially yes, but there are some other things that need changing, e.g. possibly creating a custom dark-themed version. That'll be much easier using CSS variables, which ProLight doesn't currently use. Can probably also be done by running the whole thing through a plugin.

Then again, some ProLight styles still come from Prosilver, ProLight's "parent" style, so those would need to be added and updated with logical properties and CSS variables.

All of this will add up to a somewhat increased file size and also dropping support for legacy browsers e.g. Internet Explorer, so there are tradeoffs.

This idea of a default RTL for "I speak" Hebrew and Arabic is great! I have to use the full editor to access that option right now, but it would be great if it was just automatic from the quick reply. I don't know if that is something the current system doesn't cater for.

This should be enabled for all users in those forums now (including for quick-reply).

[Deleted User 133]

I added Dubai font for <div[dir="RTL"]> (i.e. RTL BBCode content).

Quick question, @duome @luo-ning:
Could the the text format in between code markers also be modified separately in the <div[dir="RTL"]> from the default font format?
By code markers I mean those

Code: Select all

` some text `

[luo-ning]

I'm not really a fan of setting fonts dependent on text directionality, as they're separate concerns... I assume Dubai font doesn't have glyphs for Hebrew script, for example.

A better approach would be setting the font for a unicode-range. Perhaps for the basic Arabic Unicode block, U+0600..U+06FF?

Edit: Why do you want this specifically for code blocks? Is it something that could even be solved by setting a unicode-range?

[Deleted User 133]

A better approach would be setting the font for a unicode-range. Perhaps for the basic Arabic Unicode block, U+0600..U+06FF?

Not sure about the range, but I did have this idea in mind to try: copying the glyphs from Dubai to their corresponding block in PT Sans Font. I am 90% positive it will work as intended. Should I go for it?

I have an idea that I want to try with you to merge the Dubai font with the default font of the website, PT Sans isn't it?

---

Edit: Why do you want this specifically for code blocks? Is it something that could even be solved by setting a unicode-range?

Just wanted to increase its size of the Arabic letters in the code block because they appear really small.

[luo-ning]

Now set using unicode-range, so it'll apply to all Arabic text in all contexts that use the default font.

I'd generally advise against using the code syntax for stuff that isn't code — emphasis can be done with bold, color, etc. But if you really want extra-large inline code, you can do this (adjust size as required):

Code: Select all

[size=200]`code`[/size]

code

[Deleted User 133]

Great update. It even fixed the narrow spacing Arabic had between the lines before. Thank you.
Does the unicode-range work for Hebrew too? Has anyone suggested any improvements yet?

[luo-ning]

It'll work for any script if a relevant font is installed.