@vivareal/lina-icons

@vivareal/lina-icons

The Lina Design System Iconography library

Using in your project

Install it as a dependency

npm install --save @vivareal/lina-icons
# OR
yarn add -d @vivareal/lina-icons

This 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.

---

Running the documentation locally

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.

---

Contributing

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 fill property of the svg, should be currentColor, 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.