Hosted assets for Culture Amp's Kaizen Design System.
npm install @kaizen/hosted-assetsHosted assets used in Culture Amp's Kaizen Design System.
Returns the full URL of the asset at path managed by thekaizen-design-system-assets service.
TypeScript/JavaScript
``ts`
assetUrl("some/blob.png") // -> "https://
SCSS
`scss`
asset-url("some/blob.png") // -> "https://
1. Make sure the image exists in the kaizen-design-system-assets repo. If it doesn't, make a PR to add it (ask the Design Systems team for review). Images in this repo will be automatically uploaded and made available via a CloudFront distribution.
2. Make sure that the @kaizen/hosted-assets package is in your repo's package.json. This package provides you the assetUrl function that translates the path to the file in the kaizen-design-system-assets repo into its equivalent CloudFront URL.@kaizen/hosted-assets
3. Import the package and you can access the image through the assetUrl/asset-url function:
`js
import { assetUrl } from "@kaizen/hosted-assets";
/>
`
`scss
// SCSS
@import "~@kaizen/hosted-assets/index";
.coolpic {
background-image: url(asset-url(
"illustrations/plant-based-ham-substitute.png"
));
}
``