diff --git a/backpack b/backpack index de7ee37c0..9a6becf6e 160000 --- a/backpack +++ b/backpack @@ -1 +1 @@ -Subproject commit de7ee37c0a762e58e6eef9702e07f61b280787b2 +Subproject commit 9a6becf6ea5f871adc43bc3c9ee21cea8fac58ed diff --git a/docs/src/components/DocsPageWrapper/DocsPageWrapper.js b/docs/src/components/DocsPageWrapper/DocsPageWrapper.js index 42bd22e6b..bd4a9ffb0 100755 --- a/docs/src/components/DocsPageWrapper/DocsPageWrapper.js +++ b/docs/src/components/DocsPageWrapper/DocsPageWrapper.js @@ -37,7 +37,6 @@ import { cssModules } from 'backpack/packages/bpk-react-utils'; import BpkHorizontalNav, { BpkHorizontalNavItem, } from 'backpack/packages/bpk-component-horizontal-nav'; -import BpkContentContainer from 'backpack/packages/bpk-component-content-container'; const getClassName = cssModules(STYLES); @@ -219,7 +218,7 @@ const DocsPageWrapper = props => { }; return ( - +
{title} @@ -245,7 +244,7 @@ const DocsPageWrapper = props => { /> {initiallyRenderedSubpage}
- +
); }; diff --git a/docs/src/components/MarkdownPage/MarkdownPage.js b/docs/src/components/MarkdownPage/MarkdownPage.js index d5cce648b..db4ba3c54 100755 --- a/docs/src/components/MarkdownPage/MarkdownPage.js +++ b/docs/src/components/MarkdownPage/MarkdownPage.js @@ -30,7 +30,6 @@ import AdditionalLinks, { type PlatformType } from './AdditionalLinks'; import STYLES from './MarkdownPage.scss'; -import BpkContentContainer from 'backpack/packages/bpk-component-content-container'; import { cssModules } from 'backpack/packages/bpk-react-utils'; const getClassName = cssModules(STYLES); @@ -94,9 +93,7 @@ const MarkdownPage = (props: Props) => { <> {includePageHeader && } - +
{ sassdocId={sassdocId} /> - +
); }; diff --git a/docs/src/helpers/logo-helper.js b/docs/src/helpers/logo-helper.js index fa7641682..86291a161 100644 --- a/docs/src/helpers/logo-helper.js +++ b/docs/src/helpers/logo-helper.js @@ -24,7 +24,6 @@ import BackpackLogoPride from '../static/backpack-logo-pride.svg'; import BackpackLogoPrideGrey from '../static/backpack-logo-pride-sky-grey.svg'; import BackpackLogoSpooky from '../static/backpack-logo-spooky.svg'; import BackpackLogoChristmas from '../static/backpack-logo-christmas.svg'; -import BackpackLogoChristmasGrey from '../static/backpack-logo-christmas-sky-grey.svg'; export const getBackpackLogo = (overImage = false) => { const companyUpdateLogo = false; @@ -45,7 +44,7 @@ export const getBackpackLogo = (overImage = false) => { return BackpackLogoSpooky; } if (isChristmas) { - return BackpackLogoChristmasGrey; + return BackpackLogoChristmas; } if (companyUpdateLogo) { return BackpackLogoPinkGrey; diff --git a/docs/src/pages/components/Overlay/WebOverlay.mdx b/docs/src/pages/components/Overlay/WebOverlay.mdx index 0e818feaf..71cbd1a0d 100644 --- a/docs/src/pages/components/Overlay/WebOverlay.mdx +++ b/docs/src/pages/components/Overlay/WebOverlay.mdx @@ -8,45 +8,58 @@ githubPath: bpk-component-overlay import PresentationBlock from 'components/PresentationBlock'; import { - WithBpkImageExample, - WithBpkImageNoTintExample, - WithBpkImageRoundedExample, - TextOverlaidOnImageExample + SolidExamples, + TopExamples, + BottomExamples, + LeftExamples, + RightExamples, + VignetteExample, + WithForegroundContentExample, } from 'backpack/examples/bpk-component-overlay/examples'; import Readme from 'backpack/packages/bpk-component-overlay/README.md'; ## Table of contents -## Default - -Overlays apply a dark tint to their content. +## Solid - + -## Disabled tint +## Top -The tint can be switched off, causing the content within to be displayed at full brightness. + + + + +## Bottom - + -## Rounded corners +## Left + + + + -The overlay can have rounded corners. Apply this when the content inside has rounded corners, to stop the overlay from covering them up. +## Right - + -## Foreground content +## Vignette + + + + -Use foreground content to display things on top of the overlay. +## With foreground content - + ## Implementation diff --git a/docs/src/static/backpack-logo-christmas.svg b/docs/src/static/backpack-logo-christmas.svg index e3926980e..07bbc5c5f 100644 --- a/docs/src/static/backpack-logo-christmas.svg +++ b/docs/src/static/backpack-logo-christmas.svg @@ -1 +1,40 @@ - \ No newline at end of file + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/docs/src/static/backpack-logo-mark.svg b/docs/src/static/backpack-logo-mark.svg index b123483d7..b9fbc5161 100644 --- a/docs/src/static/backpack-logo-mark.svg +++ b/docs/src/static/backpack-logo-mark.svg @@ -1 +1,15 @@ - \ No newline at end of file + + + + + + + + + + + + + + + diff --git a/docs/src/static/backpack-logo-sky-grey.svg b/docs/src/static/backpack-logo-sky-grey.svg index 67d8983cc..fc27d49f8 100644 --- a/docs/src/static/backpack-logo-sky-grey.svg +++ b/docs/src/static/backpack-logo-sky-grey.svg @@ -1 +1,30 @@ - \ No newline at end of file + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/package-lock.json b/package-lock.json index 8a5ca8f67..7c45839f1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19224,7 +19224,7 @@ }, "lodash": { "version": "4.17.21", - "resolved": "http://internal-broker-server/broker/ac5d6776-fe0a-422f-9dd8-f3fca41d6e5e/api/npm/npm/lodash/-/lodash-4.17.21.tgz", + "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz", "integrity": "sha1-Z5WRxWTDv/quhFTPCz3zcMPWkRw=", "dev": true },