JavaScript snabbdom-material Col示例

示例#1

文件： modal.js 项目： SparksNetwork/sparks-cyclejs

const titleRow = (iconName, title) =>
  div({style: titleStyle}, [
    Col(
      {type: 'xs-1', style: {width: '48px', 'font-size': '32px'}},
      [icon(iconName)]
    ),
    Col({type: 'xs-8'},[title]),
  ])

示例#2

文件： listHeader.js 项目： SparksNetwork/sparks-cyclejs

export default ({title, className, iconName, clickable}) =>
  h('div.row.' + className, {style: style(clickable)}, [
    Col({type: 'xs-10'},[title]),
    iconName ?
      Col(
        {type: 'xs-1', style: {width: '48px', 'font-size': '32px'}},
        [icon(iconName, 'white')]
      ) : null,
  ])

示例#3

文件： landing.js 项目： SparksNetwork/sparks-cyclejs

  //   Col({type: 'xs-12'}, [
  //     buttons,
  //     // Button({onClick, primary: true, className: 'google'}, [
  //     //   'Sign Up using Google',
  //     // ]),
  //   ]),
  // ])

const footer =
  div('#footer', {static: true}, [
    div('.links.container', {style: {textAlign: 'center'}}, [
      Row({style: {width: '100%'}},[
        Col({type: 'xs-4'},[
          h5({}, 'Contact'),
          ul({}, [
            li({}, [basicLink('Help', 'mailto:help@sparks.network')]),
            li({}, [basicLink('Other', 'mailto:sdebaun@sparks.network')]),
          ]),
        ]),
        Col({type: 'xs-4'},[
          h5({}, 'About'),
          ul({}, [
            li({}, [basicLink(
              'Pricing',
              'http://blog.sparks.network/p/pricing.html'
            )]),
            li({}, [basicLink(
              'Terms of Service',
              'http://blog.sparks.network/p/terms-of-service.html'
            )]),
            li({}, [basicLink(