故事卡

npm 软件包 : @ecl/story-card

npm install --save @ecl/story-card

参数

• 颜色( m) (字符串)(默认为:")颜色模式的名称
• "变相" (弦) (默认:故事) 故事或证词
• 编号 (字符串)(默认:"随机") 要件编号
• "标题" (字符串)(默认:"")故事卡的标题
• "描述" (字符串)(默认:"")故事卡的描述
• “项目” (阵列) (默认: [])
  • “ teaser label” (字符串): 图像上显示的标签
  • "标题"(字符串): 细节面板中显示的标题
  • "描述"(字符串):描述
  • "图片"(对象)(默认:QQ) ECL 结构后的图像
  • "作者" (字符串):引文作者
  • "作用" (弦):作者的角色
  • "出处"(字符串): 引文来源
  • “ card link”(对象) ECL 链接类型的对象
• "sr prev" (英语) (字符串)(默认:"上一张牌"): 上一个按钮标签
• "下一个" (字符串)(默认:"下一张"): 下一个按钮标签
• "游戏" (字符串)(默认:"播放故事卡"): 播放按钮标签
• "暂停" (字符串)(默认:"暂停故事卡"): 暂停按钮标签
• "超级" (字符串)(默认为:") 额外类(空格分隔)
• “外部属性” (阵列) (默认: []) 额外属性
  • 名称 (字符串) 属性名称, 如“ 数据测试 ”
  • 值 (字符串) 属性值, 如 : “ data- test-1 ”

示例

{% include '@ecl/story-card/story-card.html.twig' with {
  id: 'story-card',
  items: [
    {

      picture: {
        img: {
          src: 'image-url.jpg',
          alt: 'Story description',
        },
      },
      title: 'Story Title',
      description: 'Story description text here',
      card_link: {
        label: 'Read more',
        path: '/path/to/story',
      },
    },
  ],
} only %}