<template>
  <ul class="box">
    <li>
      <lyf-icon icon="graph"></lyf-icon>
      <lyf-icon icon="search1"></lyf-icon>
      <lyf-icon icon="search2"></lyf-icon>
      <lyf-icon icon="approve"></lyf-icon>
      <lyf-icon icon="warn"></lyf-icon>
      <lyf-icon icon="message"></lyf-icon>
    </li>
    <li>
      <lyf-icon icon="setting1" :size="30"></lyf-icon>
      <lyf-icon icon="setting2" :size="30"></lyf-icon>
      <lyf-icon icon="double-up" :size="30"></lyf-icon>
      <lyf-icon icon="double-down" :size="30"></lyf-icon>
      <lyf-icon icon="notice" :size="30"></lyf-icon>
      <lyf-icon icon="feishu" :size="30"></lyf-icon>
    </li>
    <li>
      <lyf-icon icon="workbench" color="blue" :size="30"></lyf-icon>
      <lyf-icon icon="workbench" color="red" :size="30"></lyf-icon>
      <lyf-icon icon="workbench" color="yellow" :size="30"></lyf-icon>
      <lyf-icon icon="workbench" color="pink" :size="30"></lyf-icon>
      <lyf-icon icon="workbench" color="gray" :size="30"></lyf-icon>
    </li>
  </ul>
</template>

<style scoped>
ul {
  background-color: black;
  color: #fff;
}
ul li {
  margin-bottom: 20px;
}
</style>