576 lines
30 KiB
HTML
576 lines
30 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<!-- Heading -->
|
|
<title>Mega Menu</title>
|
|
|
|
<!-- Required Meta Tags Always Come First -->
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
|
|
<!-- Favicon -->
|
|
<link rel="shortcut icon" href="../../../favicon.ico">
|
|
|
|
<!-- Google Fonts -->
|
|
<link href="//fonts.googleapis.com/css?family=Poppins:300,400,500,600,700" rel="stylesheet">
|
|
|
|
<!-- CSS Implementing Plugins -->
|
|
<link rel="stylesheet" href="./dist/hs-mega-menu.min.css">
|
|
|
|
<!-- CSS Front Template -->
|
|
<link rel="stylesheet" href="../../../assets/css/theme.css">
|
|
<!-- ONLY DEV -->
|
|
@@if (previewMode === true) {
|
|
<style>
|
|
body {
|
|
opacity: 0;
|
|
}
|
|
</style>
|
|
}
|
|
<!-- END ONLY DEV -->
|
|
</head>
|
|
<body>
|
|
<!-- ========== HEADER ========== -->
|
|
<header id="header" class="header header--abs-top header--bg-transparent header--show-hide">
|
|
<div class="header__section">
|
|
<div id="logoAndNav" class="container">
|
|
<!-- Nav -->
|
|
<nav class="navbar navbar-expand-md header__navbar header__navbar--no-space position-relative">
|
|
<!-- Logo -->
|
|
<a class="navbar-brand header__navbar-brand" href="index.html" aria-label="Front">
|
|
<img src="../../../assets/svg/logos/logo.svg" alt="Logo">
|
|
</a>
|
|
<!-- End Logo -->
|
|
|
|
<!-- Responsive Toggle Button -->
|
|
<button type="button" class="navbar-toggler btn hamburger"
|
|
aria-label="Toggle navigation"
|
|
aria-expanded="false"
|
|
aria-controls="navBar"
|
|
data-toggle="collapse"
|
|
data-target="#navBar">
|
|
<span id="hamburgerTrigger" class="hamburger__box">
|
|
<span class="hamburger__inner"></span>
|
|
</span>
|
|
</button>
|
|
<!-- End Responsive Toggle Button -->
|
|
|
|
<!-- Navigation -->
|
|
<div id="navBar" class="collapse navbar-collapse header__navbar-collapse">
|
|
<ul class="js-mega-menu navbar-nav header__navbar-nav position-static">
|
|
<!-- Home -->
|
|
<li class="hs-has-mega-menu header__nav-item"
|
|
data-hs-mega-menu-item-options='{
|
|
"desktop": {
|
|
"animationIn": "slideInUp",
|
|
"position": "left"
|
|
}
|
|
}'>
|
|
<a id="homeMegaMenu" class="hs-mega-menu__invoker nav-link header__nav-link header__nav-link-toggle" href="javascript:;" aria-haspopup="true" aria-expanded="false">Home</a>
|
|
|
|
<!-- Home - Mega Menu -->
|
|
<div class="hs-mega-menu w-100 header__sub-menu" aria-labelledby="homeMegaMenu">
|
|
<div class="row no-gutters">
|
|
<div class="col-lg-6">
|
|
<!-- Banner Image -->
|
|
<div class="header__banner" style="background-image: url(../../../assets/img/750x750/img1.jpg);">
|
|
<div class="header__banner-content">
|
|
<div class="mb-4">
|
|
<span class="header__banner-title">Branding Works</span>
|
|
<p class="header__banner-text">Experience a level of our quality in both design & customization works.</p>
|
|
</div>
|
|
<a class="btn btn-primary btn-sm transition-3d-hover" href="#">Learn More <i class="las la-angle-right ml-2"></i></a>
|
|
</div>
|
|
</div>
|
|
<!-- End Banner Image -->
|
|
</div>
|
|
|
|
<div class="col-lg-6">
|
|
<div class="row header__mega-menu-wrapper">
|
|
<div class="col-sm-6 mb-3 mb-sm-0">
|
|
<span class="header__sub-menu-title">Classic</span>
|
|
<ul class="header__sub-menu-nav-group mb-3">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="index.html">Classic Agency</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="classic-business.html">Classic Business</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="classic-marketing.html">Classic Marketing</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="classic-consulting.html">Classic Consulting</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="classic-start-up.html">Classic Start-up</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="classic-studio.html">Classic Studio <span class="badge badge-success badge-pill ml-1">New</span></a></li>
|
|
</ul>
|
|
|
|
<span class="header__sub-menu-title">Corporate</span>
|
|
<ul class="header__sub-menu-nav-group mb-3">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="corporate-agency.html">Corporate Agency</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="corporate-start-up.html">Corporate Start-Up</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="corporate-business.html">Corporate Business</a></li>
|
|
</ul>
|
|
|
|
<span class="header__sub-menu-title">Portfolio</span>
|
|
<ul class="header__sub-menu-nav-group">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="portfolio-agency.html">Portfolio Agency</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="portfolio-profile.html">Portfolio Profile</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="col-sm-6">
|
|
<span class="header__sub-menu-title">App</span>
|
|
<ul class="header__sub-menu-nav-group mb-3">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="app-ui-kit.html">App UI kit</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="app-saas.html">App SaaS</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="app-workflow.html">App Workflow</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="app-payment.html">App Payment</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="app-software.html">App Software</a></li>
|
|
</ul>
|
|
|
|
<span class="header__sub-menu-title">Onepages</span>
|
|
<ul class="header__sub-menu-nav-group mb-3">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="onepage-corporate.html">Corporate <span class="badge badge-success badge-pill ml-1">New</span></a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="onepage-saas.html">SaaS</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="onepage-creative.html">Creative</a></li>
|
|
</ul>
|
|
|
|
<span class="header__sub-menu-title">Blog</span>
|
|
<ul class="header__sub-menu-nav-group">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="blog-agency.html">Blog Agency</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="blog-start-up.html">Blog Start-Up</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="blog-business.html">Blog Business</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Home - Mega Menu -->
|
|
</li>
|
|
<!-- End Home -->
|
|
|
|
<!-- Pages -->
|
|
<li class="hs-has-sub-menu header__nav-item"
|
|
data-hs-mega-menu-item-options='{
|
|
"desktop": {
|
|
"animationIn": "slideInUp"
|
|
}
|
|
}'>
|
|
<a id="pagesMegaMenu" class="hs-mega-menu__invoker nav-link header__nav-link header__nav-link-toggle" href="javascript:;" aria-haspopup="true" aria-expanded="false" aria-labelledby="pagesSubMenu">Pages</a>
|
|
|
|
<!-- Pages - Submenu -->
|
|
<ul id="pagesSubMenu" class="hs-sub-menu header__sub-menu" aria-labelledby="pagesMegaMenu" style="min-width: 230px;">
|
|
<!-- Account -->
|
|
<li class="hs-has-sub-menu">
|
|
<a id="navLinkPagesAccount" class="hs-mega-menu__invoker nav-link header__sub-menu-nav-link header__sub-menu-nav-link-toggle" href="javascript:;" aria-haspopup="true" aria-expanded="false" aria-controls="navSubmenuPagesAccount">Account</a>
|
|
|
|
<ul id="navSubmenuPagesAccount" class="hs-sub-menu header__sub-menu" aria-labelledby="navLinkPagesAccount" style="min-width: 230px;">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../account/index.html">Dashboard</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../account/profile.html">Profile</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../account/my-tasks.html">My tasks</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../account/projects.html">Projects</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../account/members.html">Members</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../account/edit-profile.html">Edit profile</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../account/change-password.html">Change password</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../account/notifications.html">Notifications</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../account/activity.html">Activity</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../account/payment-methods.html">Payment methods</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../account/invite-friends.html">Invite friends</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../account/plans.html">Plans</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../account/api-token.html">API Token</a></li>
|
|
</ul>
|
|
</li>
|
|
<!-- End Account -->
|
|
|
|
<!-- Company -->
|
|
<li class="hs-has-sub-menu">
|
|
<a id="navLinkPagesCompany" class="hs-mega-menu__invoker nav-link header__sub-menu-nav-link header__sub-menu-nav-link-toggle" href="javascript:;" aria-haspopup="true" aria-expanded="false" aria-controls="navSubmenuPagesCompany">Company</a>
|
|
|
|
<ul id="navSubmenuPagesCompany" class="hs-sub-menu header__sub-menu" aria-labelledby="navLinkPagesCompany" style="min-width: 230px;">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/about-agency.html">About Agency</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/services-agency.html">Services Agency</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/customers.html">Customers</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/customer-story.html">Customer story</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/careers.html">Careers</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/careers-single.html">Careers Single</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/hire-us.html">Hire Us</a></li>
|
|
</ul>
|
|
</li>
|
|
<!-- Company -->
|
|
|
|
<!-- Portfolio -->
|
|
<li class="hs-has-sub-menu">
|
|
<a id="navLinkPagesPortfolio" class="hs-mega-menu__invoker nav-link header__sub-menu-nav-link header__sub-menu-nav-link-toggle" href="javascript:;" aria-haspopup="true" aria-expanded="false" aria-controls="navSubmenuPagesPortfolio">Portfolio</a>
|
|
|
|
<ul id="navSubmenuPagesPortfolio" class="hs-sub-menu header__sub-menu" aria-labelledby="navLinkPagesPortfolio" style="min-width: 230px;">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../portfolio/boxed-classic.html">All layouts</a></li>
|
|
<li class="dropdown-divider"></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../portfolio/case-studies-simple.html">Case Studies Simple</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../portfolio/case-studies-modern.html">Case Studies Modern</a></li>
|
|
<li class="dropdown-divider"></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../portfolio/single-page-simple.html">Single Page Simple</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../portfolio/single-page-grid.html">Single Page Grid</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../portfolio/single-page-masonry.html">Single Page Masonry</a></li>
|
|
</ul>
|
|
</li>
|
|
<!-- End Portfolio -->
|
|
|
|
<!-- Login -->
|
|
<li class="hs-has-sub-menu">
|
|
<a id="navLinkPagesLogin" class="hs-mega-menu__invoker nav-link header__sub-menu-nav-link header__sub-menu-nav-link-toggle" href="javascript:;" aria-haspopup="true" aria-expanded="false" aria-controls="navSubmenuPagesLogin">Login & Signup</a>
|
|
|
|
<ul id="navSubmenuPagesLogin" class="hs-sub-menu header__sub-menu" aria-labelledby="navLinkPagesLogin" style="min-width: 230px;">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/login.html">Login</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/signup.html">Signup</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/recover-account.html">Recover Account</a></li>
|
|
<li class="dropdown-divider"></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/login-simple.html">Login Simple</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/signup-simple.html">Signup Simple</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/recover-account-simple.html">Recover Account Simple</a></li>
|
|
</ul>
|
|
</li>
|
|
<!-- Signup -->
|
|
|
|
<!-- Contacts -->
|
|
<li class="hs-has-sub-menu">
|
|
<a id="navLinkContactsServices" class="hs-mega-menu__invoker nav-link header__sub-menu-nav-link header__sub-menu-nav-link-toggle" href="javascript:;" aria-haspopup="true" aria-expanded="false" aria-controls="navSubmenuContactsServices">Contacts</a>
|
|
|
|
<ul id="navSubmenuContactsServices" class="hs-sub-menu header__sub-menu" aria-labelledby="navLinkContactsServices" style="min-width: 230px;">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/contacts-agency.html">Contacts Agency</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/contacts-start-up.html">Contacts Start-Up</a></li>
|
|
</ul>
|
|
</li>
|
|
<!-- Contacts -->
|
|
|
|
<!-- Utilities -->
|
|
<li class="hs-has-sub-menu">
|
|
<a id="navLinkPagesUtilities" class="hs-mega-menu__invoker nav-link header__sub-menu-nav-link header__sub-menu-nav-link-toggle" href="javascript:;" aria-haspopup="true" aria-expanded="false" aria-controls="navSubmenuPagesUtilities">Utilities</a>
|
|
|
|
<ul id="navSubmenuPagesUtilities" class="hs-sub-menu header__sub-menu" aria-labelledby="navLinkPagesUtilities" style="min-width: 230px;">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/pricing.html">Pricing</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/faq.html">FAQ</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/terms.html">Terms & Conditions</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/privacy.html">Privacy & Policy</a></li>
|
|
</ul>
|
|
</li>
|
|
<!-- Utilities -->
|
|
|
|
<!-- Specialty -->
|
|
<li class="hs-has-sub-menu">
|
|
<a id="navLinkPagesSpecialty" class="hs-mega-menu__invoker nav-link header__sub-menu-nav-link header__sub-menu-nav-link-toggle" href="javascript:;" aria-haspopup="true" aria-expanded="false" aria-controls="navSubmenuPagesSpecialty">Specialty</a>
|
|
|
|
<ul id="navSubmenuPagesSpecialty" class="hs-sub-menu header__sub-menu" aria-labelledby="navLinkPagesSpecialty" style="min-width: 230px;">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/cover-page.html">Cover Page</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/coming-soon.html">Coming Soon</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/maintenance-mode.html">Maintenance Mode</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/status.html">Status</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/invoice.html">Invoice</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../pages/error-404.html">Error 404</a></li>
|
|
</ul>
|
|
</li>
|
|
<!-- Specialty -->
|
|
</ul>
|
|
<!-- End Pages - Submenu -->
|
|
</li>
|
|
<!-- End Pages -->
|
|
|
|
<!-- Blog -->
|
|
<li class="hs-has-sub-menu header__nav-item"
|
|
data-hs-mega-menu-item-options='{
|
|
"desktop": {
|
|
"animationIn": "slideInUp"
|
|
}
|
|
}'>
|
|
<a id="blogMegaMenu" class="hs-mega-menu__invoker nav-link header__nav-link header__nav-link-toggle" href="javascript:;" aria-haspopup="true" aria-expanded="false" aria-labelledby="blogSubMenu">Blog</a>
|
|
|
|
<!-- Blog - Submenu -->
|
|
<ul id="blogSubMenu" class="hs-sub-menu header__sub-menu header__sub-menu--spacer" aria-labelledby="blogMegaMenu" style="min-width: 230px;">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../blog/card-style.html">Card Style</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../blog/listing.html">Listing</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../blog/blog-profile.html">Blog Profile</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../blog/single-article.html">Single Article</a></li>
|
|
</ul>
|
|
<!-- End Submenu -->
|
|
</li>
|
|
<!-- End Blog -->
|
|
|
|
<!-- Shop -->
|
|
<li class="hs-has-mega-menu header__nav-item"
|
|
data-hs-mega-menu-item-options='{
|
|
"desktop": {
|
|
"animationIn": "slideInUp",
|
|
"position": "right",
|
|
"maxWidth": "440px"
|
|
}
|
|
}'>
|
|
<a id="shopMegaMenu" class="hs-mega-menu__invoker nav-link header__nav-link header__nav-link-toggle" href="javascript:;" aria-haspopup="true" aria-expanded="false">Shop</a>
|
|
|
|
<!-- Shop - Mega Menu -->
|
|
<div class="hs-mega-menu header__sub-menu header__mega-menu-position-right-fix--md" aria-labelledby="shopMegaMenu">
|
|
<div class="header__mega-menu-wrapper">
|
|
<span class="header__sub-menu-title">Shop Elements</span>
|
|
|
|
<div class="row">
|
|
<div class="col-sm-6">
|
|
<ul class="header__sub-menu-nav-group">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../shop/classic.html">Classic</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../shop/categories.html">Categories</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../shop/categories-sidebar.html">Categories Sidebar</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../shop/products-grid.html">Products Grid</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../shop/products-list.html">Products List</a></li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="col-sm-6">
|
|
<ul class="header__sub-menu-nav-group">
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../shop/single-product.html">Single Product</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../shop/empty-cart.html">Empty Cart</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../shop/cart.html">Cart</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../shop/checkout.html">Checkout</a></li>
|
|
<li><a class="nav-link header__sub-menu-nav-link" href="../shop/order-completed.html">Order Completed</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Mega Menu Banner -->
|
|
<div class="header__product-banner">
|
|
<div class="d-flex align-items-end">
|
|
<img class="img-fluid mr-4" src="../../../assets/img/mockups/img4.png" alt="Image Description">
|
|
<div class="header__product-banner-content">
|
|
<div class="mb-4">
|
|
<span class="header__product-banner-title">Win T-shirt</span>
|
|
<p class="header__product-banner-text">Win one of our Front brand T-shirts.</p>
|
|
</div>
|
|
<a class="btn btn-sm btn-soft-primary transition-3d-hover" href="../shop/classic.html">Learn More <i class="las la-angle-right ml-2"></i></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End Mega Menu Banner -->
|
|
</div>
|
|
<!-- End Shop - Mega Menu -->
|
|
</li>
|
|
<!-- End Shop -->
|
|
|
|
<!-- Demos -->
|
|
<li class="hs-has-mega-menu header__nav-item"
|
|
data-hs-mega-menu-item-options='{
|
|
"desktop": {
|
|
"animationIn": "slideInUp",
|
|
"position": "right",
|
|
"maxWidth": "900px"
|
|
}
|
|
}'>
|
|
<a id="demosMegaMenu" class="hs-mega-menu__invoker nav-link header__nav-link header__nav-link-toggle" href="javascript:;" aria-haspopup="true" aria-expanded="false">Demos</a>
|
|
|
|
<!-- Demos - Mega Menu -->
|
|
<div class="hs-mega-menu w-100 header__sub-menu" aria-labelledby="demosMegaMenu">
|
|
<div class="row no-gutters">
|
|
<div class="col-lg-8">
|
|
<div class="header__promo-card-deck">
|
|
<!-- Promo Item -->
|
|
<div class="header__promo-card header__promo-item">
|
|
<a class="header__promo-link" href="../education/index.html">
|
|
<div class="media align-items-center">
|
|
<img class="header__promo-icon" src="../../../assets/svg/icons/icon-67.svg" alt="SVG">
|
|
<div class="media-body">
|
|
<span class="header__promo-title">Education <span class="badge badge-success badge-pill ml-1">New</span></span>
|
|
<small class="header__promo-text">Learn On-demand demo</small>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<!-- End Promo Item -->
|
|
|
|
<!-- Promo Item -->
|
|
<div class="header__promo-card header__promo-item">
|
|
<a class="header__promo-link" href="../app-marketplace/index.html">
|
|
<div class="media align-items-center">
|
|
<img class="header__promo-icon" src="../../../assets/svg/icons/icon-45.svg" alt="SVG">
|
|
<div class="media-body">
|
|
<span class="header__promo-title">App Marketplace</span>
|
|
<small class="header__promo-text">Marketplace app demo</small>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<!-- End Promo Item -->
|
|
</div>
|
|
|
|
<div class="header__promo-card-deck">
|
|
<!-- Promo Item -->
|
|
<div class="header__promo-card header__promo-item">
|
|
<a class="header__promo-link" href="../house/index.html">
|
|
<div class="media align-items-center">
|
|
<img class="header__promo-icon" src="../../../assets/svg/icons/icon-13.svg" alt="SVG">
|
|
<div class="media-body">
|
|
<span class="header__promo-title">House</span>
|
|
<small class="header__promo-text">Real estate demo</small>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<!-- End Promo Item -->
|
|
|
|
<!-- Promo Item -->
|
|
<div class="header__promo-card header__promo-item">
|
|
<a class="header__promo-link" href="../job/index.html">
|
|
<div class="media align-items-center">
|
|
<img class="header__promo-icon" src="../../../assets/svg/icons/icon-19.svg" alt="SVG">
|
|
<div class="media-body">
|
|
<span class="header__promo-title">Job</span>
|
|
<small class="header__promo-text">Job vacancy demo</small>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<!-- End Promo Item -->
|
|
</div>
|
|
|
|
<div class="header__promo-card-deck">
|
|
<!-- Promo Item -->
|
|
<div class="header__promo-card header__promo-item">
|
|
<a class="header__promo-link" href="../help-desk/index.html">
|
|
<div class="media align-items-center">
|
|
<img class="header__promo-icon" src="../../../assets/svg/icons/icon-4.svg" alt="SVG">
|
|
<div class="media-body">
|
|
<span class="header__promo-title">Help Desk</span>
|
|
<small class="header__promo-text">Help desk demo</small>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<!-- End Promo Item -->
|
|
|
|
<!-- Promo Item -->
|
|
<div class="header__promo-card header__promo-item">
|
|
<a class="header__promo-link" href="../crypto/index.html">
|
|
<div class="media align-items-center">
|
|
<img class="header__promo-icon" src="../../../assets/svg/icons/icon-5.svg" alt="SVG">
|
|
<div class="media-body">
|
|
<span class="header__promo-title">Crypto Landing</span>
|
|
<small class="header__promo-text">Cryptocurrency demo</small>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<!-- End Promo Item -->
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Promo -->
|
|
<div class="col-lg-4 header__promo d-none d-lg-block">
|
|
<a class="d-block header__promo-inner" href="#">
|
|
<div class="position-relative">
|
|
<img class="img-fluid rounded mb-3" src="../../../assets/img/380x227/img6.jpg" alt="Image Description">
|
|
</div>
|
|
<span class="text-secondary fs-5">Front makes you look at things from a different perspectives.</span>
|
|
</a>
|
|
</div>
|
|
<!-- End Promo -->
|
|
</div>
|
|
</div>
|
|
<!-- End Demos - Mega Menu -->
|
|
</li>
|
|
<!-- End Demos -->
|
|
|
|
<!-- Docs -->
|
|
<li class="hs-has-mega-menu header__nav-item"
|
|
data-hs-mega-menu-item-options='{
|
|
"desktop": {
|
|
"animationIn": "slideInUp",
|
|
"position": "right",
|
|
"maxWidth": "260px"
|
|
}
|
|
}'>
|
|
<a id="docsMegaMenu" class="hs-mega-menu__invoker nav-link header__nav-link header__nav-link-toggle" href="javascript:;" aria-haspopup="true" aria-expanded="false">Docs</a>
|
|
|
|
<!-- Docs - Submenu -->
|
|
<div class="hs-mega-menu header__sub-menu" aria-labelledby="docsMegaMenu" style="min-width: 330px;">
|
|
<!-- Promo Item -->
|
|
<div class="header__promo-item">
|
|
<a class="header__promo-link" href="../../documentation/index.html">
|
|
<div class="media align-items-center">
|
|
<img class="header__promo-icon" src="../../../assets/svg/icons/icon-2.svg" alt="SVG">
|
|
<div class="media-body">
|
|
<span class="header__promo-title">
|
|
Documentation
|
|
<span class="badge badge-primary badge-pill ml-1">v3.0</span>
|
|
</span>
|
|
<small class="header__promo-text">Development guides</small>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<!-- End Promo Item -->
|
|
|
|
<!-- Promo Item -->
|
|
<div class="header__promo-item">
|
|
<a class="header__promo-link" href="../../starter/index.html">
|
|
<div class="media align-items-center">
|
|
<img class="header__promo-icon" src="../../../assets/svg/icons/icon-1.svg" alt="SVG">
|
|
<div class="media-body">
|
|
<span class="header__promo-title">Get started</span>
|
|
<small class="header__promo-text">Components and snippets</small>
|
|
</div>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<!-- End Promo Item -->
|
|
|
|
<div class="header__promo-footer">
|
|
<!-- List -->
|
|
<div class="row no-gutters">
|
|
<div class="col-6">
|
|
<div class="header__promo-footer-item">
|
|
<small class="text-muted d-block">Check what's new</small>
|
|
<a class="small" href="../../documentation/changelog.html">
|
|
Changelog
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="col-6 header__promo-footer-ver-divider">
|
|
<div class="header__promo-footer-item">
|
|
<small class="text-muted d-block">Have a question?</small>
|
|
<a class="small" href="http://htmlstream.com/contact-us">
|
|
Contact us
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End List -->
|
|
</div>
|
|
</div>
|
|
<!-- End Docs - Submenu -->
|
|
</li>
|
|
<!-- End Docs -->
|
|
|
|
<!-- Button -->
|
|
<li class="header__nav-last-item">
|
|
<a class="btn btn-sm btn-primary transition-3d-hover" href="https://themes.getbootstrap.com/product/front-multipurpose-responsive-template/" target="_blank">
|
|
Buy Now
|
|
</a>
|
|
</li>
|
|
<!-- End Button -->
|
|
</ul>
|
|
</div>
|
|
<!-- End Navigation -->
|
|
</nav>
|
|
<!-- End Nav -->
|
|
</div>
|
|
</div>
|
|
</header>
|
|
<!-- ========== END HEADER ========== -->
|
|
|
|
<div style="height: 100vh;"></div>
|
|
|
|
<script src="../../../assets/vendor/jquery/dist/jquery.min.js"></script>
|
|
<script src="../../../assets/vendor/jquery-migrate/dist/jquery-migrate.min.js"></script>
|
|
<script src="../../../assets/vendor/popper.js/dist/umd/popper.min.js"></script>
|
|
<script src="../../../assets/vendor/bootstrap/dist/js/bootstrap.min.js"></script>
|
|
|
|
<script src="./dist/hs-mega-menu.min.js"></script>
|
|
|
|
<script>
|
|
(function() {
|
|
var megaMenu = new HSMegaMenu($('.js-mega-menu')).init();
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|