沙姆米德资产 - 
这个软件包提供了许多Psammead组件或用户可能要求的常见资产的集合,例如SVG或小脚本.
出口
/amp-boilerplate - 帮助者,允许使用Psammead的项目方便地取出一个版本的拷贝 AMP所需的锅炉板脚本。 。 。 .
/svgs - Psammead项目通常需要的SVG图标.
安装
npm install @bbc/psammead-assets --save
使用量
import { BBC_BLOCKS, news } from '@bbc/psammead-assets/svgs';
import { AMP_SCRIPT } from '@bbc/psammead-assets/amp-boilerplate';
服务 SVG
服务品牌SVG,比如 news,是包含 svg 组,取景箱,比例和高;
该套装目前为BBC新闻世界服务公司以及BBC新闻公司,BBC苏格兰分公司设有品牌SVG.
| 财产 | 类型 | 需求 | 默认 | 示例 |
|---|---|---|---|---|
group | 节点 | 对 | 不详 | <g fillrule="evenodd"><path d="M84.32" /></g> |
viewbox | 对象 | 对 | 不详 | { height: 24, width: 167.95 } |
ratio | 编号 | 对 | 不详 | 6.9979 |
您的 SVG 的宽度可以用您想要的高度乘以 ratio 数值.
使用量
const WrappingContainer = () => (
<svg viewBox={`0 0 ${news.viewbox.width} ${news.viewbox.height}`}>{news.group}</svg>
);
核心图标 SVGs
核心图标是包含GEL Iconography Core所出风格的SVG图标的一个对象. 默认情况下, Core 图标的大小与文本一起良好 GEL BodyCopy 排字组.
使用量
import { coreIcons } from '@bbc/psammead-assets/svgs';
<p>{coreIcons.info} Did you know, in Switzerland it's illegal to own just one guinea pig?</p>
媒体图标 SVGs
媒体图标是包含有风格的SVG图标的一个对象,用于视频,音频,相片采集和引导. 媒体图标的大小与打印组的特定文本并行良好 GEL Minion。它们被用于 psammead-media-indicator 财务报告和审定财务报表 psammead-media-player 组件.
使用量
import { mediaIcons } from '@bbc/psammead-assets/svgs';
<span>
{mediaIcons.audio}
{duration && datetime && (<time dateTime={datetime}>{duration}</time>)}
</span>
导航图标 SVGs
导航图标是一个包含有样式的SVG图标用于汉堡和十字架的对象. 它们被用于 psammead-navigation 组件.
使用量
import { navigationIcons } from '@bbc/psammead-assets/svgs';
<span>
{navigationIcons.cross}
</span>
捐款
何时 添加 向此工具包新导出 出口测试 还需要更新。 何时 删除 从此工具包中导出 出口测试 软件包版本需要更新,需要作重大修改(EG:1.2.1 - > 2.0.0),因为这将被视为由于功能被去除而导致的突破性修改.
Psammead完全开源. 我们感谢任何贡献,无论是新的组件、错误修正还是总体改进。 请参看我们的主要贡献指南,可查阅: psammead 仓库的根。 。 。 .
行为守则
我们欢迎对这项工作的反馈和帮助。 通过参与这个项目,你同意遵守 行为守则请稍候再读一下.
许可证
萨姆米德 Apache 2.0 许可。 。 。 .