@financial-times/o-topper 5.2.2 → 5.3.1

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # Changelog
 
+### [5.3.1](https://www.github.com/Financial-Times/origami/compare/o-topper-v5.3.0...o-topper-v5.3.1) (2022-09-01)
+
+
+### Bug Fixes
+
+* update n-map-content-to-topper to support alphaville article page branding
+
+## [5.3.0](https://www.github.com/Financial-Times/origami/compare/o-topper-v5.2.3...o-topper-v5.3.0) (2022-09-01)
+
+
+### Features
+
+* add mattisee o-topper colour for Alphaville
+
+### [5.2.3](https://www.github.com/Financial-Times/origami/compare/o-topper-v5.2.2...o-topper-v5.2.3) (2022-01-13)
+
+
+### Bug Fixes
+
+* expand all uses of docs to documentation ([26f8d9d](https://www.github.com/Financial-Times/origami/commit/26f8d9d8cbbe3e78902d8c3951b37e08150a77bd))
+
 ### [5.2.2](https://www.github.com/Financial-Times/origami/compare/o-topper-v5.2.1...o-topper-v5.2.2) (2021-12-24)
 
 

package/MIGRATION.md

@@ -27,7 +27,7 @@ The velvet topper (previously used to indicate life and arts) has been removed.
 
 Support for Bower and version 2 of the Origami Build Service have been removed.
 
-Follow [the migration guide on the Origami website](https://origami.ft.com/docs/tutorials/bower-to-npm/).
+Follow [the migration guide on the Origami website](https://origami.ft.com/documentation/tutorials/bower-to-npm/).
 
 ## Migrating from v2 to v3
 

package/README.md

@@ -11,7 +11,7 @@ This component is used for styling the topper sections of an article.
 
 ## Usage
 
-Check out [how to include Origami components in your project](https://origami.ft.com/docs/components/#including-origami-components-in-your-project) to get started with `o-topper`.
+Check out [how to include Origami components in your project](https://origami.ft.com/documentation/components/#including-origami-components-in-your-project) to get started with `o-topper`.
 
 ## Markup
 
@@ -82,6 +82,7 @@ These colors affect the background of the `.o-topper__background` and `.o-topper
 .o-topper--color-slate
 .o-topper--color-crimson
 .o-topper--color-sky
+.o-topper--color-matisse
 ```
 
 ## Sass

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@financial-times/o-topper",
-  "version": "5.2.2",
+  "version": "5.3.1",
   "description": "Article header styling",
   "keywords": [
     "topper",
@@ -18,10 +18,10 @@
     "start": "npx serve ./demos/local",
     "build": "bash ../../scripts/component/build.bash",
     "test": "bash ../../scripts/component/test.bash",
-    "lint": "bash ../../scripts/component/lint.bash"
+    "lint": "bash ../../scripts/component/lint.bash",
+    "watch": "bash ../../scripts/component/watch.bash"
   },
   "peerDependencies": {
-    "@financial-times/n-map-content-to-topper": "^1.5.0",
     "@financial-times/o-colors": "^6.0.1",
     "@financial-times/o-editorial-typography": "^2.0.1",
     "@financial-times/o-grid": "^6.0.0",
@@ -34,6 +34,9 @@
     "@financial-times/o-normalise": "^3.2.0",
     "@financial-times/o-typography": "^7.2.0"
   },
+  "dependencies": {
+    "@financial-times/n-map-content-to-topper": "^2.1.0"
+  },
   "engines": {
     "npm": "^7 || ^8"
   },

package/src/scss/_mixins.scss

@@ -317,6 +317,14 @@
 			}
 		}
 	}
+
+	@if $color-name == 'matisse' {
+		.o-topper__columnist-name {			
+			&:hover {
+				color: oColorsMix($foreground, $color-name, 73);
+			}
+		}
+	}
 }
 
 @mixin _oTopperAlignText($position) {

package/src/scss/_variables.scss

@@ -15,6 +15,7 @@ $_o-topper-colors: (
 	'wheat',
 	'crimson',
 	'sky',
+	'matisse'
 );
 
 /// When adding a new theme update the README

package/.eslintignore

@@ -1 +0,0 @@
-demos/local/**

package/.prettierrc.toml

@@ -1,8 +0,0 @@
-printWidth = 80
-trailingComma = "es5"
-semi = true
-singleQuote = true
-useTabs = true
-bracketSpacing = false
-jsxBracketSameLine = true
-arrowParens = "avoid"

package/.stylelintignore

@@ -1 +0,0 @@
-demos/local/**

package/bower.json

@@ -1,16 +0,0 @@
-{
-  "name": "o-topper",
-  "main": [
-    "main.scss",
-    "main.js"
-  ],
-  "dependencies": {
-    "o-typography": "^6.0.0",
-    "o-editorial-typography": "^1.0.0",
-    "o-grid": "^5.0.0",
-    "o-colors": "^5.0.0",
-    "o-icons": "^6.0.0",
-    "o-spacing": "^2.0.0",
-    "n-map-content-to-topper": "^1.1.0"
-  }
-}