List group

Examples

<script>
  import { List } from "flowbite-svelte";

  let lists = [
    {
      name: "Home",
      href: "/",
    },
    {
      name: "Alerts",
      href: "/alert",
    },
    {
      name: "Cards",
      href: "/cards",
    },
    {
      name: "List Group",
      href: "/list-group/list",
    },
    {
      name: "Modals",
      href: "/modals",
    },
    {
      name: "Tabs",
      href: "/tabs",
    },
  ];
</script>

<script>
  import { List } from "flowbite-svelte";
  import {
    AdjustmentsOutline,
    UserCircleOutline,
    InboxInOutline,
    CloudDownloadOutline,
  } from "svelte-heros";

  let lists2 = [
    {
      name: "Profile",
      icon: UserCircleOutline,
      iconSize: 18,
      iconClass: "text-blue-500 dark:text-pink-700",
      href: "/",
    },
    {
      name: "Settings",
      icon: AdjustmentsOutline,
      iconSize: 18,
      iconClass: "text-blue-500 dark:text-purple-500",
      href: "/",
    },
    {
      name: "Messages",
      icon: InboxInOutline,
      iconSize: 18,
      iconClass: "text-blue-500 dark:text-green-500",
      href: "/",
    },
    {
      name: "Download",
      icon: CloudDownloadOutline,
      iconSize: 18,
      iconClass: "text-blue-500 dark:text-red-500",
      href: "/",
    },
  ];
</script>

Props

The component has the following props, type, and default values. See types page for type information.

References