The Lina Design System Iconography library
Install it as a dependency
npm install --save @vivareal/lina-icons
# OR
yarn add -d @vivareal/lina-iconsThis is a private repo, so you'll need to be logged in NPM in order to install it. Also, you have to be part of vivareal organization at NPM. If you're not, please ask at Slack's #guild-front channel to be added =)
Usage
With icAdd being one of the available icons:
import { icAdd } from "@vivareal/lina-icons"
icAdd will be the svg markup.
Documentation generation is temporarily disabled.
Install dependencies
Go to root folder and then
make install
**Run vuepress in dev mode**
make docs-dev
It will start the vuepress dev-server and write the url on your terminal.
Add a new icon
Please check with the Design Ops team at #squad-zap-design-ops if it's ok to add the icon to the library, after that, just follow those steps:
Add the svg file to src/images folder and then build the project.
Please pay attention to two things:
- The name of the file should be the name of the icon on Figma.
- The
fillproperty of the svg, should becurrentColor, to make the icon flexible enough to be rendered in any color.
Build the project
make build
This will run svgo to optimize the icons and write them to dist/images folder.
Also, it will use rollup to bundle the icons together and export them as cjs and esm to be later imported and tree shook by the consumer project.
When the build process is done, open the pull request and wait for the approval.
Release
Releases are managed by Github Workflow. Please check the root's README for more infos.