Use Vazir font with a node module instead of CDN

[NeOMakinG]

Questions	Answers
Branch?	develop
Description?	Using a CDN exposes users to a risk of data abuse and privacy abuse, so we swap to a local font using npm
Type?	improvement
Category?	BO
BC breaks?	no
Deprecations?	no
Fixed ticket?	Fixes #27541.
How to test?	RTL language font should be loaded normally (tested it, works fine), also when you run npm run build on default, new-theme and classic/_dev folder, it should generate a thirdPartyNotice.json file in the asset folder, containing every notices
Possible impacts?	RTL font

---

This change is 

[NeOMakinG]

Can be QA by a dev I think so!

[matks]

I remember we discussed using a CDN, yes or no, for another topic.

Maybe we should add a mention in devdocs FAQ about this?

[NeOMakinG]

I remember we discussed using a CDN, yes or no, for another topic.

Maybe we should add a mention in devdocs FAQ about this?

could probably be useful yes

[mparvazi]

Great improvement 💯

Some suggestions:

1- Just need to use woff and woff2 for font-face (to me woff2 is enough!)
Why you should be responsible for users who are stuck in the past? (eot only uses by IE, ttf only needed for very old browsers). IMO a browser that doesn't support woff2, also it doesn't support some components in BO.

@font-face {
  font-family: Vazir;
  font-style: normal;
  font-display: swap;
  font-weight: 300;
  src: url("~vazir-font/dist/Vazir-Light.woff2") format("woff2"), url("~vazir-font/dist/Vazir-Light.woff") format("woff");
}

@font-face {
  font-family: Vazir;
  font-style: normal;
  font-display: swap;
  font-weight: 400;
  src: url("~vazir-font/dist/Vazir-Regular.woff2") format("woff2"), url("~vazir-font/dist/Vazir-Regular.woff") format("woff");
}

@font-face {
  font-family: Vazir;
  font-style: normal;
  font-display: swap;
  font-weight: 700;
  src: url("~vazir-font/dist/Vazir-Bold.woff2") format("woff2"), url("~vazir-font/dist/Vazir-Bold.woff") format("woff");
}

The number of fonts will be reduced from 15 to 6 in the public folder.

2- The rtl_rtl.css will be generated by CSSJanus in public folder, but only rtl.css will be used, so need to prevent transforming rtl.css by CSSJanus (PHP plugin that use by StylesheetGenerator.php). Because in future you may put overrides of RTL inside rtl.scss (plan to stop using theme.rtlfix).
src/Core/Localization/RTL/StylesheetGenerator.php

3- We don't have any call for rtl.css in Login page:
controllers/admin/AdminLoginController.php

4- The license text for vazir-font is null. I think it's related to missing "LICENSE" file in project's root folder.

Can use replenishDefaultLicenseTexts option (when this is enabled, default license texts are taken from spdx.org for packages where no license text was found):

5- After webpack build for default theme, there is an empty rtl.bundle.js file, so we can use webpack-remove-empty-scripts.

[NeOMakinG]

@mparvazi Every points are fixed, except the rtl.css with CSSJanus, actually we can't do it, it's not a problem for the moment but we need to take care about the fact that no one add something else than fonts inside rtl.scss

[mparvazi]

@NeOMakinG
I tested and works fine.

[matks]

@Robin-Fischer-PS @NeOMakinG I suggest a dev does the QA?

[NeOMakinG]

@matks yeah, why not!

[Robin-Fischer-PS]

@matks @NeOMakinG I need some more info : Is there a high risk of regressions on RTL display ? If so, I would like to have a regression test made by one of the QA girls.

[NeOMakinG]

@matks @NeOMakinG I need some more info: Is there a high risk of regressions on RTL display? If so, I would like to have a regression test made by one of the QA girls.

• RTL won't work fine anymore on IE11 (which is not supported anymore in june) and some very old browsers with low usage
• No high risk of regressions on other browsers

[matks]

I checked out the branch and tested. As far as I see it works as expected.