MediaWiki talk:Common.css: Difference between revisions

(5 intermediate revisions by 3 users not shown)

Line 1:

== ~~consistent~~ font appearance on Mac & Windows ==

== Consistent Bravura font appearance on Mac & Windows ==

In order for BravuraText to appear the same on Mac and Windows, the following CSS properties need to be included with the .bravura class:

Line 6:

This doesn't change how BravuraText appears on Windows, but it makes it look less ugly and chunky on Mac.

I would add them myself, but I do not have the ability to modify this page. --[[User:Cmloegcmluin|Cmloegcmluin]] ([[User talk:Cmloegcmluin|talk]]) 04:09, 5 October 2024 (UTC)

: I don't have the required permissions either. --[[User:Fredg999|Fredg999]] ([[User talk:Fredg999|talk]]) 00:41, 7 October 2024 (UTC)

:: I added the requested code. Does the HEJI font want it too? [[User:FloraC|FloraC]] ([[User talk:FloraC|talk]]) 19:59, 7 October 2024 (UTC)

::: Thanks for that. Sorry I didn't think about the HEJI font in advance. It's only used on [[User:Fredg999/Sandbox]] at this time but I checked it there and yes, it makes the appearance on Mac nicer and makes it match the appearance on Windows when you add it to the HEJI2Text font, too. --[[User:Cmloegcmluin|Cmloegcmluin]] ([[User talk:Cmloegcmluin|talk]]) 20:52, 7 October 2024 (UTC)

:::: Right. [[User:FloraC|FloraC]] ([[User talk:FloraC|talk]]) 20:57, 7 October 2024 (UTC)

== This Bravura does not work on Android ==

On Android, the BravuraText doesn't work at all. Only glyph-not-found boxes are shown:

[[File:A8aeaaf6-0763-4563-bb8f-499a78af982f.jpg|300px]]

The latest version of Chrome (v129) is supposed to be able to handle .woff2 files, but perhaps it can't read this one. Maybe another font file format is needed? --[[User:Cmloegcmluin|Cmloegcmluin]] ([[User talk:Cmloegcmluin|talk]]) 04:48, 5 October 2024 (UTC)

: I have been able to reproduce the issue on Chrome, but it works fine on Firefox (both on Android obviously). It might be a browser-specific issue, and it would require further investigating. --[[User:Fredg999|Fredg999]] ([[User talk:Fredg999|talk]]) 00:41, 7 October 2024 (UTC)

:: Thanks for reproducing, and for the extra information. I investigated further and found [https://stackoverflow.com/a/22307695/23289414 this StackOverflow answer] which suggests Android Chrome has a unique problem among browsers in that it fails to download fonts unless they're used in an element present on initial render. Perhaps the <code><nowiki>{{bravura}}</nowiki></code> templates render too late, then. If that's the explanation for the problem, then we may be able to solve it by using [[MediaWiki:Common.js]] to add something hidden like the following to every page:

:: <code><nowiki>

$('body').append('<div style="visibility: hidden; font-family: BravuraText;">(loading BravuraText)</div>');

</nowiki></code>

:: --[[User:Cmloegcmluin|Cmloegcmluin]] ([[User talk:Cmloegcmluin|talk]]) 01:50, 7 October 2024 (UTC)

@@ Line 1: / Line 1: @@
-== consistent font appearance on Mac & Windows ==
+== Consistent Bravura font appearance on Mac & Windows ==
 In order for BravuraText to appear the same on Mac and Windows, the following CSS properties need to be included with the .bravura class:
@@ Line 6: / Line 6: @@
 This doesn't change how BravuraText appears on Windows, but it makes it look less ugly and chunky on Mac.
 I would add them myself, but I do not have the ability to modify this page. --[[User:Cmloegcmluin|Cmloegcmluin]] ([[User talk:Cmloegcmluin|talk]]) 04:09, 5 October 2024 (UTC)
+: I don't have the required permissions either. --[[User:Fredg999|Fredg999]] ([[User talk:Fredg999|talk]]) 00:41, 7 October 2024 (UTC)
+:: I added the requested code. Does the HEJI font want it too? [[User:FloraC|FloraC]] ([[User talk:FloraC|talk]]) 19:59, 7 October 2024 (UTC)
+::: Thanks for that. Sorry I didn't think about the HEJI font in advance. It's only used on [[User:Fredg999/Sandbox]] at this time but I checked it there and yes, it makes the appearance on Mac nicer and makes it match the appearance on Windows when you add it to the HEJI2Text font, too. --[[User:Cmloegcmluin|Cmloegcmluin]] ([[User talk:Cmloegcmluin|talk]]) 20:52, 7 October 2024 (UTC)
+:::: Right. [[User:FloraC|FloraC]] ([[User talk:FloraC|talk]]) 20:57, 7 October 2024 (UTC)
+== This Bravura does not work on Android ==
+On Android, the BravuraText doesn't work at all. Only glyph-not-found boxes are shown:
+[[File:A8aeaaf6-0763-4563-bb8f-499a78af982f.jpg|300px]]
+The latest version of Chrome (v129) is supposed to be able to handle .woff2 files, but perhaps it can't read this one. Maybe another font file format is needed? --[[User:Cmloegcmluin|Cmloegcmluin]] ([[User talk:Cmloegcmluin|talk]]) 04:48, 5 October 2024 (UTC)
+: I have been able to reproduce the issue on Chrome, but it works fine on Firefox (both on Android obviously). It might be a browser-specific issue, and it would require further investigating. --[[User:Fredg999|Fredg999]] ([[User talk:Fredg999|talk]]) 00:41, 7 October 2024 (UTC)
+:: Thanks for reproducing, and for the extra information. I investigated further and found [https://stackoverflow.com/a/22307695/23289414 this StackOverflow answer] which suggests Android Chrome has a unique problem among browsers in that it fails to download fonts unless they're used in an element present on initial render. Perhaps the <code><nowiki>{{bravura}}</nowiki></code> templates render too late, then. If that's the explanation for the problem, then we may be able to solve it by using [[MediaWiki:Common.js]] to add something hidden like the following to every page:
+:: <code><nowiki>
+$('body').append('<div style="visibility: hidden; font-family: BravuraText;">(loading BravuraText)</div>');
+</nowiki></code>
+:: --[[User:Cmloegcmluin|Cmloegcmluin]] ([[User talk:Cmloegcmluin|talk]]) 01:50, 7 October 2024 (UTC)