@financial-times/o-teaser 9.0.0 → 9.1.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/CHANGELOG.md +7 -0
- package/package.json +1 -1
- package/src/scss/_mixins.scss +18 -0
- package/src/scss/_variables.scss +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,12 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## [9.1.0](https://github.com/Financial-Times/origami/compare/o-teaser-v9.0.0...o-teaser-v9.1.0) (2025-11-04)
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
### Features
|
|
7
|
+
|
|
8
|
+
* Add new styling for o-teaser labels ([#2268](https://github.com/Financial-Times/origami/issues/2268)) ([b356c83](https://github.com/Financial-Times/origami/commit/b356c8377817cadafc3e1da5614156f7d7159c63))
|
|
9
|
+
|
|
3
10
|
## [9.0.0](https://github.com/Financial-Times/origami/compare/o-teaser-v8.0.1...o-teaser-v9.0.0) (2025-10-23)
|
|
4
11
|
|
|
5
12
|
|
package/package.json
CHANGED
package/src/scss/_mixins.scss
CHANGED
|
@@ -16,6 +16,8 @@
|
|
|
16
16
|
@include _oTeaserElementsRelatedItems;
|
|
17
17
|
} @else if $group == 'syndication' {
|
|
18
18
|
@include _oTeaserSyndicationIndicator;
|
|
19
|
+
} @else if $group == 'labels' {
|
|
20
|
+
@include _oTeaserElementsLabels;
|
|
19
21
|
}
|
|
20
22
|
}
|
|
21
23
|
|
|
@@ -117,6 +119,22 @@
|
|
|
117
119
|
@include _oTeaserHeadshot;
|
|
118
120
|
}
|
|
119
121
|
|
|
122
|
+
@mixin _oTeaserElementsLabels {
|
|
123
|
+
.o-teaser__labels {
|
|
124
|
+
font-family: oPrivateFoundationGet('o3-type-label-font-family');
|
|
125
|
+
font-size: oPrivateFoundationGet('o3-type-label-font-size');
|
|
126
|
+
font-weight: oPrivateFoundationGet('o3-type-label-font-weight');
|
|
127
|
+
line-height: oPrivateFoundationGet('o3-type-label-line-height');
|
|
128
|
+
text-transform: oPrivateFoundationGet('o3-type-label-text-case');
|
|
129
|
+
color: $_o-teaser-muted;
|
|
130
|
+
display: block;
|
|
131
|
+
// Moves labels to the bottom when stretched modifier is used
|
|
132
|
+
margin-top: auto;
|
|
133
|
+
// and ensures there is always some gap above
|
|
134
|
+
padding-top: oPrivateSpacingByName('s4');
|
|
135
|
+
}
|
|
136
|
+
}
|
|
137
|
+
|
|
120
138
|
@mixin _oTeaserElementsTimestamp {
|
|
121
139
|
.o-teaser__timestamp-date,
|
|
122
140
|
.o-teaser__timestamp {
|
package/src/scss/_variables.scss
CHANGED
|
@@ -7,7 +7,7 @@ $_o-teaser-themes: ('small', 'large', 'standard', 'video', 'audio', 'hero', 'top
|
|
|
7
7
|
|
|
8
8
|
/// List of element styles available
|
|
9
9
|
/// @access private
|
|
10
|
-
$_o-teaser-elements: ('default', 'images', 'timestamp', 'promoted', 'related-items', 'syndication');
|
|
10
|
+
$_o-teaser-elements: ('default', 'images', 'timestamp', 'promoted', 'related-items', 'syndication', 'labels');
|
|
11
11
|
|
|
12
12
|
/// Commonly used text colour.
|
|
13
13
|
/// @type Color
|