fix styling

resources/js/Components/DashboardLayout/Sidebar/Link.vue

@@ -5,6 +5,7 @@ import Icon from '@/Components/Icon.vue'
 
 const { menu } = defineProps({
   menu: Object,
+  padding: Number,
 })
 
 const active = route().current(menu.route_or_url)
@@ -12,7 +13,7 @@ const link = route().has(menu.route_or_url) ? route(menu.route_or_url) : menu.ro
 </script>
 
 <template>
-  <Link :href="link" class="w-full px-4 py-3" :class="`${themes().get('sidebar', 'bg-slate-700 text-gray-200')} ${active && 'bg-slate-800'}`">
+  <Link :href="link" class="w-full px-4 py-3" :class="`${themes().get('sidebar', 'bg-slate-700 text-gray-200')} ${active && 'bg-slate-800'} pl-${padding}`">
     <div class="flex items-center space-x-2">
       <Icon :name="menu.icon" />
       <p class="uppercase font-semibold">{{ menu.name }}</p>