<?xml version="1.0" encoding="utf-8"?>
<odoo>

    <template
        id="website_sale.s_mega_menu_menus_logos"
        name="eCommerce: Menus &amp; logos"
        groups="base.group_user"
    >
        <section class="s_mega_menu_menus_logos overflow-hidden o_colored_level o_cc o_cc1">
            <div class="container">
                <div class="row">
                    <div class="col-12 col-lg-8">
                        <div class="row py-3 h-100">
                            <t
                                t-foreach="request.env['product.public.category'].search([
                                    ('parent_id', '=', False), ('has_published_products', '=', True)
                                ], limit=6)"
                                t-as="category"
                            >
                                <div class="col-12 col-lg-4 py-2">
                                    <h4>
                                        <a
                                            t-att-href="'/shop/category/%s' % category.id"
                                            class="col-lg-4 nav-link text-black p-0"
                                            t-esc="category.name"
                                        />
                                    </h4>
                                    <nav class="nav flex-column">
                                        <t t-foreach="category.child_id.filtered('has_published_products')"
                                           t-as="sub_category">
                                            <a
                                                t-att-href="'/shop/category/%s' % sub_category.id"
                                                class="nav-link px-0"
                                                t-esc="sub_category.name"
                                            />
                                        </t>
                                    </nav>
                                </div>
                            </t>
                        </div>
                    </div>
                    <div class="col-12 col-lg-4 py-4 d-flex align-items-center justify-content-center s_mega_menu_gray_area">
                        <a href="#" class="nav-link text-center px-0" data-name="Menu Item">
                            <img src="/web/image/website.s_mega_menu_menus_logos_default_image" class="mb-3 rounded shadow img-fluid" alt=""/>
                            <h4>Spring collection has arrived!</h4>
                        </a>
                    </div>
                </div>
            </div>
            <div class="s_mega_menu_menus_logos_wrapper border-top">
            <div class="container">
                <div class="row py-3">
                    <div class="col-4 col-lg-2">
                        <img
                            src="/web/image/website.s_mega_menu_menus_logos_default_logo_1"
                            class="img-fluid"
                            alt=""/>
                    </div>
                    <div class="col-4 col-lg-2">
                        <img
                            src="/web/image/website.s_mega_menu_menus_logos_default_logo_2"
                            class="img-fluid"
                            alt=""/>
                    </div>
                    <div class="col-4 col-lg-2">
                        <img
                            src="/web/image/website.s_mega_menu_menus_logos_default_logo_3"
                            class="img-fluid"
                            alt=""/>
                    </div>
                    <div class="col-4 col-lg-2">
                        <img
                            src="/web/image/website.s_mega_menu_menus_logos_default_logo_4"
                            class="img-fluid"
                            alt=""/>
                    </div>
                    <div class="col-4 col-lg-2">
                        <img
                            src="/web/image/website.s_mega_menu_menus_logos_default_logo_5"
                            class="img-fluid"
                            alt=""/>
                    </div>
                    <div class="col-4 col-lg-2">
                        <img
                            src="/web/image/website.s_mega_menu_menus_logos_default_logo_6"
                            class="img-fluid"
                            alt=""/>
                    </div>
                </div>
            </div>
        </div>
        </section>
    </template>

</odoo>
