63 lines
2.7 KiB
Vue
63 lines
2.7 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from 'vue';
|
|
import { MoodSmileIcon, CircleXIcon } from 'vue-tabler-icons';
|
|
</script>
|
|
<template>
|
|
<div class="d-flex flex-wrap align-center gap-3">
|
|
<v-chip class="text-body-2">
|
|
<MoodSmileIcon class="mr-2" start size="20" /> Default Filled
|
|
</v-chip>
|
|
<v-chip class="text-body-2">
|
|
<MoodSmileIcon class="mr-2" start size="20" /> Default Deletable
|
|
<CircleXIcon class="ml-2" start size="20" />
|
|
</v-chip>
|
|
<v-chip color="primary" class="text-body-2">
|
|
<v-avatar start size="25">
|
|
<img src="@/assets/images/profile/user-6.jpg" width="25" />
|
|
</v-avatar> Primary Filled
|
|
</v-chip>
|
|
<v-chip color="primary" class="text-body-2">
|
|
<v-avatar start size="25">
|
|
<img src="@/assets/images/profile/user-6.jpg" width="25" />
|
|
</v-avatar> Primary Deletable
|
|
<CircleXIcon class="ml-2" start size="20" />
|
|
</v-chip>
|
|
<v-chip color="secondary" class="text-body-2">
|
|
<MoodSmileIcon class="mr-2" start size="20" /> Secondary Filled
|
|
</v-chip>
|
|
<v-chip color="secondary" class="text-body-2">
|
|
<MoodSmileIcon class="mr-2" start size="20" /> Secondary Deletable
|
|
<CircleXIcon class="ml-2" start size="20" />
|
|
</v-chip>
|
|
<v-chip color="success" class="text-body-2">
|
|
<v-avatar start size="25">
|
|
<img src="@/assets/images/profile/user-2.jpg" width="25" />
|
|
</v-avatar> Default Filled
|
|
</v-chip>
|
|
<v-chip color="success" class="text-body-2">
|
|
<v-avatar start size="25">
|
|
<img src="@/assets/images/profile/user-2.jpg" width="25" />
|
|
</v-avatar> Default Deletable
|
|
<CircleXIcon class="ml-2" start size="20" />
|
|
</v-chip>
|
|
<v-chip color="warning" class="text-body-2">
|
|
<MoodSmileIcon class="mr-2" start size="20" /> Default Filled
|
|
</v-chip>
|
|
<v-chip color="warning" class="text-body-2">
|
|
<MoodSmileIcon class="mr-2" start size="20" /> Default Deletable
|
|
<CircleXIcon class="ml-2" start size="20" />
|
|
</v-chip>
|
|
<v-chip color="error" class="text-body-2">
|
|
<v-avatar start size="25">
|
|
<img src="@/assets/images/profile/user-5.jpg" width="25" />
|
|
</v-avatar> Default Filled
|
|
</v-chip>
|
|
<v-chip color="error" class="text-body-2">
|
|
<v-avatar start size="25">
|
|
<img src="@/assets/images/profile/user-5.jpg" width="25" />
|
|
</v-avatar> Default Deletable
|
|
<CircleXIcon class="ml-2" start size="20" />
|
|
</v-chip>
|
|
</div>
|
|
</template>
|