Initial commit: fabric-trade-admin panel with responsive layouts and UI refinements.
Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Cursor
@@ -0,0 +1,194 @@
|
||||
<script setup lang="ts">
|
||||
defineProps<{
|
||||
name: string
|
||||
size?: number
|
||||
}>()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<svg
|
||||
:width="size ?? 20"
|
||||
:height="size ?? 20"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.75"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<!-- home -->
|
||||
<template v-if="name === 'home'">
|
||||
<path d="M3 10.5 12 3l9 7.5V21a1 1 0 0 1-1 1h-5v-7H9v7H4a1 1 0 0 1-1-1z" />
|
||||
</template>
|
||||
<!-- orders -->
|
||||
<template v-else-if="name === 'orders'">
|
||||
<rect x="5" y="3" width="14" height="18" rx="2" />
|
||||
<path d="M9 8h6M9 12h6M9 16h4" />
|
||||
</template>
|
||||
<!-- customers -->
|
||||
<template v-else-if="name === 'customers'">
|
||||
<circle cx="9" cy="8" r="3" />
|
||||
<circle cx="17" cy="9" r="2.5" />
|
||||
<path d="M3 20c0-3 2.7-5 6-5s6 2 6 5M14 20c0-2 1.5-3.5 3.5-3.5" />
|
||||
</template>
|
||||
<!-- products -->
|
||||
<template v-else-if="name === 'products'">
|
||||
<path d="M12 2 22 7v10l-10 5L2 17V7z" />
|
||||
<path d="M12 22V12M2 7l10 5 10-5" />
|
||||
</template>
|
||||
<!-- catalogs -->
|
||||
<template v-else-if="name === 'catalogs'">
|
||||
<circle cx="12" cy="12" r="9" />
|
||||
<path d="M12 3a15 15 0 0 1 0 18M12 3a15 15 0 0 0 0 18" />
|
||||
</template>
|
||||
<!-- companies -->
|
||||
<template v-else-if="name === 'companies'">
|
||||
<rect x="4" y="4" width="7" height="16" rx="1" />
|
||||
<rect x="13" y="8" width="7" height="12" rx="1" />
|
||||
<path d="M7 8h1M7 12h1M7 16h1M16 12h1M16 16h1" />
|
||||
</template>
|
||||
<!-- checks -->
|
||||
<template v-else-if="name === 'checks'">
|
||||
<rect x="3" y="6" width="18" height="12" rx="2" />
|
||||
<path d="M3 10h18M7 14h4" />
|
||||
</template>
|
||||
<!-- cash -->
|
||||
<template v-else-if="name === 'cash'">
|
||||
<rect x="2" y="6" width="20" height="12" rx="2" />
|
||||
<circle cx="12" cy="12" r="3" />
|
||||
</template>
|
||||
<!-- shipping -->
|
||||
<template v-else-if="name === 'shipping'">
|
||||
<path d="M3 6h11v8H3zM14 10h4l3 4v2h-7z" />
|
||||
<circle cx="7" cy="18" r="2" />
|
||||
<circle cx="18" cy="18" r="2" />
|
||||
</template>
|
||||
<!-- reports -->
|
||||
<template v-else-if="name === 'reports'">
|
||||
<path d="M4 20V10M10 20V4M16 20v-8M22 20H2" />
|
||||
</template>
|
||||
<!-- settings -->
|
||||
<template v-else-if="name === 'settings'">
|
||||
<circle cx="12" cy="12" r="3" />
|
||||
<path
|
||||
d="M12 2v2M12 20v2M4.2 4.2l1.4 1.4M18.4 18.4l1.4 1.4M2 12h2M20 12h2M4.2 19.8l1.4-1.4M18.4 5.6l1.4-1.4"
|
||||
/>
|
||||
</template>
|
||||
<!-- users -->
|
||||
<template v-else-if="name === 'users'">
|
||||
<circle cx="10" cy="9" r="3" />
|
||||
<path d="M3 20c0-3 2.2-5 7-5M16 11l2 2 4-4" />
|
||||
</template>
|
||||
<!-- logout -->
|
||||
<template v-else-if="name === 'logout'">
|
||||
<path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4M16 17l5-5-5-5M21 12H9" />
|
||||
</template>
|
||||
<!-- search -->
|
||||
<template v-else-if="name === 'search'">
|
||||
<circle cx="11" cy="11" r="7" />
|
||||
<path d="m20 20-3.5-3.5" />
|
||||
</template>
|
||||
<!-- bell -->
|
||||
<template v-else-if="name === 'bell'">
|
||||
<path d="M18 8a6 6 0 0 0-12 0c0 7-3 9-3 9h18s-3-2-3-9" />
|
||||
<path d="M13.73 21a2 2 0 0 1-3.46 0" />
|
||||
</template>
|
||||
<!-- message -->
|
||||
<template v-else-if="name === 'message'">
|
||||
<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
|
||||
<path d="M8 10h8M8 14h5" />
|
||||
</template>
|
||||
<!-- calendar -->
|
||||
<template v-else-if="name === 'calendar'">
|
||||
<rect x="3" y="5" width="18" height="16" rx="2" />
|
||||
<path d="M3 10h18M8 3v4M16 3v4" />
|
||||
</template>
|
||||
<!-- menu -->
|
||||
<template v-else-if="name === 'menu'">
|
||||
<path d="M4 6h16M4 12h16M4 18h16" />
|
||||
</template>
|
||||
<!-- filter -->
|
||||
<template v-else-if="name === 'filter'">
|
||||
<path d="M4 6h16M7 12h10M10 18h4" />
|
||||
</template>
|
||||
<!-- more -->
|
||||
<template v-else-if="name === 'more'">
|
||||
<circle cx="12" cy="6" r="1.5" fill="currentColor" stroke="none" />
|
||||
<circle cx="12" cy="12" r="1.5" fill="currentColor" stroke="none" />
|
||||
<circle cx="12" cy="18" r="1.5" fill="currentColor" stroke="none" />
|
||||
</template>
|
||||
<!-- chevron-left -->
|
||||
<template v-else-if="name === 'chevron-left'">
|
||||
<path d="m15 6-6 6 6 6" />
|
||||
</template>
|
||||
<!-- chevron-down -->
|
||||
<template v-else-if="name === 'chevron-down'">
|
||||
<path d="m6 9 6 6 6-6" />
|
||||
</template>
|
||||
<!-- print -->
|
||||
<template v-else-if="name === 'print'">
|
||||
<path d="M7 8V3h10v5M7 17H5a2 2 0 0 1-2-2v-5h18v5a2 2 0 0 1-2 2h-2M7 14h10v7H7z" />
|
||||
</template>
|
||||
<!-- sms -->
|
||||
<template v-else-if="name === 'sms'">
|
||||
<rect x="3" y="5" width="18" height="14" rx="2" />
|
||||
<path d="M7 9h10M7 13h6" />
|
||||
</template>
|
||||
<!-- check -->
|
||||
<template v-else-if="name === 'check'">
|
||||
<path d="M20 6 9 17l-5-5" />
|
||||
</template>
|
||||
<!-- cart -->
|
||||
<template v-else-if="name === 'cart'">
|
||||
<circle cx="9" cy="20" r="1" />
|
||||
<circle cx="18" cy="20" r="1" />
|
||||
<path d="M2 2h3l2.5 12H19l2-8H6" />
|
||||
</template>
|
||||
<!-- file -->
|
||||
<template v-else-if="name === 'file'">
|
||||
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" />
|
||||
<path d="M14 2v6h6" />
|
||||
</template>
|
||||
<!-- wallet -->
|
||||
<template v-else-if="name === 'wallet'">
|
||||
<rect x="2" y="6" width="20" height="14" rx="2" />
|
||||
<path d="M16 12h2" />
|
||||
</template>
|
||||
<!-- check-circle -->
|
||||
<template v-else-if="name === 'check-circle'">
|
||||
<circle cx="12" cy="12" r="9" />
|
||||
<path d="m8 12 3 3 5-5" />
|
||||
</template>
|
||||
<!-- phone -->
|
||||
<template v-else-if="name === 'phone'">
|
||||
<path
|
||||
d="M6.6 10.8a15 15 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25 11 11 0 0 0 3.5.55 1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A16 16 0 0 1 3 5a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1 11 11 0 0 0 .55 3.5 1 1 0 0 1-.25 1z"
|
||||
/>
|
||||
</template>
|
||||
<!-- id-card -->
|
||||
<template v-else-if="name === 'id-card'">
|
||||
<rect x="3" y="5" width="18" height="14" rx="2" />
|
||||
<circle cx="9" cy="12" r="2" />
|
||||
<path d="M14 10h5M14 14h5" />
|
||||
</template>
|
||||
<!-- user -->
|
||||
<template v-else-if="name === 'user'">
|
||||
<circle cx="12" cy="8" r="4" />
|
||||
<path d="M4 20c0-4 3.6-7 8-7s8 3 8 7" />
|
||||
</template>
|
||||
<!-- building -->
|
||||
<template v-else-if="name === 'building'">
|
||||
<rect x="5" y="3" width="14" height="18" rx="1" />
|
||||
<path d="M9 7h1M9 11h1M9 15h1M14 7h1M14 11h1M14 15h1" />
|
||||
</template>
|
||||
<!-- trash -->
|
||||
<template v-else-if="name === 'trash'">
|
||||
<path d="M4 7h16M10 11v6M14 11v6M6 7l1 13h10l1-13M9 7V4h6v3" />
|
||||
</template>
|
||||
<!-- default -->
|
||||
<template v-else>
|
||||
<circle cx="12" cy="12" r="9" />
|
||||
</template>
|
||||
</svg>
|
||||
</template>
|
||||
Reference in New Issue
Block a user