include ./helpers
-
  var icons = [
    "accept",
    "add",
    "add-calendar",
    "add-image",
    "add-person",
    "add-text",
    "add-time",
    "add-video",
    "android",
    "apple",
    "arrow-down",
    "arrow-left",
    "arrow-right",
    "arrow-up",
    "be",
    "bell",
    "briefcase",
    "calendar",
    "calendar-confirm",
    "calendar-search",
    "camera-photo",
    "camera-video",
    "cards",
    "chat",
    "chat-logo",
    "chat-multiple",
    "check",
    "clock",
    "close",
    "comment",
    "contacts",
    "contract",
    "edit",
    "envelope",
    "expand",
    "download",
    "facebook",
    "faq",
    "file",
    "filter",
    "folder",
    "gear",
    "google",
    "heart",
    "heart-solid",
    "image",
    "info",
    "instagram",
    "leave",
    "legal",
    "letter",
    "linkedin",
    "list",
    "location",
    "lock",
    "lock-unlocked",
    "magnifying-glass",
    "microphone",
    "more",
    "paper-plane",
    "paperclip",
    "pause",
    "pause-circle",
    "pencil",
    "people",
    "play",
    "play-circle",
    "popup",
    "profile",
    "reposition",
    "room",
    "share",
    "sound",
    "sound-mute",
    "sound-none",
    "sound-quiet",
    "star",
    "table-logo",
    "timer",
    "trash",
    "twitter",
    "video",
    "vimeo",
    "web",
    "x"
  ];

mixin icon(type)
  div(class='icon-' + type style="display: flex; flex-direction: column; align-items: center; margin: 15px;")

h1.example__header Icons

.row
  .column--quarter
    span.header--small Icons
    p.content--small.
      These are the icons from our custom font. We also use material design icons.
  .column--three-quarter
    label.label Code Example
    +codeExample("html").
      <div class="row" style="flex-wrap: wrap; justify-content:space-between;">
        <div class="icon-add" style="display: flex; flex-direction: column; align-items: center; margin: 15px;"/>
        ...
      </div>

    label.label Result
    .row(style="flex-wrap: wrap;")
      each val in icons
        +icon(val)