0042105: use CSS @font-face instead of system fonts

Openbravo Issue Tracking System - Openbravo ERP

View Issue Details

Project

Category

View Status

Date Submitted

Last Update

0042105

Openbravo ERP

B. User interface

public

2019-10-23 11:10

2022-02-01 08:07

Reporter

alostale

Assigned To

Triage Platform Base

Priority

normal

Severity

minor

Reproducibility

have not tried

Status

acknowledged

Resolution

open

Platform

OS Version

Product Version

Target Version

Fixed in Version

Merge Request Status

Review Assigned To

OBNetwork customer

Web browser

Modules

Core

Support ticket

Regression level

Regression date

Regression introduced in release

Regression introduced by commit

Triggers an Emergency Pack

Summary

0042105: use CSS @font-face instead of system fonts

Description

Backoffice styles rely on OS fonts, this causes different OS/browser combinations to render differently.

Steps To Reproduce

With Ubuntu 18.04, compare for example login page in Firefox and Chrome. Attached example comparing FF 69 with Chrome 77.

Proposed Solution

Instead of using sytem fonts, load them in CSS by using wof files.

Download "@font-face Kit" [1] from:

    https://www.cufonfonts.com/font/arial [^]
    https://www.cufonfonts.com/font/lucida-sans [^]

Change font families in CSS to (check example.html in latter links):

    font-family:'Arial Regular'
    font-family:'Lucida Sans Regular'

Note, this approach has been followed in new WebPOS skin.

---
[1] https://www.w3schools.com/cssref/css3_pr_font-face_rule.asp [^]

Additional Information