Block Header

{# derafu_twig:templates/pages/components/block-header.html.twig #}

{% extends 'layouts/default.html.twig' %}

{% block content %}
<twig:block-header
    logoImage="../../img/block-hero.jpeg"
    logoHtml="<span class='fw-normal'>Libre</span><span class='fw-bold text-primary'>DTE</span>"
    :leftNav="[
        {
            text: 'Inicio',
            url: '#'
        },
        {
            text: 'Servicios',
            icon: 'fa-solid fa-cube',
            items: [
                {
                    text: 'Servicio Basic',
                    icon: 'fa-solid fa-star',
                    url: '#'
                },
                {
                    type: 'divider'
                },
                {
                    text: 'Servicio Plus',
                    icon: 'fa-solid fa-stars',
                    items: [
                        {
                            text: 'Características',
                            url: '#'
                        },
                        {
                            icon: 'fa-solid fa-dollar-sign',
                            text: 'Precios',
                            url: '#'
                        },
                        {
                            type: 'divider'
                        },
                        {
                            icon: 'fa-solid fa-book',
                            text: 'Documentación',
                            url: '#'
                        }
                    ]
                }
            ]
        },
        {
            text: 'Productos',
            icon: 'fa-solid fa-th-large',
            sections: [
                {
                    title: 'Finance',
                    links: [
                        {
                            text: 'Accounting',
                            url: '#',
                            icon: 'fa-solid fa-calculator'
                        },
                        {
                            text: 'Invoicing',
                            url: '#',
                            icon: 'fa-solid fa-file-invoice'
                        }
                    ]
                },
                {
                    title: 'Sales',
                    links: [
                        {
                            text: 'CRM',
                            url: '#',
                            icon: 'fa-solid fa-users'
                        },
                        {
                            text: 'Sales',
                            url: '#',
                            icon: 'fa-solid fa-chart-line'
                        }
                    ]
                }
            ],
            footer: [
                {
                    icon: 'fa-brands fa-github',
                    text: 'Derafu ORG',
                    url: 'https://www.derafu.org'
                },
                {
                    icon: 'fa-brands fa-github',
                    text: 'View on Github',
                    url: '#'
                }
            ],
        }
    ]"
    :rightNav="[
        {
            text: 'Documentación',
            url: '#',
            icon: 'fa-solid fa-book'
        },
        {
            text: 'Productos',
            icon: 'fa-solid fa-th-large',
            sections: [
                {
                    title: 'Finance',
                    cols: 3,
                    links: [
                        {
                            text: 'Accounting',
                            url: '#',
                            icon: 'fa-solid fa-calculator'
                        },
                        {
                            text: 'Invoicing',
                            url: '#',
                            icon: 'fa-solid fa-file-invoice'
                        }
                    ]
                },
                {
                    title: 'Sales',
                    cols: 3,
                    links: [
                        {
                            text: 'CRM',
                            url: '#',
                            icon: 'fa-solid fa-users'
                        },
                        {
                            text: 'Sales',
                            url: '#',
                            icon: 'fa-solid fa-chart-line'
                        }
                    ]
                }
            ],
            footer: [
                {
                    icon: 'fa-brands fa-github',
                    text: 'Derafu ORG',
                    url: 'https://www.derafu.org'
                },
                {
                    icon: 'fa-brands fa-github',
                    text: 'View on Github',
                    url: '#'
                }
            ],
        },
        {
            text: 'Soporte',
            icon: 'fa-solid fa-headset',
            items: [
                {
                    text: 'Centro de Ayuda',
                    icon: 'fa-solid fa-question-circle',
                    url: '#'
                },
                {
                    type: 'divider'
                },
                {
                    text: 'Contacto',
                    icon: 'fa-solid fa-envelope',
                    url: '#'
                }
            ]
        }
    ]"
    ctaIcon="fa-solid fa-check"
    ctaText="¡Probar GRATIS!"
    ctaUrl="#"
/>
{% endblock %}