Build and publish spectrum-css workflow svg icons and svg sprite sheet for Spectrum CSS.
yarn installRun yarn build will generate the ready to publish package in dist/.
Run yarn serve to see the mini-site for all the workflow icons.
Run yarn serve:react to see the mini-site for the React version of icons.
- Make sure connect to corp network.
- Run
yarn upgrade --scope @a4u --latestto update the icon set from Adobe corp artifactory. - Run
yarn build-iconsto rebuild theicons/folder. - Follow the external user steps for building and previewing results.
Icons include CSS Custom Properties as fill attributes.
Example:
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
<path d="m16.87598,4.84082h-.00098l-5.74902-3.31934c-.69629-.40234-1.55859-.40137-2.25098,0l-5.75098,3.31934c-.69336.40137-1.12402,1.14844-1.12402,1.94922v6.63965c0,.80176.43164,1.54785,1.125,1.94824l5.74902,3.32031c.34766.20117.7373.30078,1.12598.30078.38965,0,.77832-.09961,1.125-.30078l5.75-3.32031c.69336-.40039,1.125-1.14648,1.125-1.94824v-6.63965c0-.80078-.43066-1.54785-1.12402-1.94922Zm-7.25-2.02051c.11523-.06738.24414-.10059.37402-.10059.12891,0,.25879.0332.375.10059l5.28516,3.05151-5.65942,3.12231-5.66431-3.12085,5.28955-3.05298ZM3.875,14.0791c-.23145-.13379-.375-.38281-.375-.64941v-6.30371l5.75,3.16797v6.88892l-5.375-3.10376Zm12.25,0l-5.375,3.10327v-6.8894l5.75-3.17236v6.30908c0,.2666-.14355.51562-.375.64941Z" fill="var(--iconPrimary, #222)"/>
</svg>Here is the list of properties available:
| Property name | Fallback value | Additional context |
|---|---|---|
--iconPrimary |
currentColor |
Most workflow icons |
--iconRedPrimary |
#d31510 | Used in: CloudStateErrorRed_22x20.svg
|
--iconFill |
#464646 | Express only |
--iconFillMedium |
#909090 | Express only |
The following tasks are available:
| Command | Description | Examples |
|---|---|---|
clean |
Cleans all output files in the dist directory | yarn clean |
build |
Cleans the dist directory, copies website assets and then brings in the rsp, express, and workflow icons into dist | yarn build |
build:icons |
Deletes and rebuilds the icon folder, can only be run by an Adobe employee with access | yarn build:icons |
serve |
Builds and opens a localhost of the preview website to view the SVG and express icons | yarn serve |
serve:react |
Builds and opens a localhost of the preview website to view the React icons | yarn serve:react |
Contributions are welcomed! Read the Contributing guide for more information.
This project is licensed under the Apache V2 License. See LICENSE for more information.