Header

Enfty follows a basic structure for headers from Bootstrap. So it's easy to maintain edit and change headers.

We provide whole template responsiveness including the header.

HTML Markup

<!-- header -->
    <header class="fixed-top">
        <div class="container-fluid px-0">
            <div class="header-boxed md-escape">
                <div class="d-flex flex-row transparent-menu-bg justify-content-between align-items-center redius border-0">

                    <!-- menu -->
                    <div class="d-flex flex-row justify-content-between align-items-center py-2">

                        <!-- logo -->
                        <div class="brand-logo pe-3">

                            <div class="dark">

                                ...

                            </div>
                            
                            <div class="light">

                                ...

                            </div>

                        </div>

                        <!-- menu item -->
                        <div class="flex hidesmscreen">
                            <div class="d-flex flex-row align-items-center not-apply-bg gap-4 mb-0">

                                ...

                            </div>
                        </div>

                    </div>

                    <!-- widgets -->
                    <div class="col-auto d-flex flex-row align-items-center">
                        <div class="user-settings gap-2 gap-sm-3">

                            ...

                        </div>
                    </div>

                </div>
            </div>
        </div>
    </header>