UI Building Blocks

Next

Global Typography

Overview

Global Typography is required for the Responsive Header Footer and can be extended to the Body or Content Area for any responsive web page, section, or application. The Global Typography implementation provides all the necessary worldwide configurations for font families, styles, and fallback system fonts that adheres to HP.com web standards. The responsive version of Global Typography provides the correct configuarion for all HP Simplified custom fonts and System fonts for APJ locales. Additionally, responsive version of Global Typography provide all the releative unit specifications that align with the HP.com Breakpoint specification and Browser & Device standards.

For detailed configuration information in each locale, see the Global Typography Integration documentation.

For detailed worldwide typography specifications, use the Typography link in the header footer above or references links below.

Global Typography Specifications

Integration

The typography css should be included before the global css(rdt.css).Depending on the locale corresponding rdt-typo-{{locale-typo}}.css or if not locale specific rdt-typo.css should be used.

  • The file path for the typography css should be 'filepath/styles/rdt-typo.css
  • The file path for the locale specific typography css should be 'filepath/styles/rdt-typo{{locale-typo}}.css

Codes Defined:

  • {locale-typo} = Country code
  • Ex: -jp-ja

List of all available typography css