Skip to content
This repository has been archived by the owner on Aug 13, 2023. It is now read-only.

Commit

Permalink
Merge pull request #3852 from bbc/revert-gel-foundations-5
Browse files Browse the repository at this point in the history
Revert gel-foundations breaking changes prior to Emotion migration
  • Loading branch information
simonsinclair authored Oct 12, 2020
2 parents b0aec1d + 6ff00d9 commit fb82303
Show file tree
Hide file tree
Showing 10 changed files with 335 additions and 4,478 deletions.
1 change: 1 addition & 0 deletions packages/utilities/gel-foundations/CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
<!-- prettier-ignore -->
| Version | Description |
|---------|-------------|
| 5.0.1 | [PR#3852](https://github.com/bbc/psammead/pull/3852) Revert breaking changes prior to Emotion migration. |
| 5.0.0 | [PR#3805](https://github.com/bbc/psammead/pull/3805) BBC Reith Qalam v1.100. Removal of `arabicPashto` script in favour of `arabic` |
| 4.3.0 | [PR#3782](https://github.com/bbc/psammead/pull/3782) Reduce Thai font size |
| 4.2.0 | [PR#3616](https://github.com/bbc/psammead/pull/3616) Update Bengali inline link styling |
Expand Down
29 changes: 15 additions & 14 deletions packages/utilities/gel-foundations/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@ This package provides a range of string constants for use in CSS, intended to he

## Exports

`/breakpoints` - GEL breakpoints, as well as typography breakpoints. These use the GEL grid sizes which can be found in the [GEL Grid guidelines](https://www.bbc.co.uk/gel/guidelines/grid#grid-sizes).
`/spacings` - GEL spacings and GEL Grid margins and gutters. These use the GEL grid spacing sizes which can be found in the [GEL Grid guidelines](https://www.bbc.co.uk/gel/guidelines/grid#spacing-layout).
`/breakpoints` - GEL breakpoints, as well as typography breakpoints. These use the GEL grid sizes which can be found in the [GEL Grid guidelines](https://www.bbc.co.uk/gel/guidelines/grid#grid-sizes).
`/spacings` - GEL spacings and GEL Grid margins and gutters. These use the GEL grid spacing sizes which can be found in the [GEL Grid guidelines](https://www.bbc.co.uk/gel/guidelines/grid#spacing-layout).
`/typography` - GEL type sizes and font stacks. These are based on the GEL Typography definitions which can be found in the [GEL guidelines](https://www.bbc.co.uk/gel/guidelines/typography). [More details on how the type sizes were implemented for this package are available here.](./typography_sizes_web.md)

## Installation
Expand Down Expand Up @@ -52,18 +52,19 @@ You can import the script doing `import { arabic } from '@bbc/gel-foundations/sc
In addition to Latin script defaults, Psammead supports typography for a number of other scripts. We have grouped the scripts that share similiar features as follows:

<!-- prettier-ignore -->
| Group Name | Services | Rationale |
| --------------------------- | -------- | --------------------------- |
| `latin-and-cyrillic` | News, Hausa, Gahuza, Somali, Swahili, Igbo, Pidgin, Afaan Oromo, Yoruba, Azeri, Indonesia, Uzbek, Serbian, Russian, Ukrainian, Kyrgyz, Uzbek | The typography values for Latin and Cyrillic characters are identical |
| `latin-with-diacritics` | Vietnamese, Mundo, Afrique, Brasil, Turkish | The diacritics make these values differ from Latin |
| `arabic` | Arabic, Pashto, Persian, Urdu | Group as they use the Arabic alphabet |
| `no-ascenders-or-descenders` | Korean, Japanese, Zhongwen, Ukchina, Tigrinya, Amharic | Group all alphabets without ascenders or descenders. This could be implemented as `chinese`, `korean`, `ethiopic` | Hindi, Nepali, Gujarati, Punjabi, Marathi, Telugu | The typography values for Devanagari and Gurmukhi characters are identical |
| `devanagari-and-gurmukhi` | Hindi, Nepali, Gujarati, Punjabi, Marathi, Telugu | The typography values for Devanagari and Gurmukhi characters are identical |
| `thai` | Thai | Bespoke to the Thai characters |
| `bengali` | Bengali | Bespoke to the Bengal characters |
| `burmese` | Burmese | Bespoke to the Burmese characters |
| `sinhalese` | Sinhala | Bespoke to the Sinhalese characters |
| `tamil` | Tamil | Bespoke to the Tamil characters |
| Group Name | Services | Rationale |
| --------------------------- | -------- | --------------------------- |
| latin-and-cyrillic | News, Hausa, Gahuza, Somali, Swahili, Igbo, Pidgin, Afaan Oromo, Yoruba, Azeri, Indonesia, Uzbek, Serbian, Russian, Ukrainian, Kyrgyz, Uzbek | The typography values for Latin and Cyrillic characters are identical |
| latin-with-diacritics | Vietnamese, Mundo, Afrique, Brasil, Turkish | The diacritics make these values differ from Latin |
| arabic | Urdu, Arabic, Persian | Group as they use the Arabic alphabet |
| arabic-pashto | Pashto | Contains a subset of glyphs that mean it differs from Arabic |
| no-ascenders-or-descenders | Korean, Japanese, Zhongwen, Ukchina, Tigrinya, Amharic | Group all alphabets without ascenders or descenders. This could be implemented as chinese, korean, ethiopic | Hindi, Nepali, Gujarati, Punjabi, Marathi, Telugu | The typography values for Devanagari and Gurmukhi characters are identical |
| devanagari-and-gurmukhi | Hindi, Nepali, Gujarati, Punjabi, Marathi, Telugu | The typography values for Devanagari and Gurmukhi characters are identical |
| thai | Thai | Bespoke to the Thai characters |
| bengali | Bengali | Bespoke to the Bengal characters |
| burmese | Burmese | Bespoke to the Burmese characters |
| sinhalese | Sinhala | Bespoke to the Sinhalese characters |
| tamil | Tamil | Bespoke to the Tamil characters |

## Contributing

Expand Down
1 change: 1 addition & 0 deletions packages/utilities/gel-foundations/index.test.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -76,6 +76,7 @@ const typographyExpectedExports = {

const scriptsExpectedExports = {
arabic: 'object',
arabicPashto: 'object',
bengali: 'object',
burmese: 'object',
chinese: 'object',
Expand Down
2 changes: 1 addition & 1 deletion packages/utilities/gel-foundations/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion packages/utilities/gel-foundations/package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@bbc/gel-foundations",
"version": "5.0.0",
"version": "5.0.1",
"sideEffects": false,
"description": "A range of string constants for use in CSS, intended to help implement BBC GEL-compliant webpages and components.",
"repository": {
Expand Down
75 changes: 28 additions & 47 deletions packages/utilities/gel-foundations/src/scripts.js
Original file line number Diff line number Diff line change
@@ -1,47 +1,28 @@
/* eslint-disable import/no-duplicates */
import arabic from './scripts/arabic';

import bengali from './scripts/bengali';

import burmese from './scripts/burmese';

import devanagariAndGurmukhi from './scripts/devanagari-and-gurmukhi';
import hindi from './scripts/devanagari-and-gurmukhi';
import nepali from './scripts/devanagari-and-gurmukhi';

import cyrillic from './scripts/latin-and-cyrillic';
import cyrillicAndLatin from './scripts/latin-and-cyrillic';
import latin from './scripts/latin-and-cyrillic';

import latinDiacritics from './scripts/latin-with-diacritics';

import chinese from './scripts/no-ascenders-or-descenders';
import ethiopic from './scripts/no-ascenders-or-descenders';
import korean from './scripts/no-ascenders-or-descenders';
import noAscendersOrDescenders from './scripts/no-ascenders-or-descenders';

import sinhalese from './scripts/sinhalese';

import tamil from './scripts/tamil';

import thai from './scripts/thai';

export {
arabic,
bengali,
burmese,
devanagariAndGurmukhi,
hindi,
nepali,
cyrillic,
cyrillicAndLatin,
latin,
latinDiacritics,
chinese,
ethiopic,
korean,
noAscendersOrDescenders,
sinhalese,
tamil,
thai,
};
export arabic from './scripts/arabic';

export arabicPashto from './scripts/arabic-pashto';

export bengali from './scripts/bengali';

export burmese from './scripts/burmese';

export devanagariAndGurmukhi from './scripts/devanagari-and-gurmukhi';
export hindi from './scripts/devanagari-and-gurmukhi';
export nepali from './scripts/devanagari-and-gurmukhi';

export cyrillic from './scripts/latin-and-cyrillic';
export cyrillicAndLatin from './scripts/latin-and-cyrillic';
export latin from './scripts/latin-and-cyrillic';

export latinDiacritics from './scripts/latin-with-diacritics';

export chinese from './scripts/no-ascenders-or-descenders';
export ethiopic from './scripts/no-ascenders-or-descenders';
export korean from './scripts/no-ascenders-or-descenders';
export noAscendersOrDescenders from './scripts/no-ascenders-or-descenders';

export sinhalese from './scripts/sinhalese';

export tamil from './scripts/tamil';

export thai from './scripts/thai';
214 changes: 214 additions & 0 deletions packages/utilities/gel-foundations/src/scripts/arabic-pashto.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,214 @@
const arabicPashtoTypography = {
atlas: {
groupA: {
fontSize: '78',
lineHeight: '84',
},
groupB: {
fontSize: '96',
lineHeight: '104',
},
groupD: {
fontSize: '140',
lineHeight: '148',
},
},
elephant: {
groupA: {
fontSize: '60',
lineHeight: '64',
},
groupB: {
fontSize: '78',
lineHeight: '84',
},
groupD: {
fontSize: '116',
lineHeight: '124',
},
},
imperial: {
groupA: {
fontSize: '50',
lineHeight: '54',
},
groupB: {
fontSize: '64',
lineHeight: '72',
},
groupD: {
fontSize: '96',
lineHeight: '104',
},
},
royal: {
groupA: {
fontSize: '40',
lineHeight: '44',
},
groupB: {
fontSize: '52',
lineHeight: '60',
},
groupD: {
fontSize: '76',
lineHeight: '84',
},
},
foolscap: {
groupA: {
fontSize: '32',
lineHeight: '36',
},
groupB: {
fontSize: '40',
lineHeight: '44',
},
groupD: {
fontSize: '56',
lineHeight: '60',
},
},
canon: {
groupA: {
fontSize: '32',
lineHeight: '42',
},
groupB: {
fontSize: '38',
lineHeight: '46',
},
groupD: {
fontSize: '44',
lineHeight: '54',
},
},
trafalgar: {
groupA: {
fontSize: '24',
lineHeight: '34',
},
groupB: {
fontSize: '32',
lineHeight: '38',
},
groupD: {
fontSize: '36',
lineHeight: '50',
},
},
paragon: {
groupA: {
fontSize: '24',
lineHeight: '24',
},
groupB: {
fontSize: '28',
lineHeight: '40',
},
groupD: {
fontSize: '32',
lineHeight: '40',
},
},
doublePica: {
groupA: {
fontSize: '24',
lineHeight: '32',
},
groupB: {
fontSize: '26',
lineHeight: '36',
},
groupD: {
fontSize: '28',
lineHeight: '36',
},
},
greatPrimer: {
groupA: {
fontSize: '22',
lineHeight: '28',
},
groupB: {
fontSize: '24',
lineHeight: '32',
},
groupD: {
fontSize: '26',
lineHeight: '34',
},
},
bodyCopy: {
groupA: {
fontSize: '18',
lineHeight: '28',
},
groupB: {
fontSize: '20',
lineHeight: '32',
},
groupD: {
fontSize: '22',
lineHeight: '32',
},
},
pica: {
groupA: {
fontSize: '16',
lineHeight: '26',
},
groupB: {
fontSize: '20',
lineHeight: '26',
},
groupD: {
fontSize: '20',
lineHeight: '26',
},
},
longPrimer: {
groupA: {
fontSize: '17',
lineHeight: '24',
},
groupB: {
fontSize: '18',
lineHeight: '24',
},
groupD: {
fontSize: '18',
lineHeight: '24',
},
},
brevier: {
groupA: {
fontSize: '16',
lineHeight: '20',
},
groupB: {
fontSize: '18',
lineHeight: '24',
},
groupD: {
fontSize: '18',
lineHeight: '24',
},
},
minion: {
groupA: {
fontSize: '12',
lineHeight: '16',
},
groupB: {
fontSize: '12',
lineHeight: '16',
},
groupD: {
fontSize: '12',
lineHeight: '16',
},
},
};

export default arabicPashtoTypography;
Loading

0 comments on commit fb82303

Please sign in to comment.