<template>
  <div class="element-mini">
    <el-icon style="line-height: 32px;font-size: 12px;margin: 0 4px 0 8px">
      <Eleme />
    </el-icon>
    <span>{{ option.name }}</span>
  </div>
</template>
<script lang="ts" setup>
defineOptions({
  name: 'element-mini'
});

const props = defineProps({
  option: Array
});
const { option } = toRefs(props);
</script>
<style scoped lang="less">
.element-mini {
  width: 120px;
  height: 32px;
  line-height: 32px;
  font-size: 12px;
  display: inline-block;
  vertical-align: top;
  background-color: #f2f2f2;
  border-radius: 5px;
  color: #000;
  margin: 2px;
  cursor: pointer;
  border: 1px dashed #0000;

  &:hover {
    //background-color: #00afff;
    border: 1px dashed #00afff;
    color: #00afff;
  }
}
</style>



