Vue 材料设计图标

一个叉子 vue-material-design-icons 用于维护为 ApospropheCMS 用户命名的一致图标.

安装

要安装模块, 请使用命令行在 Aposrope 项目的根目录中运行此命令 :

npm install @apostrophecms/vue-material-design-icons

查看如何在您的库中注册和使用图标 这里的 Aposrape 项目。 。 。 .

它们也可以直接用于您 vue 组件 :

import CheckIcon from '@apostrophecms/vue-material-design-icons/Check.vue';

components: {
  CheckIcon;
}

那就用你的模板代码!

<CheckIcon />

可选 添加包含的样式表 。 这几行CSS会导致 以任何周围文本缩放的图标,当您看到时会有所帮助 以 CSS 为主风格 。 请注意,如果您打算使用 size 道克,你可能不想用这个,因为它可能冲突.

import '@apostrophecms/vue-material-design-icons/styles.css';

道具

• title - 这改变了悬浮工具提示以及显示的屏幕标题 读者。 为无障碍目的,如果 title 未提供,然后 图标从屏幕阅读器中隐藏。 这是强迫开发者使用 用于图标使用的有意义的标题.

  示例

  <CheckIcon title="this is an icon!" />
  

• fillColor - 此属性允许您通过 联合来文没有要求修改中央支助系统。 注意任何CSS值,例如: fill: currentColor; 由可选 CSS 文件提供,可覆盖颜色 用这个道具设置.

  示例

  <CheckIcon fillColor="#FF0000" />
  

• size - 这个地产取代了 width 财务报告和审定财务报表 height 属性 SVG. (原始内容存档于2018-10-12). 默认是 24。 。 。 .

  示例

  <CheckIcon :size="48" />
  

贷项

罗布·克雷斯韦尔/克雷斯韦尔 页:1 页:1 Vue 材料设计图标 项目。 这间图书馆已经被加固了.