@vivareal/lina-tokens

Project responsible for transforming and formatting design tokens.

Usage no npm install needed!

<script type="module">
  import vivarealLinaTokens from 'https://cdn.skypack.dev/@vivareal/lina-tokens';
</script>

README

Lina Tokens

Project responsible for transforming and formatting design tokens.

Installing

Go to root folder and then

make install

Build the tokens

make build

and the web and Android files will be built and placed on the dist folder.

make build-ios

will build iOS files and save it at packages/lina-ios

make build-all

will build all platforms.

lina-ios files should only be added to git history by commit releases.

Tests

Running tests

yarn test
# or
make test

Remove obsolete tests

yarn test:update
# or
make test obsolete=true

Developing locally

make docs-dev

Folder structure

├── README.md
├── build/tokens.js  // Code necessary to build the tokens
├── configs/
├── src/
│   ├── brands/ // brand-specific tokens are here
│       ├── <BRAND>
│          ├── color/
│              ├── base.json
│              ├── font.json
│          ├── size/
│              ├── font.json
│   ├── general/  // general tokens here
│       ├── color/
│           ├── base.json
│           ├── font.json
│       ├── size/
│           ├── font.json
├── dist
│   ├── <BRAND>
│      ├── android/
│         ├── font_dimens.xml
│         ├── colors.xml
│      ├── scss/
│         ├── _variables.scss
│      ├── ios/
│         ├── StyleDictionaryColor.h
│         ├── StyleDictionaryColor.m
│         ├── StyleDictionarySize.h
│         ├── StyleDictionarySize.m
│      ├── ios-swift/
│         ├── StyleDictionary.swift
│         ├── StyleDictionaryColor.swift
│         ├── StyleDictionarySize.swift

Contributing

Creating / Editing a token

Tokens are created using Amazon's Style Dictionary.
Please read the docs before starting to create or edit a token.

Release

Releases are managed by Lerna. Please check the root's README for more infos.