diff --git a/Alert/Alert.module.less b/Alert/Alert.module.less index 38d70fbe1..7f9a20ab6 100644 --- a/Alert/Alert.module.less +++ b/Alert/Alert.module.less @@ -9,6 +9,9 @@ } .alert { + .title { + font-family: @lime-title-font-family; + } &.noImage { /* Needed to prevent global class being added in the DOM */ } diff --git a/CHANGELOG.md b/CHANGELOG.md index 36e5e0b85..9ceb32372 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -8,7 +8,9 @@ The following is a curated list of changes in the Enact limestone module, newest - `limestone/Alert` `size` prop for overlay type - `limestone/Alert` styling to match the latest GUI +- `limestone/Input` `title` to use the `LGSmart UI 3.0 Title` font, - `limestone/Icon` supported icon list, adding new icons `smartmode`, `databackup`, `deleteviewinginfo`, `lgmembers`, `manage`, `pay`, `paymentmethod`, `productregistration`, `purchased`, `rate`, `report`, `security`, `subscriptions`, `terminatemyaccount`, `update`, `usagecare`, `voucher`, `filter`, `ezsetting`, `fitness`, and `auracast2` +- `limestone/Panels.Header` `title` to use the `LGSmart UI 3.0 Title` font - `limestone/Scroller` prop `stickTo` to allow the scroller to stick to a specific element - `limestone/VirtualGridList` prop `stickTo` to allow the scroller to stick to a specific element - `limestone/VirtualList` prop `stickTo` to allow the scroller to stick to a specific element diff --git a/Input/Input.module.less b/Input/Input.module.less index ff090f82f..29e13427d 100644 --- a/Input/Input.module.less +++ b/Input/Input.module.less @@ -235,6 +235,7 @@ } .title { + font-family: @lime-title-font-family; margin: @lime-input-overlay-title-margin; .lime-font-size(@lime-input-overlay-title-font-size, @lime-non-latin-input-overlay-title-font-size); diff --git a/Panels/Header.module.less b/Panels/Header.module.less index ab260cc26..bf60493c8 100644 --- a/Panels/Header.module.less +++ b/Panels/Header.module.less @@ -141,6 +141,7 @@ /// .title { + font-family: @lime-title-font-family; margin: 0; } diff --git a/styles/internal/fonts.less b/styles/internal/fonts.less index badd4475e..f678b64b8 100644 --- a/styles/internal/fonts.less +++ b/styles/internal/fonts.less @@ -27,6 +27,12 @@ @font-system-src-limestone-number-600: local("LG Smart UI NUMBER SemiBold"), local("LGSmartUINUMBER-SemiBold"); @font-system-src-limestone-number-700: local("LG Smart UI NUMBER Bold"), local("LGSmartUINUMBER-Bold"); +// LG Smart UI 3.0 Title +@font-system-src-limestone-title-300: local("LGSmart UI 3.0 Title Light"), local("LGSmartUI3.0Title-Light"); +@font-system-src-limestone-title-400: local("LGSmart UI 3.0 Title Regular"), local("LGSmartUI3.0Title-Regular"), local("LGSmart UI 3.0 Title"); +@font-system-src-limestone-title-600: local("LGSmart UI 3.0 Title SemiBold"), local("LGSmartUI3.0Title-SemiBold"); +@font-system-src-limestone-title-700: local("LGSmart UI 3.0 Title Bold"), local("LGSmartUI3.0Title-Bold"); + @font-web-src-th-locale: url(https://fonts.gstatic.com/s/notosansthai/v13/iJWQBXeUZi_OHPqn4wq6hQ2_hbJ1xyN9wd43SofNWcdfKI2h.woff2) format('woff2'); @font-system-src-non-latin-300: local("LG Smart UI AR HE TH Regular"), local("LGSmartUIARHETH-Regular"), @font-web-src-th-locale; @@ -110,12 +116,19 @@ .buildFontFace(@font-family-base-name; @font-system-src-limestone-condensed-700; { font-stretch: condensed; font-weight: 700; }); /* ----- Limestone Number ------ */ -// This incorporates a fallback font (condensed) to catch any glyphs that are not present in the number fontp +// This incorporates a fallback font (condensed) to catch any glyphs that are not present in the number font .buildFontFamily("@{font-family-base-name} Number"; @font-system-src-limestone-number-400; @font-system-src-limestone-condensed-400); .buildFontFamily("@{font-family-base-name} Number"; @font-system-src-limestone-number-300; @font-system-src-limestone-condensed-300; 300); .buildFontFamily("@{font-family-base-name} Number"; @font-system-src-limestone-number-600; @font-system-src-limestone-condensed-600; 600); .buildFontFamily("@{font-family-base-name} Number"; @font-system-src-limestone-number-700; @font-system-src-limestone-condensed-700; 700); +/* ----- Limestone Title ------ */ +// No fallback here since Limestone font is used as fallback in variables.less +.buildFontFace("@{font-family-base-name} Title"; @font-system-src-limestone-title-400); +.buildFontFace("@{font-family-base-name} Title"; @font-system-src-limestone-title-300); +.buildFontFace("@{font-family-base-name} Title"; @font-system-src-limestone-title-600); +.buildFontFace("@{font-family-base-name} Title"; @font-system-src-limestone-title-700); + /* ----- Manual Limestone Locale Fonts (Stacking onto "Limestone") ------ */ .buildFontFace(@font-family-base-name; @font-system-src-non-latin-400); .buildFontFace(@font-family-base-name; @font-system-src-non-latin-300; 300); diff --git a/styles/variables.less b/styles/variables.less index 910bc31e9..3effe5f80 100644 --- a/styles/variables.less +++ b/styles/variables.less @@ -246,6 +246,7 @@ @lime-non-latin-font-family: "Limestone"; @lime-non-latin-font-family-light: "Limestone"; // Formerly weight: Light @lime-non-latin-font-family-bold: "Limestone"; // Formerly weight: Bold +@lime-title-font-family: "Limestone Title", "Limestone"; // fallback to Limestone default font-family @lime-non-latin-font-weight: var(--primitive-font-weight-regular); @lime-non-latin-font-weight-light: var(--primitive-font-weight-light); @lime-non-latin-font-weight-bold: var(--primitive-font-weight-bold);