Skip to content

Commit f1e9bfd

Browse files
EmmanuelBuraimoemmanuelburaimoolliecurtisFaye-Xiaogc-skyscanner
authored
Adding new tokens to Backpack foundation (#461)
Co-authored-by: emmanuelburaimo <[email protected]> Co-authored-by: Ollie Curtis <[email protected]> Co-authored-by: Faye <[email protected]> Co-authored-by: GC Zhu <[email protected]>
1 parent 7f2a635 commit f1e9bfd

File tree

22 files changed

+716
-316
lines changed

22 files changed

+716
-316
lines changed

package-lock.json

Lines changed: 192 additions & 212 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@
7676
"css-loader": "^7.1.2",
7777
"del": "^8.0.0",
7878
"eslint-plugin-json": "^4.0.1",
79-
"gulp": "^5.0.0",
79+
"gulp": "^5.0.1",
8080
"gulp-theo": "^2.0.0",
8181
"jest": "^29.7.0",
8282
"lerna": "^8.1.6",

packages/bpk-foundations-android/src/base/aliases.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@
1212
"FONT_FAMILY": "\"sans-serif\"",
1313
"FONT_FAMILY_EMPHASIZE": "\"sans-serif-medium\"",
1414
"FONT_FAMILY_HEAVY": "\"sans-serif-black\"",
15+
"FONT_FAMILY_LARKEN": "\"larken\"",
1516
"ELEVATION_XS": 1,
1617
"ELEVATION_SM": 2,
1718
"ELEVATION_BASE": 4,

packages/bpk-foundations-android/src/base/borders.json

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,14 @@
3737
"BORDER_RADIUS_XL": {
3838
"value": "{!BORDER_RADIUS_XL}",
3939
"category": "radii"
40+
},
41+
"BORDER_RADIUS_FULL": {
42+
"value": "{!BORDER_RADIUS_FULL}",
43+
"category": "radii"
44+
},
45+
"BORDER_RADIUS_NAV_TABS": {
46+
"value": "{!BORDER_RADIUS_NAV_TABS}",
47+
"category": "radii"
4048
}
4149
}
4250
}

packages/bpk-foundations-android/src/base/typography.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,11 @@
1515
"value": "{!FONT_FAMILY_HEAVY}",
1616
"type": "font",
1717
"category": "typesettings"
18+
},
19+
"FONT_FAMILY_LARKEN": {
20+
"value": "{!FONT_FAMILY_LARKEN}",
21+
"type": "font",
22+
"category": "typesettings"
1823
}
1924
}
2025
}

packages/bpk-foundations-android/tokens/base.raw.android.json

