Sitemap Footer
Examples
<script>
import {SitemapFooter} from 'flowbite-svelte'
import {
Facebook,
Github,
Twitter,
Instagram,
} from "svelte-simples";
let site = {
href: "/",
name: "Flowbite Svelte",
};
let links = [
{
parent: "Company",
children: [
{ name: "About", href: "/" },
{
name: "Careers",
href: "/",
},
{ name: "Brand Center", href: "/" },
{
name: "Blog",
href: "/",
},
],
},
{
parent: "Help center",
children: [
{ name: "Discord Server", href: "/" },
{
name: "Twitter",
href: "/",
},
{ name: "Facebook", href: "/" },
{
name: "Contact Us",
href: "/",
},
],
},
{
parent: "LEGAL",
children: [
{ name: "Privacy Policy", href: "/" },
{ name: "Licensing", href: "/" },
{
name: "Terms & Conditions",
href: "/",
},
],
},
{
parent: "Download",
children: [
{ name: "iOS", href: "/" },
{ name: "Android", href: "/" },
{
name: "Windows",
href: "/",
},
{
name: "MacOS",
href: "/",
},
],
},
];
let socialMedia = [
{
href: "/",
icon: Facebook,
},
{
href: "/",
icon: Github,
},
{
href: "/",
icon: Twitter,
},
{
href: "/",
icon: Instagram,
},
];
</script>
<SitemapFooter {socialMedia} {links} {site} />
Props
The component has the following props, type, and default values. See types page for type information.
Name | Type | Default |
---|---|---|
site | SiteType | - |
links | SocialMediaLinkType[] | - |
socialMedia | SocialMediaType[] | - |
footerClass | string | 'bg-white dark:bg-gray-800' |
linksClass | string | 'grid grid-cols-2 gap-8 py-8 px-6 md:grid-cols-4' |
parentClass | string | 'mb-6 text-sm font-semibold dark:text-gray-400 uppercase' |
ulClass | string | 'text-gray-900 dark:text-gray-300' |
liClass | string | 'mb-4' |
linkClass | string | 'hover:underline' |
copyrightDivClass | string | 'py-6 px-4 text-gray-900 dark:bg-gray-700 md:flex md:items-center md:justify-between' |
copyrightClass | string | 'text-sm text-gray-900 dark:text-gray-300 sm:text-center' |
socialMediaDivClass | string | 'flex mt-4 space-x-6 sm:justify-center md:mt-0' |
socialMediaLinkClass | string | 'text-gray-900 dark:text-gray-400 hover:text-gray-300 dark:hover:text-white' |
iconClass | string | 'h-5 w-5 mr-2' |
copyrightYear | string | '© 2022' |
allRightsReserved | string | 'All Rights Reserved.' |