@financial-times/o-topper 7.0.8 → 7.1.2
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/CHANGELOG.md +28 -0
- package/README.md +1 -0
- package/demos/src/deep-landscape-left.mustache +16 -16
- package/demos/src/deep-portrait.mustache +3 -3
- package/demos/src/full-bleed-image-center.mustache +4 -4
- package/demos/src/full-bleed-image-left.mustache +4 -4
- package/demos/src/full-bleed-offset-right-rail.mustache +4 -4
- package/demos/src/full-bleed-offset.mustache +4 -4
- package/demos/src/live-blog-package.mustache +4 -4
- package/demos/src/opinion.mustache +6 -2
- package/demos/src/pa11y.mustache +26 -22
- package/demos/src/package-extra.mustache +3 -3
- package/demos/src/package-special-report.mustache +3 -3
- package/demos/src/package.mustache +1 -1
- package/demos/src/podcast.mustache +1 -1
- package/demos/src/split-text-center.mustache +3 -3
- package/demos/src/split-text-left.mustache +3 -3
- package/package.json +1 -1
- package/src/scss/_mixins.scss +11 -0
- package/src/scss/_variables.scss +2 -1
- package/src/scss/themes/_full-bleed-image.scss +0 -2
- package/src/scss/themes/_split-text.scss +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,33 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## [7.1.2](https://github.com/Financial-Times/origami/compare/o-topper-v7.1.1...o-topper-v7.1.2) (2025-10-28)
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
### Bug Fixes
|
|
7
|
+
|
|
8
|
+
* force release of unreleased components ([#2264](https://github.com/Financial-Times/origami/issues/2264)) ([c4faddc](https://github.com/Financial-Times/origami/commit/c4faddc35b69c712ca6a967353871d9921cd4dfc))
|
|
9
|
+
|
|
10
|
+
## [7.1.1](https://github.com/Financial-Times/origami/compare/o-topper-v7.1.0...o-topper-v7.1.1) (2025-10-28)
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
### Bug Fixes
|
|
14
|
+
|
|
15
|
+
* correct grammar in comments ([#2259](https://github.com/Financial-Times/origami/issues/2259)) ([54e9056](https://github.com/Financial-Times/origami/commit/54e905695f736a9280cc1b3b83e0d70be2061c58))
|
|
16
|
+
|
|
17
|
+
## [7.1.0](https://github.com/Financial-Times/origami/compare/o-topper-v7.0.9...o-topper-v7.1.0) (2025-10-26)
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
### Features
|
|
21
|
+
|
|
22
|
+
* ci-3143 multiple authors on opinion topper ([b4ce9b1](https://github.com/Financial-Times/origami/commit/b4ce9b1dfa6139b3fa6f0ce82a724619f5dd5950))
|
|
23
|
+
|
|
24
|
+
## [7.0.9](https://github.com/Financial-Times/origami/compare/o-topper-v7.0.8...o-topper-v7.0.9) (2025-06-25)
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
### Bug Fixes
|
|
28
|
+
|
|
29
|
+
* remove negative margins in o-topper ([8930853](https://github.com/Financial-Times/origami/commit/8930853fbca928ede656713f5086addd344facf3))
|
|
30
|
+
|
|
3
31
|
## [7.0.8](https://github.com/Financial-Times/origami/compare/o-topper-v7.0.7...o-topper-v7.0.8) (2025-06-13)
|
|
4
32
|
|
|
5
33
|
|
package/README.md
CHANGED
|
@@ -50,6 +50,7 @@ Toppers support a wide array of [elements](#supported-elements) and can be custo
|
|
|
50
50
|
| `.o-topper__topic` | A concept tag that represents a topic or generic concept. |
|
|
51
51
|
| `.o-topper__opinion-genre` | A concept tag that represents the abstract Opinion genre. |
|
|
52
52
|
| `.o-topper__columnist` | Wrapper element for `__columnist-name`. Should be placed below the headline and standfirst. |
|
|
53
|
+
| `.o-topper__columnist-list` | List of one or more columnists that wrote an Opinion genre article. |
|
|
53
54
|
| `.o-topper__columnist-name` | Represents the columnist that wrote an Opinion genre article. |
|
|
54
55
|
| `.o-topper__headline` | The main headline of the article. |
|
|
55
56
|
| `.o-topper__standfirst` | A short introduction to the article. |
|
|
@@ -16,11 +16,11 @@ Text Shadow + Slate background
|
|
|
16
16
|
|
|
17
17
|
<figure class="o-topper__visual">
|
|
18
18
|
<picture class="o-topper__picture">
|
|
19
|
-
<source media="(min-width: 491px) and (max-width: 1220px)" srcset="https://
|
|
20
|
-
<source media="(max-width: 490px)" srcset="https://
|
|
21
|
-
<source media="(min-width: 1221px) and (max-width: 1440px)" srcset="https://
|
|
22
|
-
<source media="(min-width: 1441px)" srcset="https://
|
|
23
|
-
<img alt="" class="o-topper__image" src="https://
|
|
19
|
+
<source media="(min-width: 491px) and (max-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/f7f44900-0eaf-4b3c-ba74-cd6f893ffd0b.jpg?source=next&fit=scale-down&quality=highest&width=1220&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/f7f44900-0eaf-4b3c-ba74-cd6f893ffd0b.jpg?source=next&fit=scale-down&quality=highest&width=1220&dpr=2 2x">
|
|
20
|
+
<source media="(max-width: 490px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/3408836a-5079-4a4c-9b19-ad54d18aa5d1.jpg?source=next&fit=scale-down&quality=highest&width=490&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/3408836a-5079-4a4c-9b19-ad54d18aa5d1.jpg?source=next&fit=scale-down&quality=highest&width=490&dpr=2 2x">
|
|
21
|
+
<source media="(min-width: 1221px) and (max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/dc1370be-2472-44af-89e3-3dde23ad2f34.jpg?source=next&fit=scale-down&quality=highest&width=1440&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/dc1370be-2472-44af-89e3-3dde23ad2f34.jpg?source=next&fit=scale-down&quality=highest&width=1440&dpr=2 2x">
|
|
22
|
+
<source media="(min-width: 1441px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/6f323aa7-692e-4b0d-a3e2-ee1c708bdf72.jpg?source=next&fit=scale-down&quality=highest&width=1920&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/dc1370be-2472-44af-89e3-3dde23ad2f34.jpg?source=next&fit=scale-down&quality=highest&width=1920&dpr=2 2x">
|
|
23
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/6f323aa7-692e-4b0d-a3e2-ee1c708bdf72.jpg?source=next&fit=scale-down&quality=highest&width=1440">
|
|
24
24
|
</picture>
|
|
25
25
|
<figcaption class="o-topper__image-credit">S @FT</figcaption>
|
|
26
26
|
</figure>
|
|
@@ -43,11 +43,11 @@ Text Shadow + Slate background
|
|
|
43
43
|
|
|
44
44
|
<figure class="o-topper__visual">
|
|
45
45
|
<picture class="o-topper__picture">
|
|
46
|
-
<source media="(min-width: 491px) and (max-width: 1220px)" srcset="https://
|
|
47
|
-
<source media="(max-width: 490px)" srcset="https://
|
|
48
|
-
<source media="(min-width: 1221px) and (max-width: 1440px)" srcset="https://
|
|
49
|
-
<source media="(min-width: 1441px)" srcset="https://
|
|
50
|
-
<img alt="" class="o-topper__image" src="https://
|
|
46
|
+
<source media="(min-width: 491px) and (max-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/f7f44900-0eaf-4b3c-ba74-cd6f893ffd0b.jpg?source=next&fit=scale-down&quality=highest&width=1220&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/f7f44900-0eaf-4b3c-ba74-cd6f893ffd0b.jpg?source=next&fit=scale-down&quality=highest&width=1220&dpr=2 2x">
|
|
47
|
+
<source media="(max-width: 490px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/3408836a-5079-4a4c-9b19-ad54d18aa5d1.jpg?source=next&fit=scale-down&quality=highest&width=490&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/3408836a-5079-4a4c-9b19-ad54d18aa5d1.jpg?source=next&fit=scale-down&quality=highest&width=490&dpr=2 2x">
|
|
48
|
+
<source media="(min-width: 1221px) and (max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/dc1370be-2472-44af-89e3-3dde23ad2f34.jpg?source=next&fit=scale-down&quality=highest&width=1440&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/dc1370be-2472-44af-89e3-3dde23ad2f34.jpg?source=next&fit=scale-down&quality=highest&width=1440&dpr=2 2x">
|
|
49
|
+
<source media="(min-width: 1441px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/6f323aa7-692e-4b0d-a3e2-ee1c708bdf72.jpg?source=next&fit=scale-down&quality=highest&width=1920&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/dc1370be-2472-44af-89e3-3dde23ad2f34.jpg?source=next&fit=scale-down&quality=highest&width=1920&dpr=2 2x">
|
|
50
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/6f323aa7-692e-4b0d-a3e2-ee1c708bdf72.jpg?source=next&fit=scale-down&quality=highest&width=1440">
|
|
51
51
|
</picture>
|
|
52
52
|
<figcaption class="o-topper__image-credit">S @FT</figcaption>
|
|
53
53
|
</figure>
|
|
@@ -69,7 +69,7 @@ Text Shadow + Slate background
|
|
|
69
69
|
<div class="o-topper__background"></div>
|
|
70
70
|
|
|
71
71
|
<figure class="o-topper__visual">
|
|
72
|
-
<picture class="o-topper__picture"><source media="(min-width: 981px) and (max-width: 1440px)" srcset="https://
|
|
72
|
+
<picture class="o-topper__picture"><source media="(min-width: 981px) and (max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/357e5a48-a1e5-47d6-9eed-2db9537f2c1f.jpg?source=next&fit=scale-down&quality=highest&width=1440&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/357e5a48-a1e5-47d6-9eed-2db9537f2c1f.jpg?source=next&fit=scale-down&quality=highest&width=1440&dpr=2 2x"><source media="(min-width: 1441px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/357e5a48-a1e5-47d6-9eed-2db9537f2c1f.jpg?source=next&fit=scale-down&quality=highest&width=1920&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/357e5a48-a1e5-47d6-9eed-2db9537f2c1f.jpg?source=next&fit=scale-down&quality=highest&width=1920&dpr=2 2x"><source media="(max-width: 490px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/f88eea18-54f1-4d59-9b7f-2672c42e3be5.jpg?source=next&fit=scale-down&quality=highest&width=490&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/f88eea18-54f1-4d59-9b7f-2672c42e3be5.jpg?source=next&fit=scale-down&quality=highest&width=490&dpr=2 2x"><source media="(min-width: 491px) and (max-width: 980px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/f88eea18-54f1-4d59-9b7f-2672c42e3be5.jpg?source=next&fit=scale-down&quality=highest&width=980&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/f88eea18-54f1-4d59-9b7f-2672c42e3be5.jpg?source=next&fit=scale-down&quality=highest&width=980&dpr=2 2x"><img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/357e5a48-a1e5-47d6-9eed-2db9537f2c1f.jpg?source=next&fit=scale-down&quality=highest&width=1440"></picture>
|
|
73
73
|
<figcaption class="o-topper__image-credit">S @FT</figcaption>
|
|
74
74
|
</figure>
|
|
75
75
|
</div>
|
|
@@ -91,11 +91,11 @@ Text Shadow + Slate background
|
|
|
91
91
|
|
|
92
92
|
<figure class="o-topper__visual">
|
|
93
93
|
<picture class="o-topper__picture">
|
|
94
|
-
<source media="(min-width: 491px) and (max-width: 1220px)" srcset="https://
|
|
95
|
-
<source media="(max-width: 490px)" srcset="https://
|
|
96
|
-
<source media="(min-width: 1221px) and (max-width: 1440px)" srcset="https://
|
|
97
|
-
<source media="(min-width: 1441px)" srcset="https://
|
|
98
|
-
<img alt="" class="o-topper__image" src="https://
|
|
94
|
+
<source media="(min-width: 491px) and (max-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/f7f44900-0eaf-4b3c-ba74-cd6f893ffd0b.jpg?source=next&fit=scale-down&quality=highest&width=1220&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/f7f44900-0eaf-4b3c-ba74-cd6f893ffd0b.jpg?source=next&fit=scale-down&quality=highest&width=1220&dpr=2 2x">
|
|
95
|
+
<source media="(max-width: 490px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/3408836a-5079-4a4c-9b19-ad54d18aa5d1.jpg?source=next&fit=scale-down&quality=highest&width=490&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/3408836a-5079-4a4c-9b19-ad54d18aa5d1.jpg?source=next&fit=scale-down&quality=highest&width=490&dpr=2 2x">
|
|
96
|
+
<source media="(min-width: 1221px) and (max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/dc1370be-2472-44af-89e3-3dde23ad2f34.jpg?source=next&fit=scale-down&quality=highest&width=1440&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/dc1370be-2472-44af-89e3-3dde23ad2f34.jpg?source=next&fit=scale-down&quality=highest&width=1440&dpr=2 2x">
|
|
97
|
+
<source media="(min-width: 1441px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/6f323aa7-692e-4b0d-a3e2-ee1c708bdf72.jpg?source=next&fit=scale-down&quality=highest&width=1920&dpr=1 1x, https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/dc1370be-2472-44af-89e3-3dde23ad2f34.jpg?source=next&fit=scale-down&quality=highest&width=1920&dpr=2 2x">
|
|
98
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/6f323aa7-692e-4b0d-a3e2-ee1c708bdf72.jpg?source=next&fit=scale-down&quality=highest&width=1440">
|
|
99
99
|
</picture>
|
|
100
100
|
<figcaption class="o-topper__image-credit">S @FT</figcaption>
|
|
101
101
|
</figure>
|
|
@@ -15,11 +15,11 @@
|
|
|
15
15
|
|
|
16
16
|
<figure class="o-topper__visual">
|
|
17
17
|
<picture class="o-topper__picture">
|
|
18
|
-
<source media="(max-width: 1440px)" srcset="https://
|
|
18
|
+
<source media="(max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/81988afb-56ea-47d3-832d-8f06eb2e7cc3.jpg?source=origami-build-tools&fit=scale-down&quality=highest&width=720 720w">
|
|
19
19
|
|
|
20
|
-
<source media="(min-width: 1440px)" srcset="https://
|
|
20
|
+
<source media="(min-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/81988afb-56ea-47d3-832d-8f06eb2e7cc3.jpg?source=origami-build-tools&fit=scale-down&quality=highest&width=800 800w">
|
|
21
21
|
|
|
22
|
-
<img alt="" class="o-topper__image" src="https://
|
|
22
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/81988afb-56ea-47d3-832d-8f06eb2e7cc3.jpg?source=origami-build-tools&fit=scale-down&quality=highest&width=800">
|
|
23
23
|
</picture>
|
|
24
24
|
<figcaption class="o-topper__image-caption">
|
|
25
25
|
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo
|
|
@@ -13,10 +13,10 @@
|
|
|
13
13
|
|
|
14
14
|
<figure class="o-topper__visual">
|
|
15
15
|
<picture class="o-topper__picture">
|
|
16
|
-
<source media="(min-width: 491px) and (max-width: 1220px)" srcset="https://
|
|
17
|
-
<source media="(max-width: 490px)" srcset="https://
|
|
18
|
-
<source media="(min-width: 1220px)" srcset="https://
|
|
19
|
-
<img alt="" class="o-topper__image" src="https://
|
|
16
|
+
<source media="(min-width: 491px) and (max-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/70d20ddc-f8d6-4d47-a448-0f40b48c0985.jpg?source=origami-build-tools&fit=scale-down&quality=highest&width=1220 1220w">
|
|
17
|
+
<source media="(max-width: 490px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/d170d4af-a0b9-4bcc-bb0a-59327dc4e7bf.jpg?source=origami-build-tools&fit=scale-down&quality=highest&width=490 490w">
|
|
18
|
+
<source media="(min-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/0c368ecb-3d2d-4bf2-be88-2befb42c45f8.jpg?source=origami-build-tools&fit=scale-down&quality=highest&width=1440 1440w">
|
|
19
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/c41b7e70-fe88-4789-818e-3bacf0f65980.jpg?source=origami-build-tools&fit=scale-down&quality=highest&width=1440">
|
|
20
20
|
</picture>
|
|
21
21
|
<figcaption class="o-topper__image-caption">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo</figcaption>
|
|
22
22
|
</figure>
|
|
@@ -13,10 +13,10 @@
|
|
|
13
13
|
|
|
14
14
|
<figure class="o-topper__visual">
|
|
15
15
|
<picture class="o-topper__picture">
|
|
16
|
-
<source media="(min-width: 491px) and (max-width: 1220px)" srcset="https://
|
|
17
|
-
<source media="(max-width: 490px)" srcset="https://
|
|
18
|
-
<source media="(min-width: 1220px)" srcset="https://
|
|
19
|
-
<img alt="" class="o-topper__image" src="https://
|
|
16
|
+
<source media="(min-width: 491px) and (max-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/70d20ddc-f8d6-4d47-a448-0f40b48c0985.jpg?source=origami-build-tools&fit=scale-down&quality=highest&width=1220 1220w">
|
|
17
|
+
<source media="(max-width: 490px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/d170d4af-a0b9-4bcc-bb0a-59327dc4e7bf.jpg?source=origami-build-tools&fit=scale-down&quality=highest&width=490 490w">
|
|
18
|
+
<source media="(min-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/0c368ecb-3d2d-4bf2-be88-2befb42c45f8.jpg?source=origami-build-tools&fit=scale-down&quality=highest&width=1440 1440w">
|
|
19
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/c41b7e70-fe88-4789-818e-3bacf0f65980.jpg?source=origami-build-tools&fit=scale-down&quality=highest&width=1440">
|
|
20
20
|
</picture>
|
|
21
21
|
<figcaption class="o-topper__image-credit">@FT</figcaption>
|
|
22
22
|
</figure>
|
|
@@ -18,10 +18,10 @@
|
|
|
18
18
|
|
|
19
19
|
<figure class="o-topper__visual">
|
|
20
20
|
<picture class="o-topper__picture">
|
|
21
|
-
<source media="(max-width: 490px)" srcset="https://
|
|
22
|
-
<source media="(max-width: 1220px)" srcset="https://
|
|
23
|
-
<source media="(min-width: 1220px)" srcset="https://
|
|
24
|
-
<img alt="" class="o-topper__image" src="https://
|
|
21
|
+
<source media="(max-width: 490px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/42da357a-f78e-11e7-8715-e94187b3017e?source=origami-build-tools&fit=scale-down&quality=highest&width=490 490w">
|
|
22
|
+
<source media="(max-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/05fff02c-f78e-11e7-8715-e94187b3017e?source=origami-build-tools&fit=scale-down&quality=highest&width=1220 1220w">
|
|
23
|
+
<source media="(min-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/402afdfa-f78e-11e7-8715-e94187b3017e?source=origami-build-tools&fit=scale-down&quality=highest&width=1440 1440w">
|
|
24
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/05fff02c-f78e-11e7-8715-e94187b3017e?source=origami-build-tools&fit=scale-down&quality=highest&width=1440">
|
|
25
25
|
</picture>
|
|
26
26
|
<figcaption class="o-topper__image-credit">© Bloomberg</figcaption>
|
|
27
27
|
</figure>
|
|
@@ -18,10 +18,10 @@
|
|
|
18
18
|
|
|
19
19
|
<figure class="o-topper__visual">
|
|
20
20
|
<picture class="o-topper__picture">
|
|
21
|
-
<source media="(max-width: 490px)" srcset="https://
|
|
22
|
-
<source media="(max-width: 1220px)" srcset="https://
|
|
23
|
-
<source media="(min-width: 1220px)" srcset="https://
|
|
24
|
-
<img alt="" class="o-topper__image" src="https://
|
|
21
|
+
<source media="(max-width: 490px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/42da357a-f78e-11e7-8715-e94187b3017e?source=origami-build-tools&fit=scale-down&quality=highest&width=490 490w">
|
|
22
|
+
<source media="(max-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/05fff02c-f78e-11e7-8715-e94187b3017e?source=origami-build-tools&fit=scale-down&quality=highest&width=1220 1220w">
|
|
23
|
+
<source media="(min-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/402afdfa-f78e-11e7-8715-e94187b3017e?source=origami-build-tools&fit=scale-down&quality=highest&width=1440 1440w">
|
|
24
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/05fff02c-f78e-11e7-8715-e94187b3017e?source=origami-build-tools&fit=scale-down&quality=highest&width=1440">
|
|
25
25
|
</picture>
|
|
26
26
|
<figcaption class="o-topper__image-caption">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo © Bloomberg</figcaption>
|
|
27
27
|
</figure>
|
|
@@ -30,15 +30,15 @@
|
|
|
30
30
|
<figure class="o-topper__visual">
|
|
31
31
|
<picture class="o-topper__picture">
|
|
32
32
|
<source media="(max-width: 1220px)"
|
|
33
|
-
srcset="https://
|
|
33
|
+
srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/8f105cfc-306a-4d63-b8ba-f25e64ffeef6.jpg?source=next&amp;fit=scale-down&amp;quality=highest&amp;width=1220 1220w"
|
|
34
34
|
data-testid="responsive-source">
|
|
35
35
|
<source media="(max-width: 490px)"
|
|
36
|
-
srcset="https://
|
|
36
|
+
srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/ceb8f94e-f136-415a-b813-59edf7304031.jpg?source=next&amp;fit=scale-down&amp;quality=highest&amp;width=490 490w"
|
|
37
37
|
data-testid="responsive-source">
|
|
38
38
|
<source media="(min-width: 1220px)"
|
|
39
|
-
srcset="https://
|
|
39
|
+
srcset="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/b237a4ec-91b3-4082-984a-adf651c27465.jpg?source=next&amp;fit=scale-down&amp;quality=highest&amp;width=1440 1440w"
|
|
40
40
|
data-testid="responsive-source"><img alt="" class="o-topper__image"
|
|
41
|
-
src="https://
|
|
41
|
+
src="https://images.ft.com/v3/image/raw/https://d1e00ek4ebabms.cloudfront.net/production/8f105cfc-306a-4d63-b8ba-f25e64ffeef6.jpg?source=next&amp;fit=scale-down&amp;quality=highest&amp;width=1440">
|
|
42
42
|
</picture>
|
|
43
43
|
<figcaption class="o-topper__image-credit">© REUTERS</figcaption>
|
|
44
44
|
</figure>
|
|
@@ -16,11 +16,15 @@
|
|
|
16
16
|
<div class="o-topper__standfirst">Governments and leveraged borrowers would suffer if interest rates rise quickly</div>
|
|
17
17
|
|
|
18
18
|
<div class="o-topper__columnist">
|
|
19
|
-
<
|
|
19
|
+
<ul class="o-topper__columnist-list">
|
|
20
|
+
<li>
|
|
21
|
+
<a class="o-topper__columnist-name" href="https://www.ft.com/gillian-tett">Gillian Tett</a>
|
|
22
|
+
</li>
|
|
23
|
+
</ul>
|
|
20
24
|
</div>
|
|
21
25
|
|
|
22
26
|
<div class="o-topper__headshot">
|
|
23
|
-
<img class="o-topper__headshot-image" src="https://
|
|
27
|
+
<img class="o-topper__headshot-image" src="https://images.ft.com/v3/image/raw/fthead-v1:gillian-tett?source=origami-build-tools&fit=scale-down&width=150&compression=best&quality=highest&dpr=2" role="presentation">
|
|
24
28
|
</div>
|
|
25
29
|
</div>
|
|
26
30
|
|
package/demos/src/pa11y.mustache
CHANGED
|
@@ -45,10 +45,10 @@
|
|
|
45
45
|
|
|
46
46
|
<figure class="o-topper__visual">
|
|
47
47
|
<picture class="o-topper__picture">
|
|
48
|
-
<source media="(max-width: 490px)" srcset="https://
|
|
49
|
-
<source media="(max-width: 1220px)" srcset="https://
|
|
50
|
-
<source media="(min-width: 1220px)" srcset="https://
|
|
51
|
-
<img alt="" class="o-topper__image" src="https://
|
|
48
|
+
<source media="(max-width: 490px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/194b5a92-9486-11e7-a9e6-11d2f0ebb7f0?source=origami-build-tools&fit=scale-down&quality=highest&width=490 490w">
|
|
49
|
+
<source media="(max-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/37f4c8fc-9486-11e7-a9e6-11d2f0ebb7f0?source=origami-build-tools&fit=scale-down&quality=highest&width=1220 1220w">
|
|
50
|
+
<source media="(min-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/13d2136c-9486-11e7-a9e6-11d2f0ebb7f0?source=origami-build-tools&fit=scale-down&quality=highest&width=1440 1440w">
|
|
51
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/37f4c8fc-9486-11e7-a9e6-11d2f0ebb7f0?source=origami-build-tools&fit=scale-down&quality=highest&width=1440">
|
|
52
52
|
</picture>
|
|
53
53
|
</figure>
|
|
54
54
|
</div>
|
|
@@ -72,10 +72,10 @@
|
|
|
72
72
|
|
|
73
73
|
<figure class="o-topper__visual">
|
|
74
74
|
<picture class="o-topper__picture">
|
|
75
|
-
<source media="(max-width: 490px)" srcset="https://
|
|
76
|
-
<source media="(max-width: 1220px)" srcset="https://
|
|
77
|
-
<source media="(min-width: 1220px)" srcset="https://
|
|
78
|
-
<img alt="" class="o-topper__image" src="https://
|
|
75
|
+
<source media="(max-width: 490px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/42da357a-f78e-11e7-8715-e94187b3017e?source=origami-build-tools&fit=scale-down&quality=highest&width=490 490w">
|
|
76
|
+
<source media="(max-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/05fff02c-f78e-11e7-8715-e94187b3017e?source=origami-build-tools&fit=scale-down&quality=highest&width=1220 1220w">
|
|
77
|
+
<source media="(min-width: 1220px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/402afdfa-f78e-11e7-8715-e94187b3017e?source=origami-build-tools&fit=scale-down&quality=highest&width=1440 1440w">
|
|
78
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/05fff02c-f78e-11e7-8715-e94187b3017e?source=origami-build-tools&fit=scale-down&quality=highest&width=1440">
|
|
79
79
|
</picture>
|
|
80
80
|
<figcaption class="o-topper__image-credit">© Bloomberg</figcaption>
|
|
81
81
|
</figure>
|
|
@@ -98,11 +98,15 @@
|
|
|
98
98
|
<div class="o-topper__standfirst">Governments and leveraged borrowers would suffer if interest rates rise quickly</div>
|
|
99
99
|
|
|
100
100
|
<div class="o-topper__columnist">
|
|
101
|
-
<
|
|
101
|
+
<ul class="o-topper__columnist-list">
|
|
102
|
+
<li>
|
|
103
|
+
<a class="o-topper__columnist-name" href="https://www.ft.com/gillian-tett">Gillian Tett</a>
|
|
104
|
+
</li>
|
|
105
|
+
</ul>
|
|
102
106
|
</div>
|
|
103
107
|
|
|
104
108
|
<div class="o-topper__headshot">
|
|
105
|
-
<img class="o-topper__headshot-image" src="https://
|
|
109
|
+
<img class="o-topper__headshot-image" src="https://images.ft.com/v3/image/raw/fthead-v1:gillian-tett?source=origami-build-tools&fit=scale-down&width=150&compression=best&quality=highest&dpr=2" role="presentation">
|
|
106
110
|
</div>
|
|
107
111
|
</div>
|
|
108
112
|
|
|
@@ -123,11 +127,11 @@
|
|
|
123
127
|
|
|
124
128
|
<figure class="o-topper__visual">
|
|
125
129
|
<picture class="o-topper__picture">
|
|
126
|
-
<source media="(max-width: 1440px)" srcset="https://
|
|
130
|
+
<source media="(max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/4fe8c9c0-36f5-11e7-bce4-9023f8c0fd2e?source=origami-build-tools&fit=scale-down&quality=highest&width=720 720w">
|
|
127
131
|
|
|
128
|
-
<source media="(min-width: 1440px)" srcset="https://
|
|
132
|
+
<source media="(min-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/1e786f9e-36f5-11e7-99bd-13beb0903fa3?source=origami-build-tools&fit=scale-down&quality=highest&width=800 800w">
|
|
129
133
|
|
|
130
|
-
<img alt="" class="o-topper__image" src="https://
|
|
134
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/1e786f9e-36f5-11e7-99bd-13beb0903fa3?source=origami-build-tools&fit=scale-down&quality=highest&width=800">
|
|
131
135
|
</picture>
|
|
132
136
|
<figcaption class="o-topper__image-credit">© FT montage</figcaption>
|
|
133
137
|
</figure>
|
|
@@ -147,9 +151,9 @@
|
|
|
147
151
|
|
|
148
152
|
<figure class="o-topper__visual">
|
|
149
153
|
<picture class="o-topper__picture">
|
|
150
|
-
<source media="(max-width: 1440px)" srcset="https://
|
|
151
|
-
<source media="(min-width: 1440px)" srcset="https://
|
|
152
|
-
<img alt="" class="o-topper__image" src="https://
|
|
154
|
+
<source media="(max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/87c44eba-a823-11e7-ab55-27219df83c97?source=origami-build-tools&fit=scale-down&quality=highest&width=720 720w">
|
|
155
|
+
<source media="(min-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/8c35d22a-a823-11e7-ab55-27219df83c97?source=origami-build-tools&fit=scale-down&quality=highest&width=800 800w">
|
|
156
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/aed45398-a99e-11e7-93c5-648314d2c72c?source=origami-build-tools&fit=scale-down&quality=highest&width=800">
|
|
153
157
|
</picture>
|
|
154
158
|
</figure>
|
|
155
159
|
</div>
|
|
@@ -173,11 +177,11 @@
|
|
|
173
177
|
|
|
174
178
|
<figure class="o-topper__visual">
|
|
175
179
|
<picture class="o-topper__picture">
|
|
176
|
-
<source media="(max-width: 1440px)" srcset="https://
|
|
180
|
+
<source media="(max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/87dd1db8-3ba5-11e7-821a-6027b8a20f23?source=origami-build-tools&fit=scale-down&quality=highest&width=720 720w">
|
|
177
181
|
|
|
178
|
-
<source media="(min-width: 1440px)" srcset="https://
|
|
182
|
+
<source media="(min-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/6ddeb85e-3ba5-11e7-ac89-b01cc67cfeec?source=origami-build-tools&fit=scale-down&quality=highest&width=800 800w">
|
|
179
183
|
|
|
180
|
-
<img alt="" class="o-topper__image" src="https://
|
|
184
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/6ddeb85e-3ba5-11e7-ac89-b01cc67cfeec?source=origami-build-tools&fit=scale-down&quality=highest&width=800">
|
|
181
185
|
</picture>
|
|
182
186
|
|
|
183
187
|
<figcaption class="o-topper__image-credit">© Ollanski</figcaption>
|
|
@@ -200,11 +204,11 @@
|
|
|
200
204
|
|
|
201
205
|
<figure class="o-topper__visual">
|
|
202
206
|
<picture class="o-topper__picture">
|
|
203
|
-
<source media="(max-width: 1440px)" srcset="https://
|
|
207
|
+
<source media="(max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/3eceaf1e-61a3-11e7-91a7-502f7ee26895?source=origami-build-tools&fit=scale-down&quality=highest&width=720 720w">
|
|
204
208
|
|
|
205
|
-
<source media="(min-width: 1440px)" srcset="https://
|
|
209
|
+
<source media="(min-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/6b7b8578-61a3-11e7-91a7-502f7ee26895?source=origami-build-tools&fit=scale-down&quality=highest&width=800 800w">
|
|
206
210
|
|
|
207
|
-
<img alt="" class="o-topper__image" src="https://
|
|
211
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/97a49d16-61e8-11e7-8814-0ac7eb84e5f1?source=origami-build-tools&fit=scale-down&quality=highest&width=800">
|
|
208
212
|
</picture>
|
|
209
213
|
<figcaption class="o-topper__image-credit">© KMG/SWNS.com</figcaption>
|
|
210
214
|
</figure>
|
|
@@ -13,11 +13,11 @@
|
|
|
13
13
|
|
|
14
14
|
<figure class="o-topper__visual">
|
|
15
15
|
<picture class="o-topper__picture">
|
|
16
|
-
<source media="(max-width: 1440px)" srcset="https://
|
|
16
|
+
<source media="(max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/4fe8c9c0-36f5-11e7-bce4-9023f8c0fd2e?source=origami-build-tools&fit=scale-down&quality=highest&width=720 720w">
|
|
17
17
|
|
|
18
|
-
<source media="(min-width: 1440px)" srcset="https://
|
|
18
|
+
<source media="(min-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/1e786f9e-36f5-11e7-99bd-13beb0903fa3?source=origami-build-tools&fit=scale-down&quality=highest&width=800 800w">
|
|
19
19
|
|
|
20
|
-
<img alt="" class="o-topper__image" src="https://
|
|
20
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/1e786f9e-36f5-11e7-99bd-13beb0903fa3?source=origami-build-tools&fit=scale-down&quality=highest&width=800">
|
|
21
21
|
</picture>
|
|
22
22
|
<figcaption class="o-topper__image-credit">© FT montage</figcaption>
|
|
23
23
|
</figure>
|
|
@@ -16,11 +16,11 @@
|
|
|
16
16
|
|
|
17
17
|
<figure class="o-topper__visual">
|
|
18
18
|
<picture class="o-topper__picture">
|
|
19
|
-
<source media="(min-width: 1440px)" srcset="https://
|
|
19
|
+
<source media="(min-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/ftcms:0eac32d0-1cec-4f20-a183-d9f4370309fb?source=next&fit=scale-down&quality=highest&width=1067 1067w">
|
|
20
20
|
|
|
21
|
-
<source media="(max-width: 1440px)" srcset="https://
|
|
21
|
+
<source media="(max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/ftcms:63ebca9e-3091-4cde-a958-33ee6405c741?source=next&fit=scale-down&quality=highest&width=720 720w">
|
|
22
22
|
|
|
23
|
-
<img alt="" class="o-topper__image" src="https://
|
|
23
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/ftcms:0eac32d0-1cec-4f20-a183-d9f4370309fb?source=next&fit=scale-down&quality=highest&width=1067">
|
|
24
24
|
</picture>
|
|
25
25
|
</figure>
|
|
26
26
|
</div>
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
|
|
14
14
|
<figure class="o-topper__visual">
|
|
15
15
|
<picture class="o-topper__picture">
|
|
16
|
-
<source media="(max-width: 1440px)" srcset="https://
|
|
16
|
+
<source media="(max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/87c44eba-a823-11e7-ab55-27219df83c97?source=origami-build-tools&fit=scale-down&quality=highest&width=720 720w">
|
|
17
17
|
<source media="(min-width: 1440px)" srcset="https://www.ft.com/__origami/service/image/v2/images/raw/http://prod-upp-image-read.ft.com/8c35d22a-a823-11e7-ab55-27219df83c97?source=origami-build-tools&fit=scale-down&quality=highest&width=800 800w">
|
|
18
18
|
<img alt="" class="o-topper__image" src="https://www.ft.com/__origami/service/image/v2/images/raw/http://prod-upp-image-read.ft.com/aed45398-a99e-11e7-93c5-648314d2c72c?source=origami-build-tools&fit=scale-down&quality=highest&width=800">
|
|
19
19
|
</picture>
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
<div class="o-topper__headshot">
|
|
17
17
|
<img
|
|
18
18
|
class="o-topper__headshot-image"
|
|
19
|
-
src="https://
|
|
19
|
+
src="https://images.ft.com/v3/image/raw/https%3A%2F%2Fthumborcdn.acast.com%2FAav5xgfc2N_Vq1iQ75Njpb28DPU%3D%2F3000x3000%2Fhttps%3A%2F%2Fmediacdn.acast.com%2Fassets%2F73fe3ede-5c5c-4850-96a8-30db8dbae8bf%2F-jn0lbpr9-news_briefing_logo.jpg?source=app&width=500&fit=scale-down"
|
|
20
20
|
role="presentation">
|
|
21
21
|
</div>
|
|
22
22
|
</div>
|
|
@@ -18,11 +18,11 @@
|
|
|
18
18
|
|
|
19
19
|
<figure class="o-topper__visual">
|
|
20
20
|
<picture class="o-topper__picture">
|
|
21
|
-
<source media="(max-width: 1440px)" srcset="https://
|
|
21
|
+
<source media="(max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/87dd1db8-3ba5-11e7-821a-6027b8a20f23?source=origami-build-tools&fit=scale-down&quality=highest&width=720 720w">
|
|
22
22
|
|
|
23
|
-
<source media="(min-width: 1440px)" srcset="https://
|
|
23
|
+
<source media="(min-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/6ddeb85e-3ba5-11e7-ac89-b01cc67cfeec?source=origami-build-tools&fit=scale-down&quality=highest&width=800 800w">
|
|
24
24
|
|
|
25
|
-
<img alt="" class="o-topper__image" src="https://
|
|
25
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/6ddeb85e-3ba5-11e7-ac89-b01cc67cfeec?source=origami-build-tools&fit=scale-down&quality=highest&width=800">
|
|
26
26
|
</picture>
|
|
27
27
|
|
|
28
28
|
<figcaption class="o-topper__image-credit">© Ollanski</figcaption>
|
|
@@ -15,11 +15,11 @@
|
|
|
15
15
|
|
|
16
16
|
<figure class="o-topper__visual">
|
|
17
17
|
<picture class="o-topper__picture">
|
|
18
|
-
<source media="(max-width: 1440px)" srcset="https://
|
|
18
|
+
<source media="(max-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/3eceaf1e-61a3-11e7-91a7-502f7ee26895?source=origami-build-tools&fit=scale-down&quality=highest&width=720 720w">
|
|
19
19
|
|
|
20
|
-
<source media="(min-width: 1440px)" srcset="https://
|
|
20
|
+
<source media="(min-width: 1440px)" srcset="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/6b7b8578-61a3-11e7-91a7-502f7ee26895?source=origami-build-tools&fit=scale-down&quality=highest&width=800 800w">
|
|
21
21
|
|
|
22
|
-
<img alt="" class="o-topper__image" src="https://
|
|
22
|
+
<img alt="" class="o-topper__image" src="https://images.ft.com/v3/image/raw/http://prod-upp-image-read.ft.com/97a49d16-61e8-11e7-8814-0ac7eb84e5f1?source=origami-build-tools&fit=scale-down&quality=highest&width=800">
|
|
23
23
|
</picture>
|
|
24
24
|
<figcaption class="o-topper__image-caption">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo </figcaption>
|
|
25
25
|
|
package/package.json
CHANGED
package/src/scss/_mixins.scss
CHANGED
|
@@ -248,6 +248,17 @@
|
|
|
248
248
|
}
|
|
249
249
|
}
|
|
250
250
|
|
|
251
|
+
@if index($elements, 'columnist-list') {
|
|
252
|
+
.o-topper__columnist-list {
|
|
253
|
+
@extend %_o-topper__tag;
|
|
254
|
+
display: contents;
|
|
255
|
+
list-style: none;
|
|
256
|
+
li {
|
|
257
|
+
display: inline-block;
|
|
258
|
+
}
|
|
259
|
+
}
|
|
260
|
+
}
|
|
261
|
+
|
|
251
262
|
@if index($elements, 'columnist-name') {
|
|
252
263
|
.o-topper__columnist-name {
|
|
253
264
|
@extend %_o-topper__tag;
|
package/src/scss/_variables.scss
CHANGED
|
@@ -45,7 +45,7 @@ $_o-topper-themes: (
|
|
|
45
45
|
'deep-landscape'
|
|
46
46
|
);
|
|
47
47
|
|
|
48
|
-
/// When adding a new element update the README
|
|
48
|
+
/// When adding a new element, update the README.
|
|
49
49
|
/// @prop {List} - element options
|
|
50
50
|
/// @access private
|
|
51
51
|
$_o-topper-elements: (
|
|
@@ -59,6 +59,7 @@ $_o-topper-elements: (
|
|
|
59
59
|
'summary--body',
|
|
60
60
|
'tags',
|
|
61
61
|
'columnist',
|
|
62
|
+
'columnist-list',
|
|
62
63
|
'columnist-name',
|
|
63
64
|
'brand',
|
|
64
65
|
'topic',
|
|
@@ -43,7 +43,6 @@
|
|
|
43
43
|
background: transparent;
|
|
44
44
|
}
|
|
45
45
|
|
|
46
|
-
|
|
47
46
|
}
|
|
48
47
|
@include oPrivateGridRespondTo(L) {
|
|
49
48
|
grid-template-rows: minmax(auto, 600px) 1fr;
|
|
@@ -68,6 +67,5 @@
|
|
|
68
67
|
.o-topper__image-caption {
|
|
69
68
|
background-color: transparent;
|
|
70
69
|
color: oPrivateFoundationGet("o3-color-palette-black-70");
|
|
71
|
-
margin-bottom: -20px;
|
|
72
70
|
}
|
|
73
71
|
}
|