简单 UI 键

设计符号 页:1 简单UIEasyPost的设计系统.

简单UI 托肯使用 样式词典 作为其组织模式和建立工具。 它将 JSON 配置值转换为平台特定变量.

使用量

Java 脚本

import tokens from "@easypost/easy-ui-tokens/js/tokens.js";

console.log(tokens["color-blue-100"]);

支助科

import '@easypost/easy-ui-tokens/css/variables.css';

div {
  background: var(--ezui-color-blue-100);
}

CSS 变量的前缀为 --ezui 以表示这些变量是 Easy UI 变量.

常设委员会

@import "@easypost/easy-ui-tokens/scss/variables.scss";

div {
  background: $ezui-color-blue-100;
}

// Map:
@import "@easypost/easy-ui-tokens/scss/map.scss";

div {
  background: map-get($ezui-tokens, "color-blue-100");
}

SCSS 变量的前缀为 $ezui 以表示这些变量是 Easy UI 变量.

贾森

const tokens = require("@easypost/easy-ui-tokens/json/tokens.json");

console.log(tokens["color-blue-100"]);

发展

图标