mixin centered(title)
  div.centered(id=attributes.id)
    - if (title)
      h1(class=attributes.class)= title
    block
    - if (attributes.href)
      .footer
        a(href=attributes.href) Back

mixin main(title)
  div.stretch
    +centered(title).highlight&attributes(attributes)
      block

mixin bottom
  div.bottom&attributes(attributes)
    block

body
  +centered#First Hello World
  +centered('Section 1')#Second
    p Some important content.
  +centered('Section 2')#Third.foo(href='menu.html', class='bar')
    p Even more important content.
  +main('Section 3')(href='#')
    p Last content.
  +bottom.foo(class='bar', name='end', id='Last', data-attr='baz')
    p Some final words.
  +bottom(class=['class1', 'class2'])

mixin foo
  div.thing(attr1='foo', attr2='bar')&attributes(attributes)

- var val = '<biz>'
- var classes = ['foo', 'bar']
+foo(attr3='baz' data-foo=val data-bar!=val class=classes).thunk

//- Regression test for #1424
mixin work_filmstrip_item(work)
  div&attributes(attributes)= work
+work_filmstrip_item('work')("data-profile"='profile', "data-creator-name"='name')

mixin my-mixin(arg1, arg2, arg3, arg4)
  p= arg1
  p= arg2
  p= arg3
  p= arg4

+foo(
  attr3="qux"
  class="baz"
)

+my-mixin(
'1',
      '2',
  '3',
      '4'
)