Lines changed: 135 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -6,23 +6,29 @@
66
"BORDER_SIZE_LG": {
77
"value": 2
88
},
9-
"BORDER_SIZE_XL": {
10-
"value": 3
9+
"BORDER_RADIUS_FULL": {
10+
"value": 9999
1111
},
12-
"BORDER_RADIUS_XS": {
13-
"value": 4
12+
"BORDER_RADIUS_XL": {
13+
"value": 40
14+
},
15+
"BORDER_RADIUS_MD": {
16+
"value": 12
17+
},
18+
"BORDER_RADIUS_NAV_TABS": {
19+
"value": 18
1420
},
1521
"BORDER_RADIUS_SM": {
1622
"value": 8
1723
},
18-
"BORDER_RADIUS_MD": {
19-
"value": 12
24+
"BORDER_RADIUS_XS": {
25+
"value": 4
2026
},
2127
"BORDER_RADIUS_LG": {
2228
"value": 24
2329
},
24-
"BORDER_RADIUS_XL": {
25-
"value": 40
30+
"BORDER_SIZE_XL": {
31+
"value": 3
2632
},
2733
"CAROUSEL_INDICATOR_DOT_SIZE_SM": {
2834
"value": 2
@@ -309,6 +315,9 @@
309315
"BLACK": {
310316
"value": "#010913"
311317
},
318+
"FONT_FAMILY_LARKEN": {
319+
"value": "\"larken\""
320+
},
312321
"ELEVATION_XXL": {
313322
"value": 24
314323
},
@@ -338,13 +347,27 @@
338347
}
339348
},
340349
"props": {
350+
"TEXT_XS-LARKEN_FONT_WEIGHT": {
351+
"value": "700",
352+
"type": "string",
353+
"category": "font-weights",
354+
"originalValue": "{!FONT_WEIGHT_BOLD}",
355+
"name": "TEXT_XS-LARKEN_FONT_WEIGHT"
356+
},
341357
"TEXT_HEADING-4_FONT_WEIGHT": {
342358
"value": "700",
343359
"type": "string",
344360
"category": "font-weights",
345361
"originalValue": "{!FONT_WEIGHT_BOLD}",
346362
"name": "TEXT_HEADING-4_FONT_WEIGHT"
347363
},
364+
"TEXT_SM-LARKEN_FONT_WEIGHT": {
365+
"value": "700",
366+
"type": "string",
367+
"category": "font-weights",
368+
"originalValue": "{!FONT_WEIGHT_BOLD}",
369+
"name": "TEXT_SM-LARKEN_FONT_WEIGHT"
370+
},
348371
"TEXT_HEADING-5_FONT_WEIGHT": {
349372
"value": "700",
350373
"type": "string",
@@ -576,6 +599,13 @@
576599
"originalValue": "{!LETTER_SPACING_TIGHT}",
577600
"name": "LETTER_SPACING_TIGHT"
578601
},
602+
"TEXT_XS-LARKEN_FONT_SIZE": {
603+
"value": "12",
604+
"type": "font-size",
605+
"category": "font-sizes",
606+
"originalValue": "{!FONT_SIZE_XS}",
607+
"name": "TEXT_XS-LARKEN_FONT_SIZE"
608+
},
579609
"TEXT_HEADING-4_FONT_SIZE": {
580610
"value": "20",
581611
"type": "font-size",
@@ -597,20 +627,41 @@
597627
"originalValue": "{!LINE_HEIGHT_XL-TIGHT}",
598628
"name": "TEXT_HEADING-3_LINE_HEIGHT"
599629
},
630+
"TEXT_SM-LARKEN_FONT_SIZE": {
631+
"value": "14",
632+
"type": "font-size",
633+
"category": "font-sizes",
634+
"originalValue": "{!FONT_SIZE_SM}",
635+
"name": "TEXT_SM-LARKEN_FONT_SIZE"
636+
},
600637
"TEXT_HEADING-5_FONT_SIZE": {
601638
"value": "16",
602639
"type": "font-size",
603640
"category": "font-sizes",
604641
"originalValue": "{!FONT_SIZE_BASE}",
605642
"name": "TEXT_HEADING-5_FONT_SIZE"
606643
},
644+
"TEXT_XS-LARKEN_LINE_HEIGHT": {
645+
"value": "16",
646+
"type": "size",
647+
"category": "typesettings",
648+
"originalValue": "{!LINE_HEIGHT_XS}",
649+
"name": "TEXT_XS-LARKEN_LINE_HEIGHT"
650+
},
607651
"TEXT_HEADING-4_LINE_HEIGHT": {
608652
"value": "24",
609653
"type": "size",
610654
"category": "typesettings",
611655
"originalValue": "{!LINE_HEIGHT_LG-TIGHT}",
612656
"name": "TEXT_HEADING-4_LINE_HEIGHT"
613657
},
658+
"TEXT_BASE-LARKEN_FONT_WEIGHT": {
659+
"value": "700",
660+
"type": "string",
661+
"category": "font-weights",
662+
"originalValue": "{!FONT_WEIGHT_BOLD}",
663+
"name": "TEXT_BASE-LARKEN_FONT_WEIGHT"
664+
},
614665
"TEXT_HEADING-5_LINE_HEIGHT": {
615666
"value": "20",
616667
"type": "size",
@@ -625,6 +676,13 @@
625676
"originalValue": "{!FONT_SIZE_LG}",
626677
"name": "TEXT_BODY-LONGFORM_FONT_SIZE"
627678
},
679+
"TEXT_SM-LARKEN_LINE_HEIGHT": {
680+
"value": "20",
681+
"type": "size",
682+
"category": "typesettings",
683+
"originalValue": "{!LINE_HEIGHT_SM}",
684+
"name": "TEXT_SM-LARKEN_LINE_HEIGHT"
685+
},
628686
"TEXT_BODY-LONGFORM_LINE_HEIGHT": {
629687
"value": "28",
630688
"type": "size",
@@ -674,6 +732,20 @@
674732
"originalValue": "{!LINE_HEIGHT_XL-TIGHT}",
675733
"name": "LINE_HEIGHT_XL-TIGHT"
676734
},
735+
"TEXT_BASE-LARKEN_FONT_SIZE": {
736+
"value": "16",
737+
"type": "font-size",
738+
"category": "font-sizes",
739+
"originalValue": "{!FONT_SIZE_BASE}",
740+
"name": "TEXT_BASE-LARKEN_FONT_SIZE"
741+
},
742+
"TEXT_BASE-LARKEN_LINE_HEIGHT": {
743+
"value": "20",
744+
"type": "size",
745+
"category": "typesettings",
746+
"originalValue": "{!LINE_HEIGHT_BASE-TIGHT}",
747+
"name": "TEXT_BASE-LARKEN_LINE_HEIGHT"
748+
},
677749
"TEXT_HERO-5_LETTER_SPACING": {
678750
"value": "-0.02",
679751
"type": "letter-spacing",
@@ -2734,19 +2806,33 @@
27342806
"originalValue": "{!BORDER_SIZE_LG}",
27352807
"name": "BORDER_SIZE_LG"
27362808
},
2737-
"BORDER_SIZE_XL": {
2809+
"BORDER_RADIUS_FULL": {
27382810
"type": "size",
2739-
"value": "3",
2740-
"category": "borders",
2741-
"originalValue": "{!BORDER_SIZE_XL}",
2742-
"name": "BORDER_SIZE_XL"
2811+
"value": "9999",
2812+
"category": "radii",
2813+
"originalValue": "{!BORDER_RADIUS_FULL}",
2814+
"name": "BORDER_RADIUS_FULL"
27432815
},
2744-
"BORDER_RADIUS_XS": {
2816+
"BORDER_RADIUS_XL": {
27452817
"type": "size",
2746-
"value": "4",
2818+
"value": "40",
27472819
"category": "radii",
2748-
"originalValue": "{!BORDER_RADIUS_XS}",
2749-
"name": "BORDER_RADIUS_XS"
2820+
"originalValue": "{!BORDER_RADIUS_XL}",
2821+
"name": "BORDER_RADIUS_XL"
2822+
},
2823+
"BORDER_RADIUS_MD": {
2824+
"type": "size",
2825+
"value": "12",
2826+
"category": "radii",
2827+
"originalValue": "{!BORDER_RADIUS_MD}",
2828+
"name": "BORDER_RADIUS_MD"
2829+
},
2830+
"BORDER_RADIUS_NAV_TABS": {
2831+
"type": "size",
2832+
"value": "18",
2833+
"category": "radii",
2834+
"originalValue": "{!BORDER_RADIUS_NAV_TABS}",
2835+
"name": "BORDER_RADIUS_NAV_TABS"
27502836
},
27512837
"BORDER_RADIUS_SM": {
27522838
"type": "size",
@@ -2755,12 +2841,12 @@
27552841
"originalValue": "{!BORDER_RADIUS_SM}",
27562842
"name": "BORDER_RADIUS_SM"
27572843
},
2758-
"BORDER_RADIUS_MD": {
2844+
"BORDER_RADIUS_XS": {
27592845
"type": "size",
2760-
"value": "12",
2846+
"value": "4",
27612847
"category": "radii",
2762-
"originalValue": "{!BORDER_RADIUS_MD}",
2763-
"name": "BORDER_RADIUS_MD"
2848+
"originalValue": "{!BORDER_RADIUS_XS}",
2849+
"name": "BORDER_RADIUS_XS"
27642850
},
27652851
"BORDER_RADIUS_LG": {
27662852
"type": "size",
@@ -2769,12 +2855,12 @@
27692855
"originalValue": "{!BORDER_RADIUS_LG}",
27702856
"name": "BORDER_RADIUS_LG"
27712857
},
2772-
"BORDER_RADIUS_XL": {
2858+
"BORDER_SIZE_XL": {
27732859
"type": "size",
2774-
"value": "40",
2775-
"category": "radii",
2776-
"originalValue": "{!BORDER_RADIUS_XL}",
2777-
"name": "BORDER_RADIUS_XL"
2860+
"value": "3",
2861+
"category": "borders",
2862+
"originalValue": "{!BORDER_SIZE_XL}",
2863+
"name": "BORDER_SIZE_XL"
27782864
},
27792865
"BUTTON_BORDER_WIDTH": {
27802866
"type": "size",
@@ -2951,6 +3037,13 @@
29513037
"originalValue": "{!FONT_FAMILY_HEAVY}",
29523038
"name": "FONT_FAMILY_HEAVY"
29533039
},
3040+
"FONT_FAMILY_LARKEN": {
3041+
"value": "\"larken\"",
3042+
"type": "font",
3043+
"category": "typesettings",
3044+
"originalValue": "{!FONT_FAMILY_LARKEN}",
3045+
"name": "FONT_FAMILY_LARKEN"
3046+
},
29543047
"PRIVATE_BADGE_BACKGROUND_NORMAL_COLOR": {
29553048
"type": "color",
29563049
"category": "badge-colors",
@@ -3727,7 +3820,9 @@
37273820
}
37283821
},
37293822
"propKeys": [
3823+
"TEXT_XS-LARKEN_FONT_WEIGHT",
37303824
"TEXT_HEADING-4_FONT_WEIGHT",
3825+
"TEXT_SM-LARKEN_FONT_WEIGHT",
37313826
"TEXT_HEADING-5_FONT_WEIGHT",
37323827
"LINE_HEIGHT_XXXL",
37333828
"LINE_HEIGHT_XL",
@@ -3761,20 +3856,27 @@
37613856
"FONT_SIZE_SM",
37623857
"FONT_SIZE_XS",
37633858
"LETTER_SPACING_TIGHT",
3859+
"TEXT_XS-LARKEN_FONT_SIZE",
37643860
"TEXT_HEADING-4_FONT_SIZE",
37653861
"FONT_SIZE_LG",
37663862
"TEXT_HEADING-3_LINE_HEIGHT",
3863+
"TEXT_SM-LARKEN_FONT_SIZE",
37673864
"TEXT_HEADING-5_FONT_SIZE",
3865+
"TEXT_XS-LARKEN_LINE_HEIGHT",
37683866
"TEXT_HEADING-4_LINE_HEIGHT",
3867+
"TEXT_BASE-LARKEN_FONT_WEIGHT",
37693868
"TEXT_HEADING-5_LINE_HEIGHT",
37703869
"TEXT_BODY-LONGFORM_FONT_SIZE",
3870+
"TEXT_SM-LARKEN_LINE_HEIGHT",
37713871
"TEXT_BODY-LONGFORM_LINE_HEIGHT",
37723872
"TEXT_LABEL-1_FONT_WEIGHT",
37733873
"LINE_HEIGHT_BASE-TIGHT",
37743874
"TEXT_LABEL-2_FONT_WEIGHT",
37753875
"TEXT_LABEL-3_FONT_WEIGHT",
37763876
"TEXT_BODY-DEFAULT_FONT_WEIGHT",
37773877
"LINE_HEIGHT_XL-TIGHT",
3878+
"TEXT_BASE-LARKEN_FONT_SIZE",
3879+
"TEXT_BASE-LARKEN_LINE_HEIGHT",
37783880
"TEXT_HERO-5_LETTER_SPACING",
37793881
"TEXT_HERO-4_LETTER_SPACING",
37803882
"TEXT_HERO-3_LETTER_SPACING",
@@ -4062,12 +4164,14 @@
40624164
"ANIMATION_DURATION_BASE",
40634165
"BORDER_SIZE_SM",
40644166
"BORDER_SIZE_LG",
4065-
"BORDER_SIZE_XL",
4066-
"BORDER_RADIUS_XS",
4067-
"BORDER_RADIUS_SM",
4167+
"BORDER_RADIUS_FULL",
4168+
"BORDER_RADIUS_XL",
40684169
"BORDER_RADIUS_MD",
4170+
"BORDER_RADIUS_NAV_TABS",
4171+
"BORDER_RADIUS_SM",
4172+
"BORDER_RADIUS_XS",
40694173
"BORDER_RADIUS_LG",
4070-
"BORDER_RADIUS_XL",
4174+
"BORDER_SIZE_XL",
40714175
"BUTTON_BORDER_WIDTH",
40724176
"BUTTON_HEIGHT",
40734177
"BUTTON_PADDING_HORIZONTAL",
@@ -4093,6 +4197,7 @@
40934197
"FONT_FAMILY",
40944198
"FONT_FAMILY_EMPHASIZE",
40954199
"FONT_FAMILY_HEAVY",
4200+
"FONT_FAMILY_LARKEN",
40964201
"PRIVATE_BADGE_BACKGROUND_NORMAL_COLOR",
40974202
"CANVAS_COLOR",
40984203
"CANVAS_CONTRAST_COLOR",

packages/bpk-foundations-common/app/borders.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,8 @@
77
"BORDER_RADIUS_SM": 8,
88
"BORDER_RADIUS_MD": 12,
99
"BORDER_RADIUS_LG": 24,
10-
"BORDER_RADIUS_XL": 40
10+
"BORDER_RADIUS_XL": 40,
11+
"BORDER_RADIUS_FULL": 9999,
12+
"BORDER_RADIUS_NAV_TABS": 18
1113
}
1214
}

packages/bpk-foundations-common/app/legacy-typography.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
{
2-
"imports": ["./typography.json"],
2+
"imports": [
3+
"./typography.json"
4+
],
35
"aliases": {
46
"FONT_SIZE_CAPS": 10,
57
"FONT_WEIGHT_BLACK": "900"

0 commit comments

Comments
 (0)