import { IFeature } from 'dumi-theme-antd-style';

export const antdStyleItems: IFeature[] = [
  {
    title: 'style-component 与 Emotion 双样式引擎',
    image:
      'https://mdn.alipayobjects.com/huamei_rqvucu/afts/img/A*MvKkQqXEyfQAAAAAAAAAAAAADoN6AQ/original',
    description:
      'Ant Design Style 采用 styled-component 和 emotion 双样式引擎，兼具丰富的写法能力与性能表现',
    link: '/guide/strategy',
    imageType: 'light',
    row: 8,
  },
  {
    title: '暗色模式一键切换',
    link: '/guide/switch-theme',
    description:
      '我们基于 antd v5 cssinjs 动态主题配置与暗色主题算法封装了，为应用级场景提供易用的亮暗色主题切换能力，使用方式更加简单。',
    image:
      'https://mdn.alipayobjects.com/huamei_rqvucu/afts/img/A*8KE7T7l39J0AAAAAAAAAAAAADoN6AQ/original',
    imageType: 'primary',
  },
  {
    title: '主题灵活扩展',
    description:
      'Ant Design Style 提供自定义 token 与 自定义 stylish 的功能，当 antd 默认的 token 不能满足样式诉求时，可以灵活扩展出自己的主题体系，并在 CSS in JS 中自由消费。',
    link: '/guide/custom-theme',
    image:
      'https://mdn.alipayobjects.com/huamei_rqvucu/afts/img/A*6sjjRa7lLhAAAAAAAAAAAAAADoN6AQ/original',
    imageType: 'primary',
    row: 8,
  },
  {
    title: 'Ant Design Token System',
    link: '/guide/switch-theme',
    description: '默认集成 Ant Design V5 的 Token System，主题定制轻而易举，token 消费灵活易用',
    image:
      'https://gw.alipayobjects.com/zos/hitu-asset/c88e3678-6900-4289-8538-31367c2d30f2/hitu-1609235995955-image.png',
    imageType: 'light',
    row: 7,
    hero: true,
  },
  {
    title: '复合样式 —— Stylish',
    description:
      'Ant Design Style 提供了复合样式的能力，我们称它为 Stylish。Stylish 可以通过组合多个原子 token 来组织形成复杂的交互样式，实现极高的复用度。<quotient> 感觉很熟悉？没错，它和 tailwindcss 的思想高度一致，但 stylish 将会具有更加明确的设计语义，维护也会更加轻松。</quotient>',
    link: '/guide/stylish',
    image:
      'https://mdn.alipayobjects.com/huamei_rqvucu/afts/img/A*_in2RLf5pY8AAAAAAAAAAAAADoN6AQ/original',
    imageType: 'primary',
    row: 9,
  },
  {
    title: 'less 平滑迁移',
    description:
      '旧项目需要迁移？使用 antd-style 可以将项目中的 less 较低成本地迁移到 CSS in JS，并获得更好的用户体验与开发体验。',
    link: '/guide/migrate-from-less',
    image:
      'https://mdn.alipayobjects.com/huamei_rqvucu/afts/img/A*5H2ySLO-X4cAAAAAAAAAAAAADoN6AQ/original',
    imageType: 'primary',
  },
  {
    title: '微应用良好兼容',
    description:
      'Ant Design Style 默认兼容 qiankun 微应用（但会牺牲一点性能）。同时并为不需要微应用的使用场景提供性能优化选项。',
    image:
      'https://mdn.alipayobjects.com/huamei_rqvucu/afts/img/A*tZNeQIUYx_4AAAAAAAAAAAAADoN6AQ/original',
    imageType: 'primary',
    row: 6,
  },
  {
    title: '应用案例',
    description:
      '展示使用 Ant Design Style 的组件、应用的各种案例，帮助开发者快速上手。<quotient> 本文档同样使用 Ant Design Style 构建样式，可以作为静态站点类的参考。</quotient>',
    link: '/case',
    image:
      'https://mdn.alipayobjects.com/huamei_rqvucu/afts/img/A*5H2ySLO-X4cAAAAAAAAAAAAADoN6AQ/original',
    imageType: 'soon',
    row: 8,
  },
  {
    title: '响应式轻松适配',
    description:
      'Ant Design Style 将为响应式应用提供便捷的工具函数，帮助开发者快速完成响应式主题开发。',
    image:
      'https://mdn.alipayobjects.com/huamei_rqvucu/afts/img/A*5H2ySLO-X4cAAAAAAAAAAAAADoN6AQ/original',
    row: 6,
  },
];