38 lines
2 KiB
Vue
38 lines
2 KiB
Vue
|
<script setup lang="ts">
|
||
|
|
// Icônes trait (stroke) utilisées sur tout le site
|
||
|
|
const props = withDefaults(defineProps<{ name: string, size?: number, stroke?: number }>(), { size: 20, stroke: 2 })
|
||
|
|
const paths: Record<string, string> = {
|
||
|
|
cart: 'M6 6h15l-1.5 9h-12z M6 6 5 3H2 M9 20h.01 M18 20h.01',
|
||
|
|
phone: 'M5 4h4l2 5-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2',
|
||
|
|
arrow: 'M5 12h14 M13 6l6 6-6 6',
|
||
|
|
back: 'M15 6l-6 6 6 6',
|
||
|
|
plus: 'M12 5v14 M5 12h14',
|
||
|
|
close: 'M6 6l12 12 M18 6 6 18',
|
||
|
|
check: 'm5 12 5 5 9-10',
|
||
|
|
shield: 'M12 3 4 6v6c0 5 3.5 8 8 9 4.5-1 8-4 8-9V6z m-3.5 9 2.5 2.5 4.5-5',
|
||
|
|
flame: 'M12 22c4 0 7-3 7-7 0-5-4-7-5-12-2 2-3 4-3 6-1-1-2-2-2-4-2 2-4 5-4 10 0 4 3 7 7 7z',
|
||
|
|
bike: 'M6 17m-3 0a3 3 0 1 0 6 0a3 3 0 1 0-6 0 M18 17m-3 0a3 3 0 1 0 6 0a3 3 0 1 0-6 0 M6 17h3l3-7h4l2 7 M12 10 10 6H7',
|
||
|
|
pin: 'M12 22s7-6.5 7-12a7 7 0 0 0-14 0c0 5.5 7 12 7 12z M12 10m-2.5 0a2.5 2.5 0 1 0 5 0a2.5 2.5 0 1 0-5 0',
|
||
|
|
clock: 'M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0-18 0 M12 7v5l3 2',
|
||
|
|
lock: 'M5 11h14v10H5z M8 11V8a4 4 0 0 1 8 0v3',
|
||
|
|
kanban: 'M3 4h5v16H3z M10 4h5v11h-5z M17 4h4v7h-4z',
|
||
|
|
list: 'M4 6h16 M4 12h16 M4 18h10',
|
||
|
|
chart: 'M4 20V10 M10 20V4 M16 20v-7 M22 20H2',
|
||
|
|
gear: 'M12 12m-3 0a3 3 0 1 0 6 0a3 3 0 1 0-6 0 M12 2v3 M12 19v3 M2 12h3 M19 12h3 M5 5l2 2 M17 17l2 2 M5 19l2-2 M17 7l2-2',
|
||
|
|
print: 'M6 9V3h12v6 M6 18H4v-7h16v7h-2 M6 14h12v7H6z',
|
||
|
|
bell: 'M6 16V11a6 6 0 0 1 12 0v5l2 2H4z M10 21h4',
|
||
|
|
sound: 'M4 9v6h4l5 4V5L8 9z M16 9a4 4 0 0 1 0 6 M19 6a8 8 0 0 1 0 12',
|
||
|
|
edit: 'M4 20h4L19 9l-4-4L4 16z m10-14 4 4',
|
||
|
|
insta: 'M7 3h10a4 4 0 0 1 4 4v10a4 4 0 0 1-4 4H7a4 4 0 0 1-4-4V7a4 4 0 0 1 4-4z M12 12m-4 0a4 4 0 1 0 8 0a4 4 0 1 0-8 0',
|
||
|
|
tiktok: 'M14 3v11a4 4 0 1 1-4-4 M14 3c0 3 2 5 5 5',
|
||
|
|
ext: 'M14 4h6v6 M20 4l-9 9 M18 14v6H4V6h6'
|
||
|
|
}
|
||
|
|
const d = computed(() => paths[props.name] || '')
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<svg :width="size" :height="size" viewBox="0 0 24 24" fill="none" stroke="currentColor" :stroke-width="stroke" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
|
||
|
|
<path :d="d" />
|
||
|
|
</svg>
|
||
|
|
</template>
|