diff --git a/CHANGELOG.md b/CHANGELOG.md index 874faf8..069fdc2 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,23 +1,24 @@ -| Version | Description | -|---------|-------------| -| 5.3.1 | Update arabic fonts for Reith Qalam | -| 5.3.0 | Add link object and commonly used link class | -| 5.2.1 | Add helper for reduced motion | -| 5.1.1 | Use gs-sass-tools @ ^5.0.8 to pull in social colour changes | -| 5.1.0 | Add alt++ to spacing utility | -| 5.0.4 | Update gs-sass-tools to version 5.0.5 | -| 5.0.3 | Use latin script for amharic, tigrinya and gujarati services | -| 5.0.2 | Add ethiopic script for use by amharic and tigrinya services | -| 5.0.1 | Use gs-sass-tools @ ^5.0.3 to pull in sport colours changes | -| 5.0.0 | Use gs-sass-tools @ ^5.0.2 to pull in gel-grid @ ^3.0.0 | -| 4.1.4 | IE improvements to faux block link | -| 4.1.3 | Add clear classes | -| 4.1.2 | Update faux-block link to support seperate href element as well as :before. | -| 4.1.1 | Bump z-index on faux block links to make them more robust. | -| 4.1.0 | Updating Bullet pattern with the Essential modifier. | -| 4.0.0 | Updating Bullet to show icon on core. Updating Faux Block Link for IE compatibility. | -| 3.4.4 | Bump to bring in [gs-sass-tools#20](https://github.com/bbc/gs-sass-tools/pull/20). | -| 3.4.3 | Add breakpoints to visually hidden class. | -| 3.4.2 | Add additional vertical align classes. | -| 3.4.1 | Using interpolated left & right properties and flipping left & right values. | +| Version | Description | +| ------- | --------------------------------------------------------------------------------------------------------- | +| 5.4.0 | Updates Tamil, Bengali and Sinhala font configurations to reflect latest UX designs | +| 5.3.1 | Update arabic fonts for Reith Qalam | +| 5.3.0 | Add link object and commonly used link class | +| 5.2.1 | Add helper for reduced motion | +| 5.1.1 | Use gs-sass-tools @ ^5.0.8 to pull in social colour changes | +| 5.1.0 | Add alt++ to spacing utility | +| 5.0.4 | Update gs-sass-tools to version 5.0.5 | +| 5.0.3 | Use latin script for amharic, tigrinya and gujarati services | +| 5.0.2 | Add ethiopic script for use by amharic and tigrinya services | +| 5.0.1 | Use gs-sass-tools @ ^5.0.3 to pull in sport colours changes | +| 5.0.0 | Use gs-sass-tools @ ^5.0.2 to pull in gel-grid @ ^3.0.0 | +| 4.1.4 | IE improvements to faux block link | +| 4.1.3 | Add clear classes | +| 4.1.2 | Update faux-block link to support seperate href element as well as :before. | +| 4.1.1 | Bump z-index on faux block links to make them more robust. | +| 4.1.0 | Updating Bullet pattern with the Essential modifier. | +| 4.0.0 | Updating Bullet to show icon on core. Updating Faux Block Link for IE compatibility. | +| 3.4.4 | Bump to bring in [gs-sass-tools#20](https://github.com/bbc/gs-sass-tools/pull/20). | +| 3.4.3 | Add breakpoints to visually hidden class. | +| 3.4.2 | Add additional vertical align classes. | +| 3.4.1 | Using interpolated left & right properties and flipping left & right values. | | 3.4.0 | Qualify all 1280 utilities with `$gel-grid-1280-toggle-class` to prevent them applying on non-1280 pages. | diff --git a/bower.json b/bower.json index 8717c06..eeb2cdb 100644 --- a/bower.json +++ b/bower.json @@ -17,5 +17,5 @@ "dependencies": { "gs-sass-tools": "git@github.com:bbc/gs-sass-tools.git#^5.0.8" }, - "version": "5.3.1" + "version": "5.4.0" } diff --git a/lib/settings/scripts/bengali/_config.scss b/lib/settings/scripts/bengali/_config.scss index 996c2ca..15934df 100644 --- a/lib/settings/scripts/bengali/_config.scss +++ b/lib/settings/scripts/bengali/_config.scss @@ -1,171 +1,171 @@ -@if $script == 'bengali' { - // the gel-body-copy class used on live pages was undefined for world-service sites (non-latin script) - // so after talking to UX the same settings as pica were used for the new class - $pica: ( - 'group-a': ( - 'font-size': 17px, - 'line-height': 23px - ), - 'group-c': ( - 'font-size': 20px, - 'line-height': 26px - ), - 'group-d': ( - 'font-size': 22px, - 'line-height': 28px - ) - ); - $gel-type-settings: ( - 'canon': ( - 'group-a': ( - 'font-size': 20px, - 'line-height': 24px - ), - 'group-b': ( - 'font-size': 24px, - 'line-height': 28px - ), - 'group-c': ( - 'font-size': 32px, - 'line-height': 36px - ) - ), - 'canon-bold': ( - 'group-a': ( - 'font-weight': bold, - 'letter-spacing': -1px - ) - ), - 'trafalgar': ( - 'group-a': ( - 'font-size': 22px, - 'line-height': 30px - ), - 'group-b': ( - 'font-size': 26px, - 'line-height': 36px - ), - 'group-c': ( - 'font-size': 38px, - 'line-height': 50px - ), - 'group-d': ( - 'line-height': 48px - ) - ), - 'trafalgar-bold': ( - 'group-a': ( - 'font-weight': bold, - 'letter-spacing': -1px - ) - ), - 'double-pica': ( - 'group-a': ( - 'font-size': 20px, - 'line-height': 30px - ), - 'group-c': ( - 'font-size': 30px, - 'line-height': 40px - ), - 'group-d': ( - 'font-size': 32px - ) - ), - 'double-pica-bold': ( - 'group-a': ( - 'font-weight': bold, - 'letter-spacing': -1px - ) - ), - 'great-primer': ( - 'group-a': ( - 'font-size': 20px, - 'line-height': 26px - ), - 'group-b': ( - 'font-size': 18px - ), - 'group-c': ( - 'font-size': 26px, - 'line-height': 32px - ), - 'group-d': ( - 'font-size': 22px, - 'line-height': 26px - ) - ), - 'great-primer-bold': ( - 'group-a': ( - 'font-weight': bold - ), - 'group-b': ( - 'letter-spacing': -1px - ) - ), - 'pica': $pica, - 'pica-bold': ( - 'group-a': ( - 'font-weight': bold - ) - ), - 'long-primer': ( - 'group-a': ( - 'font-size': 18px, - 'line-height': 23px - ), - 'group-c': ( - 'font-size': 20px, - 'line-height': 26px - ), - 'group-d': ( - 'line-height': 24px - ) - ), - 'long-primer-bold': ( - 'group-a': ( - 'font-weight': bold - ) - ), - 'brevier': ( - 'group-a': ( - 'font-size': 14px, - 'line-height': 20px - ), - 'group-d': ( - 'font-size': 19px, - 'line-height': 22px - ) - ), - 'brevier-bold': ( - 'group-a': ( - 'font-weight': bold - ) - ), - 'minion': ( - 'group-a': ( - 'font-size': 12px, - 'line-height': 16px, - 'text-transform': uppercase - ), - 'group-b': ( - 'font-size': 15px, - 'line-height': 18px - ), - 'group-c': ( - 'font-size': 16px, - 'line-height': 20px - ), - 'group-d': ( - 'font-size': 15px, - 'line-height': 18px - ) - ), - 'minion-bold': ( - 'group-a': ( - 'font-weight': bold - ) - ), - 'body-copy': $pica - ) !global; +@if $script == "bengali" { + // the gel-body-copy class used on live pages was undefined for world-service sites (non-latin script) + // so after talking to UX the same settings as pica were used for the new class + $pica: ( + "group-a": ( + "font-size": 15px, + "line-height": 23px, + ), + "group-c": ( + "font-size": 20px, + "line-height": 26px, + ), + "group-d": ( + "font-size": 17px, + "line-height": 24px, + ), + ); + $gel-type-settings: ( + "canon": ( + "group-a": ( + "font-size": 27px, + "line-height": 40px, + ), + "group-b": ( + "font-size": 32px, + "line-height": 46px, + ), + "group-c": ( + "font-size": 32px, + "line-height": 36px, + ), + ), + "canon-bold": ( + "group-a": ( + "font-weight": bold, + "letter-spacing": -1px, + ), + ), + "trafalgar": ( + "group-a": ( + "font-size": 25px, + "line-height": 32px, + ), + "group-b": ( + "font-size": 29px, + "line-height": 36px, + ), + "group-c": ( + "font-size": 38px, + "line-height": 50px, + ), + "group-d": ( + "line-height": 48px, + ), + ), + "trafalgar-bold": ( + "group-a": ( + "font-weight": bold, + "letter-spacing": -1px, + ), + ), + "double-pica": ( + "group-a": ( + "font-size": 22px, + "line-height": 30px, + ), + "group-c": ( + "font-size": 30px, + "line-height": 40px, + ), + "group-d": ( + "font-size": 23px, + ), + ), + "double-pica-bold": ( + "group-a": ( + "font-weight": bold, + "letter-spacing": -1px, + ), + ), + "great-primer": ( + "group-a": ( + "font-size": 19px, + "line-height": 28px, + ), + "group-b": ( + "font-size": 20px, + ), + "group-c": ( + "font-size": 26px, + "line-height": 32px, + ), + "group-d": ( + "font-size": 21px, + "line-height": 30px, + ), + ), + "great-primer-bold": ( + "group-a": ( + "font-weight": bold, + ), + "group-b": ( + "letter-spacing": -1px, + ), + ), + "pica": $pica, + "pica-bold": ( + "group-a": ( + "font-weight": bold, + ), + ), + "long-primer": ( + "group-a": ( + "font-size": 13px, + "line-height": 26px, + ), + "group-c": ( + "font-size": 20px, + "line-height": 26px, + ), + "group-d": ( + "line-height": 30px, + ), + ), + "long-primer-bold": ( + "group-a": ( + "font-weight": bold, + ), + ), + "brevier": ( + "group-a": ( + "font-size": 12px, + "line-height": 20px, + ), + "group-d": ( + "font-size": 16px, + "line-height": 22px, + ), + ), + "brevier-bold": ( + "group-a": ( + "font-weight": bold, + ), + ), + "minion": ( + "group-a": ( + "font-size": 10px, + "line-height": 16px, + "text-transform": uppercase, + ), + "group-b": ( + "font-size": 12px, + "line-height": 18px, + ), + "group-c": ( + "font-size": 16px, + "line-height": 20px, + ), + "group-d": ( + "font-size": 12px, + "line-height": 18px, + ), + ), + "minion-bold": ( + "group-a": ( + "font-weight": bold, + ), + ), + "body-copy": $pica, + ) !global; } diff --git a/lib/settings/scripts/sinhala/_config.scss b/lib/settings/scripts/sinhala/_config.scss index d7cdb5a..19c2eed 100644 --- a/lib/settings/scripts/sinhala/_config.scss +++ b/lib/settings/scripts/sinhala/_config.scss @@ -1,169 +1,169 @@ -@if $script == 'sinhala' { - // the gel-body-copy class used on live pages was undefined for world-service sites (non-latin script) - // so after talking to UX the same settings as pica were used for the new class - $pica: ( - 'group-a': ( - 'font-size': 15px, - 'line-height': 20px - ), - 'group-b': ( - 'font-size': 16px, - 'line-height': 22px - ), - 'group-c': ( - 'font-size': 18px, - 'line-height': 24px - ), - 'group-d': ( - 'font-size': 20px, - 'line-height': 22px - ) - ); - $gel-type-settings: ( - 'canon': ( - 'group-a': ( - 'font-size': 20px, - 'line-height': 24px - ), - 'group-b': ( - 'font-size': 24px, - 'line-height': 28px - ), - 'group-c': ( - 'font-size': 32px, - 'line-height': 36px - ) - ), - 'canon-bold': ( - 'group-a': ( - 'font-weight': bold, - 'letter-spacing': -1px - ) - ), - 'trafalgar': ( - 'group-a': ( - 'font-size': 20px, - 'line-height': 24px - ), - 'group-b': ( - 'font-size': 24px, - 'line-height': 28px - ), - 'group-c': ( - 'font-size': 36px, - 'line-height': 40px - ), - 'group-d': ( - 'font-size': 42px, - 'line-height': 46px - ) - ), - 'trafalgar-bold': ( - 'group-a': ( - 'font-weight': bold, - 'letter-spacing': -1px - ) - ), - 'double-pica': ( - 'group-a': ( - 'font-size': 20px, - 'line-height': 24px - ), - 'group-c': ( - 'font-size': 24px, - 'line-height': 28px - ), - 'group-d': ( - 'font-size': 30px, - 'line-height': 30px - ) - ), - 'double-pica-bold': ( - 'group-a': ( - 'font-weight': bold, - 'letter-spacing': -1px - ) - ), - 'great-primer': ( - 'group-a': ( - 'font-size': 18px, - 'line-height': 22px - ), - 'group-c': ( - 'font-size': 20px, - 'line-height': 24px - ), - 'group-d': ( - 'font-size': 24px - ) - ), - 'great-primer-bold': ( - 'group-a': ( - 'font-weight': bold - ), - 'group-b': ( - 'letter-spacing': -1px - ) - ), - 'pica': $pica, - 'pica-bold': ( - 'group-a': ( - 'font-weight': bold - ) - ), - 'long-primer': ( - 'group-a': ( - 'font-size': 15px, - 'line-height': 18px - ), - 'group-c': ( - 'line-height': 20px - ), - 'group-d': ( - 'font-size': 16px - ) - ), - 'long-primer-bold': ( - 'group-a': ( - 'font-weight': bold - ) - ), - 'brevier': ( - 'group-a': ( - 'font-size': 14px, - 'line-height': 16px - ), - 'group-b': ( - 'line-height': 18px - ), - 'group-d': ( - 'line-height': 14px - ) - ), - 'brevier-bold': ( - 'group-a': ( - 'font-weight': bold - ) - ), - 'minion': ( - 'group-a': ( - 'font-size': 12px, - 'line-height': 16px, - 'text-transform': uppercase - ), - 'group-c': ( - 'font-size': 13px - ), - 'group-d': ( - 'font-size': 14px, - 'line-height': 14px - ) - ), - 'minion-bold': ( - 'group-a': ( - 'font-weight': bold - ) - ), - 'body-copy': $pica - ) !global; +@if $script == "sinhala" { + // the gel-body-copy class used on live pages was undefined for world-service sites (non-latin script) + // so after talking to UX the same settings as pica were used for the new class + $pica: ( + "group-a": ( + "font-size": 17px, + "line-height": 28px, + ), + "group-b": ( + "font-size": 17px, + "line-height": 24px, + ), + "group-c": ( + "font-size": 18px, + "line-height": 24px, + ), + "group-d": ( + "font-size": 17px, + "line-height": 24px, + ), + ); + $gel-type-settings: ( + "canon": ( + "group-a": ( + "font-size": 25px, + "line-height": 32px, + ), + "group-b": ( + "font-size": 31px, + "line-height": 40px, + ), + "group-c": ( + "font-size": 32px, + "line-height": 36px, + ), + ), + "canon-bold": ( + "group-a": ( + "font-weight": bold, + "letter-spacing": -1px, + ), + ), + "trafalgar": ( + "group-a": ( + "font-size": 20px, + "line-height": 24px, + ), + "group-b": ( + "font-size": 27px, + "line-height": 36px, + ), + "group-c": ( + "font-size": 36px, + "line-height": 40px, + ), + "group-d": ( + "font-size": 32px, + "line-height": 44px, + ), + ), + "trafalgar-bold": ( + "group-a": ( + "font-weight": bold, + "letter-spacing": -1px, + ), + ), + "double-pica": ( + "group-a": ( + "font-size": 18px, + "line-height": 22px, + ), + "group-c": ( + "font-size": 24px, + "line-height": 28px, + ), + "group-d": ( + "font-size": 24px, + "line-height": 34px, + ), + ), + "double-pica-bold": ( + "group-a": ( + "font-weight": bold, + "letter-spacing": -1px, + ), + ), + "great-primer": ( + "group-a": ( + "font-size": 18px, + "line-height": 22px, + ), + "group-c": ( + "font-size": 20px, + "line-height": 24px, + ), + "group-d": ( + "font-size": 19px, + ), + ), + "great-primer-bold": ( + "group-a": ( + "font-weight": bold, + ), + "group-b": ( + "letter-spacing": -1px, + ), + ), + "pica": $pica, + "pica-bold": ( + "group-a": ( + "font-weight": bold, + ), + ), + "long-primer": ( + "group-a": ( + "font-size": 15px, + "line-height": 22px, + ), + "group-c": ( + "line-height": 20px, + ), + "group-d": ( + "font-size": 15px, + ), + ), + "long-primer-bold": ( + "group-a": ( + "font-weight": bold, + ), + ), + "brevier": ( + "group-a": ( + "font-size": 14px, + "line-height": 22px, + ), + "group-b": ( + "line-height": 22px, + ), + "group-d": ( + "line-height": 22px, + ), + ), + "brevier-bold": ( + "group-a": ( + "font-weight": bold, + ), + ), + "minion": ( + "group-a": ( + "font-size": 13px, + "line-height": 22px, + "text-transform": uppercase, + ), + "group-c": ( + "font-size": 13px, + ), + "group-d": ( + "font-size": 13px, + "line-height": 22px, + ), + ), + "minion-bold": ( + "group-a": ( + "font-weight": bold, + ), + ), + "body-copy": $pica, + ) !global; } diff --git a/lib/settings/scripts/tamil/_config.scss b/lib/settings/scripts/tamil/_config.scss index 7cc656f..e26c12d 100644 --- a/lib/settings/scripts/tamil/_config.scss +++ b/lib/settings/scripts/tamil/_config.scss @@ -1,142 +1,142 @@ -@if $script == 'tamil' { - // the gel-body-copy class used on live pages was undefined for world-service sites (non-latin script) - // so after talking to UX the same settings as pica were used for the new class - $pica: ( - 'group-a': ( - 'font-size': 14px, - 'line-height': 21px - ), - 'group-b': ( - 'font-size': 13px, - 'line-height': 20px - ), - 'group-c': ( - 'font-size': 14px, - 'line-height': 21px - ) - ); - $gel-type-settings: ( - 'canon': ( - 'group-a': ( - 'font-size': 20px, - 'line-height': 24px - ), - 'group-b': ( - 'font-size': 24px, - 'line-height': 28px - ), - 'group-c': ( - 'font-size': 32px, - 'line-height': 36px - ) - ), - 'canon-bold': ( - 'group-a': ( - 'font-weight': bold, - 'letter-spacing': -1px - ) - ), - 'trafalgar': ( - 'group-a': ( - 'font-size': 18px, - 'line-height': 26px - ), - 'group-c': ( - 'font-size': 26px, - 'line-height': 34px - ), - 'group-d': ( - 'font-size': 22px, - 'line-height': 30px - ) - ), - 'trafalgar-bold': ( - 'group-a': ( - 'font-weight': bold, - 'letter-spacing': -1px - ) - ), - 'double-pica': ( - 'group-a': ( - 'font-size': 16px, - 'line-height': 24px - ) - ), - 'double-pica-bold': ( - 'group-a': ( - 'font-weight': bold, - 'letter-spacing': -1px - ) - ), - 'great-primer': ( - 'group-a': ( - 'font-size': 14px, - 'line-height': 21px - ), - 'group-b': ( - 'font-size': 13px, - 'line-height': 20px - ), - 'group-c': ( - 'font-size': 14px, - 'line-height': 21px - ) - ), - 'great-primer-bold': ( - 'group-a': ( - 'font-weight': bold - ), - 'group-b': ( - 'letter-spacing': -1px - ) - ), - 'pica': $pica, - 'pica-bold': ( - 'group-a': ( - 'font-weight': bold - ) - ), - 'long-primer': ( - 'group-a': ( - 'font-size': 11px, - 'line-height': 18px - ) - ), - 'long-primer-bold': ( - 'group-a': ( - 'font-weight': bold - ) - ), - 'brevier': ( - 'group-a': ( - 'font-size': 10px, - 'line-height': 15px - ) - ), - 'brevier-bold': ( - 'group-a': ( - 'font-weight': bold - ) - ), - 'minion': ( - 'group-a': ( - 'font-size': 12px, - 'line-height': 16px, - 'text-transform': uppercase - ), - 'group-c': ( - 'font-size': 13px - ), - 'group-d': ( - 'font-size': 10px, - 'line-height': 14px - ) - ), - 'minion-bold': ( - 'group-a': ( - 'font-weight': bold - ) - ), - 'body-copy': $pica - ) !global; +@if $script == "tamil" { + // the gel-body-copy class used on live pages was undefined for world-service sites (non-latin script) + // so after talking to UX the same settings as pica were used for the new class + $pica: ( + "group-a": ( + "font-size": 12px, + "line-height": 20px, + ), + "group-b": ( + "font-size": 14px, + "line-height": 22px, + ), + "group-c": ( + "font-size": 14px, + "line-height": 21px, + ), + ); + $gel-type-settings: ( + "canon": ( + "group-a": ( + "font-size": 22px, + "line-height": 30px, + ), + "group-b": ( + "font-size": 26px, + "line-height": 36px, + ), + "group-c": ( + "font-size": 32px, + "line-height": 36px, + ), + ), + "canon-bold": ( + "group-a": ( + "font-weight": bold, + "letter-spacing": -1px, + ), + ), + "trafalgar": ( + "group-a": ( + "font-size": 16px, + "line-height": 24px, + ), + "group-c": ( + "font-size": 26px, + "line-height": 34px, + ), + "group-d": ( + "font-size": 28px, + "line-height": 38px, + ), + ), + "trafalgar-bold": ( + "group-a": ( + "font-weight": bold, + "letter-spacing": -1px, + ), + ), + "double-pica": ( + "group-a": ( + "font-size": 14px, + "line-height": 22px, + ), + ), + "double-pica-bold": ( + "group-a": ( + "font-weight": bold, + "letter-spacing": -1px, + ), + ), + "great-primer": ( + "group-a": ( + "font-size": 13px, + "line-height": 22px, + ), + "group-b": ( + "font-size": 14px, + "line-height": 24px, + ), + "group-c": ( + "font-size": 14px, + "line-height": 21px, + ), + ), + "great-primer-bold": ( + "group-a": ( + "font-weight": bold, + ), + "group-b": ( + "letter-spacing": -1px, + ), + ), + "pica": $pica, + "pica-bold": ( + "group-a": ( + "font-weight": bold, + ), + ), + "long-primer": ( + "group-a": ( + "font-size": 11px, + "line-height": 18px, + ), + ), + "long-primer-bold": ( + "group-a": ( + "font-weight": bold, + ), + ), + "brevier": ( + "group-a": ( + "font-size": 10px, + "line-height": 15px, + ), + ), + "brevier-bold": ( + "group-a": ( + "font-weight": bold, + ), + ), + "minion": ( + "group-a": ( + "font-size": 12px, + "line-height": 16px, + "text-transform": uppercase, + ), + "group-c": ( + "font-size": 13px, + ), + "group-d": ( + "font-size": 10px, + "line-height": 14px, + ), + ), + "minion-bold": ( + "group-a": ( + "font-weight": bold, + ), + ), + "body-copy": $pica, + ) !global; } diff --git a/package.json b/package.json index 3a32b4c..c97acd9 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "bbc-grandstand", - "version": "5.3.1", + "version": "5.4.0", "description": "The BBC Grandstand CSS Framework is used by Sport, Live, News and Radio components", "main": "_grandstand.scss", "scripts": {