福玛 36个托肯
Forma 36的设计代号为:JSON,CSS,和SCSS.
这些符号是我们设计系统的关键部分 和动力 forma-36-react-components 财务报告和审定财务报表 forma-36-fcss。 。 。 .
图书馆使用情况
将软件包安装到您的工程
yarn add @contentful/forma-36-tokens
或国家防范机制
npm i @contentful/forma-36-tokens
导入到您的工程
联合来文
import F36Tokens from '@contentful/forma-36-tokens';
支助科
@import '@contentful/forma-36-tokens/dist/css/index.css';
常设委员会
@import '@contentful/forma-36-tokens/dist/scss/index.scss';
贾森
import tokens from '@contentful/forma-36-tokens/dist/json/transitions/transition-easings';
发展
用于地方发展 yarn 从此 repo 的根来安装所有依赖和运行 yarn build 从此 repo 根来构建所有软件包.
所有标志都保存在 src/tokens 目录和这样编排:
.
├── border-radius
│ ├── border-radius.js
├── box-shadows
│ ├── box-shadows.js
│ └── glows.js
├── colors
│ ├── colors-blue.js
│ ├── colors-contrast.js
│ ├── colors-coral.js
│ ├── colors-elements.js
│ ├── colors-green.js
│ ├── colors-ice.js
│ ├── colors-mint.js
│ ├── colors-orange.js
│ ├── colors-peach.js
│ ├── colors-red.js
│ ├── colors-semantic.js
│ ├── colors-text.js
│ └── colors-white.js
├── spacing.js
├── transitions
│ ├── transition-durations.js
│ └── transition-easings.js
├── typography
│ ├── font-base.js
│ ├── font-size.js
│ ├── font-stack.js
│ ├── font-weight.js
│ ├── letter-spacing.js
│ └── line-height.js
└── typography.js
创建建筑
yarn build
运行构建脚本将包含 dist 包含单独构建的JSON,CSS,SCSS和JS文件并带有TS打字功能的目录.
这个脚本充斥着所有符号的Dist文件夹,如JSON,CSS,SCSS和JS. 对于CSS和SCSS架构,为了方便导入,包含一个索引文件.