银河
@galaxy-ds/tokens包提供cs, scs, js, ios和和和roid sords, 以统一所有平台和主题的样式.
当前使用
- @galaxy-ds/tokens将在图形用户界面(Bootstrap)内使用,为桌面/web/移动主题覆盖提供cs变量
图片
Galaxy使用Figma将设计和代码组合在一起,将Figma Styles转换为可用Tokens,用于任何平台的任何项目中.
图像设计系统
- GDS LEAP 软件 : 颜色、间距、类型
图像插件
使用
使用 npm 添加到工程中 :
# Using npm:
npm install --save @galaxy-ds/tokens
# OR Yarn:
yarn add @galaxy-ds/tokens
支助科
要使用 Css 变量,请像这样导入到您的代码中:
/* Inside css */
@import "@galaxy-ds/tokens/<theme>/<platform>/tokens.css";
联合来文
使用套件子路径导出 - <theme>/<platform> (目前为 leap/web, (中文(简体) ),
leap/desktop, (中文(简体) ), lawconnect/web, (中文(简体) ), lawconnect/desktop) (中文(简体) ). {\fn黑体\fs22\bord1\shad0\3aHBE\4aH00\fscx67\fscy66\2cHFFFFFF\3cH808080}邦德勒斯来
树能震动的 ES 模块,节点/快取 普通JS 构建,并裸出
@galaxy-ds/tokens lEAP 网络集的条目默认 :
import * as tokens from "@galaxy-ds/tokens/leap/web";
// or pull only what you need (tree-shakeable):
import { ColorPrimaryMain } from "@galaxy-ds/tokens/leap/web";
惟所治之子道为公所通. 内部 dist/... 版式为无
如此深厚的进口品 @galaxy-ds/tokens/dist/leap/web/tokens.js
不再根据现代(出口意识)解决 - 从
<theme>/<platform> 代之以子路径.
常设委员会
要使用 scs 变量,请将它们导入您的 scs 文件 :
@use '@galaxy-ds/tokens/<theme>/<platform>/tokens.scss';
产出
你应该看到类似这样的输出:
Copying starter files...
desktop
✔︎ build/[BRAND]/desktop/tokens.css
✔︎ build/[BRAND]/desktop/tokens.scss
✔︎ build/[BRAND]/desktop/tokens.js
web
✔︎ build/[BRAND]/web/tokens.css
✔︎ build/[BRAND]/web/tokens.scss
✔︎ build/[BRAND]/web/tokens.js
android
✔︎ build/[BRAND]/android/tokens.colors.xml
✔︎ build/[BRAND]/android/tokens.dimens.xml
✔︎ build/[BRAND]/android/tokens.font_dimens.xml
ios
✔︎ build/[BRAND]/ios/tokens.h
移动到 3. 0
3.0 重组了 LEAP 令牌集 . 月台曾经被烤入
符号 名称;现在它生活在输出中 路径 并已经从
名称。 3.0 也重新估值 lEAP 网络打字法 — 这些不纯
更名( 如 . Open Sans → Segoe UI Variable,无单位行高如
1.25 + 像素值类 40px,并改变多个尺寸:
| 在(≤ 1.x)之前 | 在( 3. 0) 之后 |
|---|---|
FontWebH1FontWeight | FontH1FontWeight |
FontWebBody1FontSize | FontBody1FontSize |
RadiusWebSm | RadiusSm |
RadiusWebMd | RadiusMd |
FontIosSystem 编号 : FontAndroidSystem | FontPlatformSystem |
规则是机械的: 放下平台部分(Web 编号 : Desktop这
后续 Font编号 :Radius。 。 。 .
与 DEPRECATED_ (没有沉默的惊喜)
旧名是 不见了,所以用法在升级后不会编译——即 深思熟虑。 我们不运送沉默的别名, 因为价值改变了: 一个别名 保留了旧名称,但返回了新值会改变您的UI,而无需 任何警告都会发生.
相反,LEAP 网络 财务报告和审定财务报表 桌面 设置再导出每个已删除的名称
a 项下 DEPRECATED_ 前缀, 被冻结至1.x值所以你得到一个干净的,
双步迁移:
- 保持老样子 ——查找并替换旧名以添加前缀
(单位:千美元)
FontWebH1FontSize→DEPRECATED_FontWebH1FontSize) (中文(简体) ). 一个机械传球, 建筑走向绿色,产出是 类似像素 改为 1.x. - 通过 3.0 外观 以自己的速度 互相交换
DEPRECATED_*联合国 替换(DEPRECATED_FontWebH1FontSize→FontH1FontSize) (中文(简体) ).grep DEPRECATED_告诉你剩下的是什么.
每个 DEPRECATED_* 常数载出 @deprecated JSDoc指出
替换,它们都是 在4.0中删除. 详尽无遗的旧名
已冻结值 = 替换地图存在
deprecated-tokens.json 也是真理的来源
为建筑.
其他变动
lawconnect品牌再次被构建 (单位:千美元)dist/lawconnect/**) (中文(简体) ). 任何丢弃@galaxy-ds/[email protected]别名是你用来维持生命的.- 类型脚本申报船 和所有JS/CJS捆绑在一起 所以象征是
键入而不是
any。 。 。 . - 裸体
@galaxy-ds/tokens导入分辨率 通过根到 LEAP 网络集 枪管(main编号 :types页:1. Contextual.Background.{Light,Dark}恢复 用于 LEAP — 目前 映射占位符值Contextual.Info,等待设计注册.