Portal UI

Breadcrumb

Displays the path to the current resource using a hierarchy of links. 

<x-portal::breadcrumb>
    <x-portal::breadcrumb.item href="/">Home</x-portal::breadcrumb.item>
    <x-portal::breadcrumb.item href="/">Blog</x-portal::breadcrumb.item>
    <x-portal::breadcrumb.item>Post</x-portal::breadcrumb.item>
</x-portal::breadcrumb>

Publishing Component

If you want to customize the components, you can publish them by running the following command : 

php artisan vendor:publish --tag=portal-ui:breadcrumb --force


Custom Separator

Available separator type : default slash double double-slash 

<x-portal::breadcrumb>
    <x-portal::breadcrumb.item separator="slash" href="/">Home</x-portal::breadcrumb.item>
    <x-portal::breadcrumb.item separator="slash" href="/">Blog</x-portal::breadcrumb.item>
    <x-portal::breadcrumb.item separator="slash">Post</x-portal::breadcrumb.item>
</x-portal::breadcrumb>


Collapsed 

<x-portal::breadcrumb>
    <x-portal::breadcrumb.item href="/">Home</x-portal::breadcrumb.item>
    <x-portal::breadcrumb.item>
        <x-tabler-dots class="h-4.5" />
    </x-portal::breadcrumb.item>
    <x-portal::breadcrumb.item>Post</x-portal::breadcrumb.item>
</x-portal::breadcrumb>


With Icon 

<x-portal::breadcrumb>
    <x-portal::breadcrumb.item href="/">
        <x-tabler-home-f class="h-4.5" />
    </x-portal::breadcrumb.item>
    <x-portal::breadcrumb.item href="/">Home</x-portal::breadcrumb.item>
    <x-portal::breadcrumb.item href="/">Blog</x-portal::breadcrumb.item>
    <x-portal::breadcrumb.item>Post</x-portal::breadcrumb.item>
</x-portal::breadcrumb>