extends _layouts/base

include ./_modules/atoms/global/icon/icon
include ./_modules/atoms/forms/checkbox/checkbox
include ./_modules/atoms/link/link

block style
  style.
    .temporary {
      text-align: center;
      //- background: red;
    }
    .version {
      position: absolute;
      bottom: 0;
      right: 0;
      padding: 20px;
    }
    .my-component-icon {
      fill: orange;
    }
block content
  .temporary.container
    .yeogurt-info
      h1 Welcome to Yomas!
      p
        img.logo(src="images/yomas-logo.jpg", width="100px")
      p
        b Include SVG:
        //- Inline svg include
        !=icon('yomas')
      p
        b Include icon component SVG (via sprite):
        //- From sprite include
        +icon({ class: 'my-component-icon', icon: 'yomas' })
      p
        b Include checkbox component:
        //- Checkbox
        +checkbox({
          id: 'chk-1',
          name: 'yomas',
          text: 'Some text'
        })
      br
      p
        i Clean index.jade file to get started
      p.
        Take a look at the
        #[+link({text: 'documentation'})(href='https://github.com/larsonjj/generator-yeogurt#yeogurt-generator---')]
        and start mixing up something awesome.
  code.version v<%= pkg.version %>