div.panel.panel--default
  div.panel__head
    h2.panel__title Input sizing
  div.panel__body
    ul.list-unstyled
      li: input(type="text" class="input--xsmall")
      li: input(type="text" class="input--small")
      li: input(type="text")
      li: input(type="text" class="input--large")
        
div.panel.panel--default
  div.panel__head
    h2.panel__title Input types
  div.panel__body
    ul.list-unstyled
      li: input(type="text" placeholder="type: text")
      li: input(type="password" placeholder="type: password")
      li: input(type="number" placeholder="type: number")
      li: input(type="email" placeholder="type: email")
      li: input(type="url" placeholder="type: url")
      li: input(type="date" placeholder="type: date")  
      li: input(type="time" placeholder="type: time")
      li: input(type="search" placeholder="type: search")
        
div.panel.panel--default
  div.panel__head
    h2.panel__title Coloring
  div.panel__body
    ul.list-unstyled
      li: input(type="text" placeholder="Success" class="input--success")
      li: input(type="text" placeholder="Danger" class="input--danger")
      li: input(type="text" placeholder="Warning" class="input--warning")
      li: input(type="text" placeholder="Info" class="input--info")

div.panel.panel--default
  div.panel__head
    h2.panel__title Input sizing
  div.panel__body
    ul.list-unstyled
      li: input(type="text" class="input--xsmall")
      li: input(type="text" class="input--small")
      li: input(type="text")
      li: input(type="text" class="input--large")
        
div.panel.panel--default
  div.panel__head
    h2.panel__title Input types
  div.panel__body
    ul.list-unstyled
      li: input(type="text" placeholder="type: text")
      li: input(type="password" placeholder="type: password")
      li: input(type="number" placeholder="type: number")
      li: input(type="email" placeholder="type: email")
      li: input(type="tel" placeholder="type: tel")
      li: input(type="url" placeholder="type: url")
      li: input(type="date" placeholder="type: date")  
      li: input(type="time" placeholder="type: time")
      li: input(type="search" placeholder="type: search")
        
div.panel.panel--default
  div.panel__head
    h2.panel__title Coloring
  div.panel__body
    ul.list-unstyled
      li: input(type="text" placeholder="Success" class="input--success")
      li: input(type="text" placeholder="Danger" class="input--danger")
      li: input(type="text" placeholder="Warning" class="input--warning")
      li: input(type="text" placeholder="Info" class="input--info")

Add input tel element in test page
Add input tel element in test page
