Svelte Breadcrumb
Indicate the current page’s location within a navigational hierarchy that automatically adds separators via CSS with Svelte breadcrumb.
Example
<BreadCrumb>
<BreadcrumbItem key="home" active={true}>
Home
</BreadcrumbItem>
</BreadCrumb>
<BreadCrumb>
<BreadcrumbItem key="home">
<a href="/">
Home
</a>
</BreadcrumbItem>
<BreadcrumbItem key="home" active={true}>
Library
</BreadcrumbItem>
</BreadCrumb>
<BreadCrumb>
<BreadcrumbItem key="home">
<a href="/">
Home
</a>
</BreadcrumbItem>
<BreadcrumbItem key="home">
<a href="/">
Library
</a>
</BreadcrumbItem>
<BreadcrumbItem key="home" active={true}>
Data
</BreadcrumbItem>
</BreadCrumb>
Dark
<BreadCrumb listClasses="breadcrumb-dark">
<BreadcrumbItem key="home" active={true}>
Home
</BreadcrumbItem>
</BreadCrumb>
<BreadCrumb listClasses="breadcrumb-dark bg-primary">
<BreadcrumbItem key="home">
<a href="/">
Home
</a>
</BreadcrumbItem>
<BreadcrumbItem key="home" active={true}>
Library
</BreadcrumbItem>
</BreadCrumb>
<BreadCrumb listClasses="breadcrumb-dark bg-danger">
<BreadcrumbItem key="home">
<a href="/">
Home
</a>
</BreadcrumbItem>
<BreadcrumbItem key="home">
<a href="/">
Library
</a>
</BreadcrumbItem>
<BreadcrumbItem key="home" active={true}>
Data
</BreadcrumbItem>
</BreadCrumb>
Links
<BreadCrumb listClasses="breadcrumb-links">
<BreadcrumbItem key="home">
<a href="/">
Home
</a>
</BreadcrumbItem>
<BreadcrumbItem key="home">
<a href="/">
Library
</a>
</BreadcrumbItem>
<BreadcrumbItem key="home" active={true}>
Data
</BreadcrumbItem>
</BreadCrumb>