feat: use woot-icons

This commit is contained in:
Shivam Mishra
2024-12-11 16:01:49 +05:30
parent ea87274d61
commit 233cc8b868
2 changed files with 18 additions and 35 deletions
@@ -21,10 +21,7 @@ const files = [
</script>
<template>
<Story
title="Components/Icons/FileIcon"
:layout="{ type: 'grid', width: '800' }"
>
<Story title="Components/Icons/FileIcon">
<div class="grid grid-cols-4 gap-5">
<div
v-for="file in files"
@@ -11,42 +11,28 @@ const { fileType } = defineProps({
const fileTypeIcon = computed(() => {
const fileIconMap = {
'7z': 'i-teenyicons-zip-solid',
csv: 'i-teenyicons-csv-solid',
doc: 'i-teenyicons-doc-solid',
docx: 'i-teenyicons-doc-solid',
json: 'i-teenyicons-text-document-solid',
odt: 'i-teenyicons-doc-solid',
pdf: 'i-teenyicons-pdf-solid',
ppt: 'i-teenyicons-ppt-solid',
pptx: 'i-teenyicons-ppt-solid',
rar: 'i-teenyicons-zip-solid',
rtf: 'i-teenyicons-doc-solid',
tar: 'i-teenyicons-zip-solid',
txt: 'i-teenyicons-text-document-solid',
xls: 'i-teenyicons-xls-solid',
xlsx: 'i-teenyicons-xls-solid',
zip: 'i-teenyicons-zip-solid',
'7z': 'i-woot-file-zip',
csv: 'i-woot-file-csv',
doc: 'i-woot-file-doc',
docx: 'i-woot-file-doc',
json: 'i-woot-file-txt',
odt: 'i-woot-file-doc',
pdf: 'i-woot-file-pdf',
ppt: 'i-woot-file-ppt',
pptx: 'i-woot-file-ppt',
rar: 'i-woot-file-zip',
rtf: 'i-woot-file-doc',
tar: 'i-woot-file-zip',
txt: 'i-woot-file-txt',
xls: 'i-woot-file-xls',
xlsx: 'i-woot-file-xls',
zip: 'i-woot-file-zip',
};
return fileIconMap[fileType] || 'i-teenyicons-text-document-solid';
});
const iconColor = computed(() => {
const colorMap = {
'i-teenyicons-csv-solid': '#217346',
'i-teenyicons-doc-solid': '#2B579A',
'i-teenyicons-pdf-solid': '#FF0000',
'i-teenyicons-ppt-solid': '#D24726',
'i-teenyicons-text-document-solid': '#41A5EE',
'i-teenyicons-xls-solid': '#217346',
'i-teenyicons-zip-solid': '#FDB813',
};
return colorMap[fileTypeIcon.value];
});
</script>
<template>
<Icon :icon="fileTypeIcon" :style="{ color: iconColor }" />
<Icon :icon="fileTypeIcon" />
</template>