overseas-website-demo/src/main/resources/templates/components/header.html

<header class="header style7">
    <div class="top-bar">
        <div class="container">
            <div class="top-bar-left">
                <div class="header-message">
                    Welcome to YMB2B.COM !
                </div>
            </div>
            <div class="top-bar-right">
                <!--<div class="header-language">
                    <div class="dungar-language dungar-dropdown">
                        <a href="#" class="active language-toggle" data-dungar="dungar-dropdown">
                            <span>English</span>
                        </a>
                        <ul class="dungar-submenu">
                            <li class="switcher-option">
                                <a href="#">
                                    <span>English</span>
                                </a>
                            </li>
                            <li class="switcher-option">
                                <a href="#">
                                    <span>中文简体</span>
                                </a>
                            </li>
                        </ul>
                    </div>
                </div>-->
                <ul class="header-user-links">
                    <li>
                        <a href="/login.html">Login or Register</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="container">
        <div class="main-header">
            <div class="row">
                <div class="col-lg-3 col-sm-4 col-md-3 col-xs-7 col-ts-12 header-element">
                    <div class="logo">
                        <a href="/index.html">
                            YMB2B.COM
                            <!--<img src="/picture/logo.png" alt="img">-->
                        </a>
                    </div>
                </div>
                <div class="col-lg-7 col-sm-8 col-md-6 col-xs-5 col-ts-12">
                    <div class="block-search-block">
                        <form class="form-search form-search-width-category">
                            <div class="form-content">
                                <div class="inner">
                                    <input type="text" class="input" name="s" value=""
                                           placeholder="Search here">
                                </div>
                                <button class="btn-search" type="submit">
                                    <span class="icon-search"></span>
                                </button>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="col-lg-2 col-sm-12 col-md-3 col-xs-12 col-ts-12">
                    <div class="header-control">
                        <!--<div class="block-minicart dungar-mini-cart block-header dungar-dropdown">
                            <a href="javascript:void(0);" class="shopcart-icon" data-dungar="dungar-dropdown">
                                Cart<span class="count">0</span>
                            </a>
                        </div>-->
                        <div class="block-account block-header dungar-dropdown">
                            <a href="/login.html">
                                <span class="flaticon-user"></span>
                            </a>
                        </div>
                        <a class="menu-bar mobile-navigation menu-toggle" href="#">
                            <span></span>
                            <span></span>
                            <span></span>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="header-nav-container rows-space-20">
        <div class="container">
            <div class="header-nav-wapper main-menu-wapper">
                <div class="vertical-wapper block-nav-categori">
                    <div class="block-title">
                            <span class="icon-bar">
                                <span></span>
                                <span></span>
                                <span></span>
                            </span>
                        <span class="text">All Categories</span>
                    </div>
                    <div class="block-content verticalmenu-content">
                        <ul class="dungar-nav-vertical vertical-menu dungar-clone-mobile-menu">
                            <li class="menu-item">
                                <a class="dungar-menu-item-title" href="/list/1010.html?title=Mesodermal-products" title="Mesodermal products">Mesodermal products</a>
                            </li>
                            <li class="menu-item">
                                <a title="Anti-aging and wrinkle removal" href="/list/1011.html?title=Anti-aging-and-wrinkle-removal" class="dungar-menu-item-title">Anti-aging and wrinkle removal</a>
                            </li>
                            <li class="menu-item">
                                <a title="Postoperative repair" href="/list/1012.html?title=Postoperative-repair" class="dungar-menu-item-title">Postoperative repair</a>
                            </li>
                            <li class="menu-item">
                                <a title="SPA products" href="/list/1013.html?title=SPA-products" class="dungar-menu-item-title">SPA products</a>
                            </li>
                            <li class="menu-item">
                                <a title="Private product" href="/list/1014.html?title=Private-product" class="dungar-menu-item-title">Private product</a>
                            </li>
                            <li class="menu-item">
                                <a title="Service products" href="/list/1015.html?title=Service-products" class="dungar-menu-item-title">Service products</a>
                            </li>
                            <li class="menu-item">
                                <a title="Consumables" href="/list/1016.html?title=Consumables" class="dungar-menu-item-title">Consumables</a>
                            </li>
                            <li class="menu-item">
                                <a title="Provisional products" href="/list/1017.html?title=Provisional-products" class="dungar-menu-item-title">Provisional products</a>
                            </li>
                        </ul>
                    </div>
                </div>
                <div class="header-nav">
                    <div class="container-wapper">
                        <ul class="dungar-clone-mobile-menu dungar-nav main-menu " id="menu-main-menu">
                            <li class="menu-item  menu-item-has-children">
                                <a href="/list/1010.html?title=Product" class="dungar-menu-item-title" title="Product">Product</a>
                            </li>
                            <li class="menu-item menu-item-has-children">
                                <a href="/list/1018.html?title=Instrument" class="dungar-menu-item-title" title="Instrument">Instrument</a>
                            </li>
                            <li class="menu-item  menu-item-has-children item-megamenu">
                                <a href="/list/1016.html?title=Consumables" class="dungar-menu-item-title" title="Consumables">Consumables</a>
                            </li>
                            <li class="menu-item  menu-item-has-children item-megamenu">
                                <a href="/about.html" class="dungar-menu-item-title" title="Contact Us">About</a>
                            </li>
                            <li class="menu-item  menu-item-has-children item-megamenu">
                                <a href="/help.html" class="dungar-menu-item-title" title="Help Center">Help Center</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</header>
<div class="header-device-mobile">
    <div class="wapper">
        <div class="item mobile-logo">
            <div class="logo">
                <a href="/index.html">
                    YMB2B.COM
                    <!--<img src="/picture/logo.png" alt="img">-->
                </a>
            </div>
        </div>
        <div class="item item mobile-search-box has-sub">
            <a href="#">
                    <span class="icon">
                        <i class="fa fa-search" aria-hidden="true"></i>
                    </span>
            </a>
            <div class="block-sub">
                <a href="#" class="close">
                    <i class="fa fa-times" aria-hidden="true"></i>
                </a>
                <div class="header-searchform-box">
                    <form class="header-searchform">
                        <div class="searchform-wrap">
                            <input type="text" class="search-input" placeholder="Enter keywords to search...">
                            <input type="submit" class="submit button" value="Search">
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <!--<div class="item mobile-settings-box has-sub">
            <a href="#">
                    <span class="icon">
                        <i class="fa fa-cog" aria-hidden="true"></i>
                    </span>
            </a>
            <div class="block-sub">
                <a href="#" class="close">
                    <i class="fa fa-times" aria-hidden="true"></i>
                </a>
                <div class="block-sub-item">
                    <h5 class="block-item-title">Currency</h5>
                    <form class="currency-form dungar-language">
                        <ul class="dungar-language-wrap">
                            <li class="active">
                                <a href="#">
                                    <span>English</span>
                                </a>
                            </li>
                            <li>
                                <a href="#">
                                    <span>中文简体</span>
                                </a>
                            </li>
                        </ul>
                    </form>
                </div>
            </div>
        </div>-->
        <div class="item menu-bar">
            <a class=" mobile-navigation  menu-toggle" href="#">
                <span></span>
                <span></span>
                <span></span>
            </a>
        </div>
    </div>
</div>