@skyscanner/backpack-web 34.5.0 → 34.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/bpk-component-graphic-promotion/src/BpkGraphicPromo.module.css +1 -1
- package/bpk-component-popover/src/BpkPopover.js +6 -1
- package/bpk-component-text/src/BpkText.d.ts +1 -0
- package/bpk-component-text/src/BpkText.js +1 -0
- package/bpk-component-text/src/BpkText.module.css +1 -1
- package/bpk-mixins/_typography.scss +27 -11
- package/package.json +2 -2
- package/unstable__bpk-mixins/_typography.scss +27 -11
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-card{position:relative;display:block;background-color:#fff;color:#161616;text-decoration:none;cursor:pointer;box-shadow:0px 1px 3px 0px rgba(37,32,31,.3);border-radius:.75rem}.bpk-no-touch-support .bpk-card:hover:not(:active):not(:disabled)::after{opacity:1}:global(.bpk-no-touch-support) .bpk-card:hover:not(:active):not(:disabled)::after{opacity:1}.bpk-card::after{position:absolute;top:0;right:0;bottom:0;left:0;content:"";transition:opacity 200ms ease-in-out;opacity:0;pointer-events:none;box-shadow:0px 4px 14px 0px rgba(37,32,31,.25);border-radius:.75rem}@media screen\0 {.bpk-card::after{z-index:-1}}.bpk-card:active::after{box-shadow:none}.bpk-graphic-promo{max-width:76.5rem;margin-right:auto;margin-left:auto;background-color:#05203c;background-position:center;background-size:cover;color:#fff;box-shadow:none}@media(max-width: 48rem){.bpk-graphic-promo{padding-top:133%;box-sizing:border-box}}.bpk-graphic-promo::after{display:none}.bpk-graphic-promo__container{display:flex;flex-direction:column;justify-content:center}.bpk-graphic-promo__container--start{align-items:start}.bpk-graphic-promo__container--center{align-items:center}.bpk-graphic-promo__container--end{align-items:end}@media(min-width: 64.0625rem){.bpk-graphic-promo__container{height:28.75rem;margin-left:4rem;margin-right:2.5rem}html[dir=rtl] .bpk-graphic-promo__container{margin-right:4rem}html[dir=rtl] .bpk-graphic-promo__container{margin-left:2.5rem}.bpk-graphic-promo__container--center>*{margin-left:0;margin-right:1.5rem}html[dir=rtl] .bpk-graphic-promo__container--center>*{margin-left:1.5rem;margin-right:0}}@media(max-width: 64rem){.bpk-graphic-promo__container{height:22.5rem;margin-left:2.5rem;margin-right:2rem}html[dir=rtl] .bpk-graphic-promo__container{margin-right:2.5rem}html[dir=rtl] .bpk-graphic-promo__container{margin-left:2rem}.bpk-graphic-promo__container--center>*{margin-left:0;margin-right:.5rem}html[dir=rtl] .bpk-graphic-promo__container--center>*{margin-left:.5rem;margin-right:0}}@media(max-width: 48rem){.bpk-graphic-promo__container{padding:2rem;justify-content:space-between;align-items:start;text-align:start;margin-left:0;margin-right:0;position:absolute;top:0;right:0;left:0;height:100%}html[dir=rtl] .bpk-graphic-promo__container{margin-left:0;margin-right:0}.bpk-graphic-promo__container--inverted{flex-direction:column-reverse}.bpk-graphic-promo__container>*{margin-left:0;margin-right:0}html[dir=rtl] .bpk-graphic-promo__container>*{margin-left:0;margin-right:0}}@media(max-width: 22.4375rem){.bpk-graphic-promo__container{padding:1.5rem}}.bpk-graphic-promo__tagline{margin-bottom:.5rem;font-size:1rem;line-height:1.25rem;font-weight:700}@media(max-width: 64rem){.bpk-graphic-promo__tagline{font-size:1rem;line-height:1.5rem;font-weight:700}}@media(max-width: 48rem){.bpk-graphic-promo__tagline{font-size:1.5rem;line-height:2rem;font-weight:400}}@media(max-width: 22.4375rem){.bpk-graphic-promo__tagline{font-size:1rem;line-height:1.5rem;font-weight:700}}.bpk-graphic-promo__headline{margin:0}@media(min-width: 64.0625rem){.bpk-graphic-promo__headline{font-size:3rem;line-height:
|
|
18
|
+
.bpk-card{position:relative;display:block;background-color:#fff;color:#161616;text-decoration:none;cursor:pointer;box-shadow:0px 1px 3px 0px rgba(37,32,31,.3);border-radius:.75rem}.bpk-no-touch-support .bpk-card:hover:not(:active):not(:disabled)::after{opacity:1}:global(.bpk-no-touch-support) .bpk-card:hover:not(:active):not(:disabled)::after{opacity:1}.bpk-card::after{position:absolute;top:0;right:0;bottom:0;left:0;content:"";transition:opacity 200ms ease-in-out;opacity:0;pointer-events:none;box-shadow:0px 4px 14px 0px rgba(37,32,31,.25);border-radius:.75rem}@media screen\0 {.bpk-card::after{z-index:-1}}.bpk-card:active::after{box-shadow:none}.bpk-graphic-promo{max-width:76.5rem;margin-right:auto;margin-left:auto;background-color:#05203c;background-position:center;background-size:cover;color:#fff;box-shadow:none}@media(max-width: 48rem){.bpk-graphic-promo{padding-top:133%;box-sizing:border-box}}.bpk-graphic-promo::after{display:none}.bpk-graphic-promo__container{display:flex;flex-direction:column;justify-content:center}.bpk-graphic-promo__container--start{align-items:start}.bpk-graphic-promo__container--center{align-items:center}.bpk-graphic-promo__container--end{align-items:end}@media(min-width: 64.0625rem){.bpk-graphic-promo__container{height:28.75rem;margin-left:4rem;margin-right:2.5rem}html[dir=rtl] .bpk-graphic-promo__container{margin-right:4rem}html[dir=rtl] .bpk-graphic-promo__container{margin-left:2.5rem}.bpk-graphic-promo__container--center>*{margin-left:0;margin-right:1.5rem}html[dir=rtl] .bpk-graphic-promo__container--center>*{margin-left:1.5rem;margin-right:0}}@media(max-width: 64rem){.bpk-graphic-promo__container{height:22.5rem;margin-left:2.5rem;margin-right:2rem}html[dir=rtl] .bpk-graphic-promo__container{margin-right:2.5rem}html[dir=rtl] .bpk-graphic-promo__container{margin-left:2rem}.bpk-graphic-promo__container--center>*{margin-left:0;margin-right:.5rem}html[dir=rtl] .bpk-graphic-promo__container--center>*{margin-left:.5rem;margin-right:0}}@media(max-width: 48rem){.bpk-graphic-promo__container{padding:2rem;justify-content:space-between;align-items:start;text-align:start;margin-left:0;margin-right:0;position:absolute;top:0;right:0;left:0;height:100%}html[dir=rtl] .bpk-graphic-promo__container{margin-left:0;margin-right:0}.bpk-graphic-promo__container--inverted{flex-direction:column-reverse}.bpk-graphic-promo__container>*{margin-left:0;margin-right:0}html[dir=rtl] .bpk-graphic-promo__container>*{margin-left:0;margin-right:0}}@media(max-width: 22.4375rem){.bpk-graphic-promo__container{padding:1.5rem}}.bpk-graphic-promo__tagline{margin-bottom:.5rem;font-size:1rem;line-height:1.25rem;font-weight:700}@media(max-width: 64rem){.bpk-graphic-promo__tagline{font-size:1rem;line-height:1.5rem;font-weight:700}}@media(max-width: 48rem){.bpk-graphic-promo__tagline{font-size:1.5rem;line-height:2rem;font-weight:400}}@media(max-width: 22.4375rem){.bpk-graphic-promo__tagline{font-size:1rem;line-height:1.5rem;font-weight:700}}.bpk-graphic-promo__headline{margin:0}@media(min-width: 64.0625rem){.bpk-graphic-promo__headline{font-size:3rem;line-height:3rem;font-weight:900;letter-spacing:-0.04em}.bpk-graphic-promo__headline:not(:last-child){margin-bottom:.5rem}}@media(max-width: 64rem){.bpk-graphic-promo__headline{font-size:2.5rem;line-height:3rem;font-weight:700}.bpk-graphic-promo__headline:not(:last-child){margin-bottom:.5rem}}@media(max-width: 48rem){.bpk-graphic-promo__headline{margin-bottom:.5rem}}@media(max-width: 32rem){.bpk-graphic-promo__headline{font-size:2rem;line-height:2.5rem;font-weight:700}}.bpk-graphic-promo__subheading{margin:0;font-size:1rem;line-height:1.5rem;font-weight:400}@media(max-width: 64rem){.bpk-graphic-promo__subheading{font-size:1rem;line-height:1.25rem;font-weight:700}}@media(max-width: 48rem){.bpk-graphic-promo__subheading{font-size:1.5rem;line-height:1.75rem;font-weight:700}}@media(max-width: 32rem){.bpk-graphic-promo__subheading{font-size:1rem;line-height:1.25rem;font-weight:700}}.bpk-graphic-promo__promo-content,.bpk-graphic-promo__sponsor-content{display:flex;flex-direction:column}.bpk-graphic-promo__promo-content--start,.bpk-graphic-promo__sponsor-content--start{align-items:start;text-align:start}.bpk-graphic-promo__promo-content--center,.bpk-graphic-promo__sponsor-content--center{align-items:center;text-align:center}.bpk-graphic-promo__promo-content--end,.bpk-graphic-promo__sponsor-content--end{align-items:start;text-align:start}@media(min-width: 64.0625rem){.bpk-graphic-promo__promo-content,.bpk-graphic-promo__sponsor-content{width:22.5rem}}@media(max-width: 64rem){.bpk-graphic-promo__promo-content,.bpk-graphic-promo__sponsor-content{width:20rem}}@media(max-width: 48rem){.bpk-graphic-promo__promo-content,.bpk-graphic-promo__sponsor-content{width:initial;align-items:start;text-align:start}}.bpk-graphic-promo__sponsor-content{display:flex;margin-bottom:1rem;flex-direction:column}@media(max-width: 48rem){.bpk-graphic-promo__sponsor-content{margin-bottom:initial}}.bpk-graphic-promo__sponsor-label{margin-bottom:.25rem;font-size:1rem;line-height:1.5rem;font-weight:700}@media(max-width: 48rem){.bpk-graphic-promo__sponsor-label{margin-bottom:.5rem;font-size:1.5rem;line-height:1.75rem;font-weight:700}}@media(max-width: 22.4375rem){.bpk-graphic-promo__sponsor-label{margin-bottom:.25rem;font-size:1rem;line-height:1.5rem;font-weight:700}}.bpk-graphic-promo__sponsor-logo{width:auto;max-width:9.25rem;height:auto;max-height:3.75rem}.bpk-graphic-promo__cta{margin-top:2rem}@media(max-width: 48rem){.bpk-graphic-promo__cta{display:none}}
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
18
|
|
|
19
|
-
import { useState, useRef, cloneElement, isValidElement } from 'react';
|
|
19
|
+
import { useState, useEffect, useRef, cloneElement, isValidElement } from 'react';
|
|
20
20
|
import { useFloating, autoUpdate, offset, useClick, useDismiss, useInteractions, FloatingFocusManager, arrow, FloatingArrow, flip, shift } from '@floating-ui/react';
|
|
21
21
|
import { surfaceHighlightDay } from '@skyscanner/bpk-foundations-web/tokens/base.es6';
|
|
22
22
|
|
|
@@ -66,6 +66,11 @@ const BpkPopover = ({
|
|
|
66
66
|
...rest
|
|
67
67
|
}) => {
|
|
68
68
|
const [isOpenState, setIsOpenState] = useState(isOpen);
|
|
69
|
+
useEffect(() => {
|
|
70
|
+
if (!isOpen) {
|
|
71
|
+
setIsOpenState(false);
|
|
72
|
+
}
|
|
73
|
+
}, [isOpen]);
|
|
69
74
|
const arrowRef = useRef(null);
|
|
70
75
|
const {
|
|
71
76
|
context,
|
|
@@ -27,6 +27,7 @@ export declare const TEXT_STYLES: {
|
|
|
27
27
|
readonly hero3: "hero-3";
|
|
28
28
|
readonly hero4: "hero-4";
|
|
29
29
|
readonly hero5: "hero-5";
|
|
30
|
+
readonly hero6: "hero-6";
|
|
30
31
|
readonly editorial1: "editorial-1";
|
|
31
32
|
readonly editorial2: "editorial-2";
|
|
32
33
|
readonly editorial3: "editorial-3";
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* See the License for the specific language governing permissions and
|
|
16
16
|
* limitations under the License.
|
|
17
17
|
*/
|
|
18
|
-
.bpk-text{margin:0}.bpk-text--xs{font-size:.75rem;line-height:1rem;font-weight:400}.bpk-text--sm{font-size:.875rem;line-height:1.25rem;font-weight:400}.bpk-text--base{font-size:1rem;line-height:1.5rem;font-weight:400}.bpk-text--lg{font-size:1.25rem;line-height:1.75rem;font-weight:400}.bpk-text--xl{font-size:1.5rem;line-height:2rem;font-weight:400}.bpk-text--xxl{font-size:2rem;line-height:2.5rem;font-weight:700}.bpk-text--xxxl{font-size:2.5rem;line-height:3rem;font-weight:700}.bpk-text--xxxxl{font-size:3rem;line-height:3.5rem;font-weight:700;letter-spacing:-0.02em}.bpk-text--xxxxxl{font-size:4rem;line-height:
|
|
18
|
+
.bpk-text{margin:0}.bpk-text--xs{font-size:.75rem;line-height:1rem;font-weight:400}.bpk-text--sm{font-size:.875rem;line-height:1.25rem;font-weight:400}.bpk-text--base{font-size:1rem;line-height:1.5rem;font-weight:400}.bpk-text--lg{font-size:1.25rem;line-height:1.75rem;font-weight:400}.bpk-text--xl{font-size:1.5rem;line-height:2rem;font-weight:400}.bpk-text--xxl{font-size:2rem;line-height:2.5rem;font-weight:700}.bpk-text--xxxl{font-size:2.5rem;line-height:3rem;font-weight:700}.bpk-text--xxxxl{font-size:3rem;line-height:3.5rem;font-weight:700;letter-spacing:-0.02em}.bpk-text--xxxxxl{font-size:4rem;line-height:4rem;font-weight:700;letter-spacing:-0.02em}.bpk-text--caption{font-size:.75rem;line-height:1rem;font-weight:400}.bpk-text--footnote{font-size:.875rem;line-height:1.25rem;font-weight:400}.bpk-text--label-1{font-size:1rem;line-height:1.5rem;font-weight:700}.bpk-text--label-2{font-size:.875rem;line-height:1.25rem;font-weight:700}.bpk-text--label-3{font-size:.75rem;line-height:1rem;font-weight:700}.bpk-text--body-default{font-size:1rem;line-height:1.5rem;font-weight:400}.bpk-text--body-longform{font-size:1.25rem;line-height:1.75rem;font-weight:400}.bpk-text--subheading{font-size:1.5rem;line-height:2rem;font-weight:400}.bpk-text--heading-1{font-size:2.5rem;line-height:3rem;font-weight:700}.bpk-text--heading-2{font-size:2rem;line-height:2.5rem;font-weight:700}.bpk-text--heading-3{font-size:1.5rem;line-height:1.75rem;font-weight:700}.bpk-text--heading-4{font-size:1.25rem;line-height:1.5rem;font-weight:700}.bpk-text--heading-5{font-size:1rem;line-height:1.25rem;font-weight:700}.bpk-text--hero-1{font-size:7.5rem;line-height:7.5rem;font-weight:900;letter-spacing:-0.04em}.bpk-text--hero-2{font-size:6rem;line-height:6rem;font-weight:900;letter-spacing:-0.04em}.bpk-text--hero-3{font-size:4.75rem;line-height:4.75rem;font-weight:900;letter-spacing:-0.04em}.bpk-text--hero-4{font-size:4rem;line-height:4rem;font-weight:900;letter-spacing:-0.04em}.bpk-text--hero-5{font-size:3rem;line-height:3rem;font-weight:900;letter-spacing:-0.04em}.bpk-text--hero-6{font-size:2.5rem;line-height:2.5rem;font-weight:900;letter-spacing:-0.04em}.bpk-text--editorial-1{font-family:"Larken","Noto Sans Arabic","Noto Sans Hebrew","Noto Serif","Noto Serif Devanagari","Noto Serif Thai","Noto Sans SC","Noto Sans TC","Noto Sans JP","Noto Sans KR",sans-serif;font-size:3rem;line-height:3.5rem;font-weight:300}.bpk-text--editorial-2{font-family:"Larken","Noto Sans Arabic","Noto Sans Hebrew","Noto Serif","Noto Serif Devanagari","Noto Serif Thai","Noto Sans SC","Noto Sans TC","Noto Sans JP","Noto Sans KR",sans-serif;font-size:2rem;line-height:2.5rem;font-weight:300}.bpk-text--editorial-3{font-family:"Larken","Noto Sans Arabic","Noto Sans Hebrew","Noto Serif","Noto Serif Devanagari","Noto Serif Thai","Noto Sans SC","Noto Sans TC","Noto Sans JP","Noto Sans KR",sans-serif;font-size:1.25rem;line-height:1.75rem;font-weight:400}
|
|
@@ -560,8 +560,8 @@
|
|
|
560
560
|
@include _bpk-text-factory(
|
|
561
561
|
$bpk-font-size-8-xl,
|
|
562
562
|
$bpk-line-height-8-xl,
|
|
563
|
-
$bpk-font-weight-
|
|
564
|
-
$bpk-letter-spacing-
|
|
563
|
+
$bpk-font-weight-black,
|
|
564
|
+
$bpk-letter-spacing-hero
|
|
565
565
|
);
|
|
566
566
|
}
|
|
567
567
|
|
|
@@ -576,8 +576,8 @@
|
|
|
576
576
|
@include _bpk-text-factory(
|
|
577
577
|
$bpk-font-size-7-xl,
|
|
578
578
|
$bpk-line-height-7-xl,
|
|
579
|
-
$bpk-font-weight-
|
|
580
|
-
$bpk-letter-spacing-
|
|
579
|
+
$bpk-font-weight-black,
|
|
580
|
+
$bpk-letter-spacing-hero
|
|
581
581
|
);
|
|
582
582
|
}
|
|
583
583
|
|
|
@@ -592,8 +592,8 @@
|
|
|
592
592
|
@include _bpk-text-factory(
|
|
593
593
|
$bpk-font-size-6-xl,
|
|
594
594
|
$bpk-line-height-6-xl,
|
|
595
|
-
$bpk-font-weight-
|
|
596
|
-
$bpk-letter-spacing-
|
|
595
|
+
$bpk-font-weight-black,
|
|
596
|
+
$bpk-letter-spacing-hero
|
|
597
597
|
);
|
|
598
598
|
}
|
|
599
599
|
|
|
@@ -608,8 +608,8 @@
|
|
|
608
608
|
@include _bpk-text-factory(
|
|
609
609
|
$bpk-font-size-xxxxxl,
|
|
610
610
|
$bpk-line-height-xxxxxl,
|
|
611
|
-
$bpk-font-weight-
|
|
612
|
-
$bpk-letter-spacing-
|
|
611
|
+
$bpk-font-weight-black,
|
|
612
|
+
$bpk-letter-spacing-hero
|
|
613
613
|
);
|
|
614
614
|
}
|
|
615
615
|
|
|
@@ -623,9 +623,25 @@
|
|
|
623
623
|
@mixin bpk-hero-5 {
|
|
624
624
|
@include _bpk-text-factory(
|
|
625
625
|
$bpk-font-size-xxxxl,
|
|
626
|
-
$bpk-line-height-
|
|
627
|
-
$bpk-font-weight-
|
|
628
|
-
$bpk-letter-spacing-
|
|
626
|
+
$bpk-line-height-xxxl,
|
|
627
|
+
$bpk-font-weight-black,
|
|
628
|
+
$bpk-letter-spacing-hero
|
|
629
|
+
);
|
|
630
|
+
}
|
|
631
|
+
|
|
632
|
+
/// Hero 6 text style
|
|
633
|
+
///
|
|
634
|
+
/// @example scss
|
|
635
|
+
/// .selector {
|
|
636
|
+
/// @include bpk-hero-6;
|
|
637
|
+
/// }
|
|
638
|
+
|
|
639
|
+
@mixin bpk-hero-6 {
|
|
640
|
+
@include _bpk-text-factory(
|
|
641
|
+
$bpk-font-size-xxxl,
|
|
642
|
+
$bpk-line-height-xxl,
|
|
643
|
+
$bpk-font-weight-black,
|
|
644
|
+
$bpk-letter-spacing-hero
|
|
629
645
|
);
|
|
630
646
|
}
|
|
631
647
|
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@skyscanner/backpack-web",
|
|
3
|
-
"version": "34.
|
|
3
|
+
"version": "34.6.0",
|
|
4
4
|
"description": "Backpack Design System web library",
|
|
5
5
|
"repository": {
|
|
6
6
|
"type": "git",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"@popperjs/core": "^2.11.8",
|
|
27
27
|
"@radix-ui/react-slider": "^1.1.2",
|
|
28
28
|
"@react-google-maps/api": "^2.12.0",
|
|
29
|
-
"@skyscanner/bpk-foundations-web": "^
|
|
29
|
+
"@skyscanner/bpk-foundations-web": "^18.1.0",
|
|
30
30
|
"@skyscanner/bpk-svgs": "^19.3.0",
|
|
31
31
|
"a11y-focus-scope": "^1.1.3",
|
|
32
32
|
"a11y-focus-store": "^1.0.0",
|
|
@@ -560,8 +560,8 @@
|
|
|
560
560
|
@include _bpk-text-factory(
|
|
561
561
|
tokens.$bpk-font-size-8-xl,
|
|
562
562
|
tokens.$bpk-line-height-8-xl,
|
|
563
|
-
tokens.$bpk-font-weight-
|
|
564
|
-
tokens.$bpk-letter-spacing-
|
|
563
|
+
tokens.$bpk-font-weight-black,
|
|
564
|
+
tokens.$bpk-letter-spacing-hero
|
|
565
565
|
);
|
|
566
566
|
}
|
|
567
567
|
|
|
@@ -576,8 +576,8 @@
|
|
|
576
576
|
@include _bpk-text-factory(
|
|
577
577
|
tokens.$bpk-font-size-7-xl,
|
|
578
578
|
tokens.$bpk-line-height-7-xl,
|
|
579
|
-
tokens.$bpk-font-weight-
|
|
580
|
-
tokens.$bpk-letter-spacing-
|
|
579
|
+
tokens.$bpk-font-weight-black,
|
|
580
|
+
tokens.$bpk-letter-spacing-hero
|
|
581
581
|
);
|
|
582
582
|
}
|
|
583
583
|
|
|
@@ -592,8 +592,8 @@
|
|
|
592
592
|
@include _bpk-text-factory(
|
|
593
593
|
tokens.$bpk-font-size-6-xl,
|
|
594
594
|
tokens.$bpk-line-height-6-xl,
|
|
595
|
-
tokens.$bpk-font-weight-
|
|
596
|
-
tokens.$bpk-letter-spacing-
|
|
595
|
+
tokens.$bpk-font-weight-black,
|
|
596
|
+
tokens.$bpk-letter-spacing-hero
|
|
597
597
|
);
|
|
598
598
|
}
|
|
599
599
|
|
|
@@ -608,8 +608,8 @@
|
|
|
608
608
|
@include _bpk-text-factory(
|
|
609
609
|
tokens.$bpk-font-size-xxxxxl,
|
|
610
610
|
tokens.$bpk-line-height-xxxxxl,
|
|
611
|
-
tokens.$bpk-font-weight-
|
|
612
|
-
tokens.$bpk-letter-spacing-
|
|
611
|
+
tokens.$bpk-font-weight-black,
|
|
612
|
+
tokens.$bpk-letter-spacing-hero
|
|
613
613
|
);
|
|
614
614
|
}
|
|
615
615
|
|
|
@@ -623,9 +623,25 @@
|
|
|
623
623
|
@mixin bpk-hero-5 {
|
|
624
624
|
@include _bpk-text-factory(
|
|
625
625
|
tokens.$bpk-font-size-xxxxl,
|
|
626
|
-
tokens.$bpk-line-height-
|
|
627
|
-
tokens.$bpk-font-weight-
|
|
628
|
-
tokens.$bpk-letter-spacing-
|
|
626
|
+
tokens.$bpk-line-height-xxxl,
|
|
627
|
+
tokens.$bpk-font-weight-black,
|
|
628
|
+
tokens.$bpk-letter-spacing-hero
|
|
629
|
+
);
|
|
630
|
+
}
|
|
631
|
+
|
|
632
|
+
/// Hero 6 text style
|
|
633
|
+
///
|
|
634
|
+
/// @example scss
|
|
635
|
+
/// .selector {
|
|
636
|
+
/// @include bpk-hero-6;
|
|
637
|
+
/// }
|
|
638
|
+
|
|
639
|
+
@mixin bpk-hero-6 {
|
|
640
|
+
@include _bpk-text-factory(
|
|
641
|
+
tokens.$bpk-font-size-xxxl,
|
|
642
|
+
tokens.$bpk-line-height-xxl,
|
|
643
|
+
tokens.$bpk-font-weight-black,
|
|
644
|
+
tokens.$bpk-letter-spacing-hero
|
|
629
645
|
);
|
|
630
646
|
}
|
|
631
647
|
|