@financial-times/dotcom-ui-layout 12.2.1 → 12.3.1

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.
Files changed (3) hide show
  1. package/README.md +1 -11
  2. package/package.json +5 -6
  3. package/styles.scss +1 -1
package/README.md CHANGED
@@ -59,25 +59,15 @@ For a full example for how to use this component please refer to the [FT UI exam
59
59
 
60
60
  ### Styles
61
61
 
62
- This component includes styles written in Sass which includes the styles for [`n-ui-foundations`][n-ui-foundations] and the [header] and [footer] components. It can be imported into your application's main Sass stylesheet:
62
+ This component includes styles written in Sass which includes the styles the [header] and [footer] components. It can be imported into your application's main Sass stylesheet:
63
63
 
64
64
  ```scss
65
65
  @import '@financial-times/dotcom-ui-layout/styles';
66
66
  ```
67
67
 
68
- It is also possible to build the layout styles individually, for example to improve long-term caching. If you integrate the layout styles this way then you may need to add a dependency on `n-ui-foundations` and import its mixins into your app's main Sass stylesheet:
69
-
70
- ```scss
71
- @import 'n-ui-foundations/mixins';
72
- ```
73
-
74
- _Please note_ that the exact usage will depend on how you configure your Sass compiler and whether or not you are using Bower to install dependencies.
75
-
76
- [n-ui-foundations]: https://github.com/Financial-Times/n-ui-foundations/
77
68
  [header]: ../dotcom-ui-header/README.md
78
69
  [footer]: ../dotcom-ui-footer/README.md
79
70
 
80
-
81
71
  ## Options
82
72
 
83
73
  ### Props
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@financial-times/dotcom-ui-layout",
3
- "version": "12.2.1",
3
+ "version": "12.3.1",
4
4
  "description": "",
5
5
  "main": "component.js",
6
6
  "browser": "browser.js",
@@ -21,14 +21,13 @@
21
21
  "author": "",
22
22
  "license": "MIT",
23
23
  "dependencies": {
24
- "@financial-times/dotcom-types-navigation": "^12.2.1",
24
+ "@financial-times/dotcom-types-navigation": "^12.3.1",
25
25
  "focus-visible": "^5.0.0"
26
26
  },
27
27
  "peerDependencies": {
28
- "@financial-times/dotcom-ui-base-styles": "^12.2.1",
29
- "@financial-times/dotcom-ui-footer": "^12.2.1",
30
- "@financial-times/dotcom-ui-header": "^12.2.1",
31
- "n-ui-foundations": "^9.0.0 || ^10.0.0",
28
+ "@financial-times/dotcom-ui-base-styles": "^12.3.1",
29
+ "@financial-times/dotcom-ui-footer": "^12.3.1",
30
+ "@financial-times/dotcom-ui-header": "^12.3.1",
32
31
  "react": "17.x || 18.x",
33
32
  "react-dom": "17.x || 18.x"
34
33
  },
package/styles.scss CHANGED
@@ -25,7 +25,7 @@ $system-code: 'page-kit-layout' !default;
25
25
  }
26
26
 
27
27
  .n-layout__skip-link {
28
- @include nUiZIndexFor('notification');
28
+ z-index: var(--o3-z-message-service-popover);
29
29
  position: absolute;
30
30
  top: 1em;
31
31
  left: -9999px;