import {
Footer,
FooterCopyright,
FooterLink,
FooterLinkGroup,
} from 'flowbite-react'
const DefaultFooterCode = () => {
return (
<>
<div>
<Footer container className='rounded-md'>
<FooterCopyright href='#' by='MateriaIM' year={2024} />
<FooterLinkGroup>
<FooterLink href='#'>About</FooterLink>
<FooterLink href='#'>Privacy Policy</FooterLink>
<FooterLink href='#'>Licensing</FooterLink>
<FooterLink href='#'>Contact</FooterLink>
</FooterLinkGroup>
</Footer>
</div>
</>
)
}
export default DefaultFooterCode
import {
Footer,
FooterCopyright,
FooterDivider,
FooterLink,
FooterLinkGroup,
} from 'flowbite-react'
import FullLogo from '@/app/(DashboardLayout)/layout/shared/logo/FullLogo'
const FooterWithLogoCode = () => {
return (
<>
<div>
<Footer container className='rounded-md'>
<div className='w-full text-center'>
<div className='w-full justify-between sm:flex sm:items-center sm:justify-between'>
<FullLogo />
<FooterLinkGroup>
<FooterLink href='#'>About</FooterLink>
<FooterLink href='#'>Privacy Policy</FooterLink>
<FooterLink href='#'>Licensing</FooterLink>
<FooterLink href='#'>Contact</FooterLink>
</FooterLinkGroup>
</div>
<FooterDivider />
<FooterCopyright href='#' by='MateriaIM' year={2024} />
</div>
</Footer>
</div>
</>
)
}
export default FooterWithLogoCode
import {
Footer,
FooterCopyright,
FooterIcon,
FooterLink,
FooterLinkGroup,
FooterTitle,
} from 'flowbite-react'
import {
BsDribbble,
BsFacebook,
BsGithub,
BsInstagram,
BsTwitter,
} from 'react-icons/bs'
const SitemapLinkFooterCode = () => {
return (
<>
<div>
<Footer bgDark className='rounded-md'>
<div className='w-full'>
<div className='grid w-full grid-cols-2 gap-8 px-6 py-8 md:grid-cols-4'>
<div>
<FooterTitle title='Company' />
<FooterLinkGroup col>
<FooterLink href='#'>About</FooterLink>
<FooterLink href='#'>Careers</FooterLink>
<FooterLink href='#'>Brand Center</FooterLink>
<FooterLink href='#'>Blog</FooterLink>
</FooterLinkGroup>
</div>
<div>
<FooterTitle title='help center' />
<FooterLinkGroup col>
<FooterLink href='#'>Discord Server</FooterLink>
<FooterLink href='#'>Twitter</FooterLink>
<FooterLink href='#'>Facebook</FooterLink>
<FooterLink href='#'>Contact Us</FooterLink>
</FooterLinkGroup>
</div>
<div>
<FooterTitle title='legal' />
<FooterLinkGroup col>
<FooterLink href='#'>Privacy Policy</FooterLink>
<FooterLink href='#'>Licensing</FooterLink>
<FooterLink href='#'>Terms & Conditions</FooterLink>
</FooterLinkGroup>
</div>
<div>
<FooterTitle title='download' />
<FooterLinkGroup col>
<FooterLink href='#'>iOS</FooterLink>
<FooterLink href='#'>Android</FooterLink>
<FooterLink href='#'>Windows</FooterLink>
<FooterLink href='#'>MacOS</FooterLink>
</FooterLinkGroup>
</div>
</div>
<div className='w-full bg-gray-700 px-4 py-6 sm:flex sm:items-center sm:justify-between'>
<FooterCopyright href='#' by='MateriaIM' year={2024} />
<div className='mt-4 flex space-x-6 sm:mt-0 sm:justify-center'>
<FooterIcon href='#' icon={BsFacebook} />
<FooterIcon href='#' icon={BsInstagram} />
<FooterIcon href='#' icon={BsTwitter} />
<FooterIcon href='#' icon={BsGithub} />
<FooterIcon href='#' icon={BsDribbble} />
</div>
</div>
</div>
</Footer>
</div>
</>
)
}
export default SitemapLinkFooterCode
Prop | Description | Type | Default |
---|---|---|---|
href | URL the link should navigate to. | 'http://localhost:5173' | - |
src | Image source for the brand logo. | 'https://flowbite.com/images/logo.svg' | - |
alt | Alternative text for the logo image. | 'flowbite' | - |
icon | React icon component (e.g., from react-icons). | 'BsFacebook' | 'BsInstagram' | - |
by | Name of the entity being credited. | 'Flowbite' | - |
year | Year displayed in the copyright. | 2022 | new Date().getFullYear() |