@mezereon/bigcommerce-stencil
Version:
BigCommerce UI components for Mezereon Xperience
98 lines (97 loc) • 4.3 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="/favicon.ico">
<title>BigCommerce - Mezereon XP</title>
<link rel="stylesheet" href="/style.css">
<link rel="stylesheet" href="https://cdn11.bigcommerce.com/s-l2sjmh80kj/stencil/61d2fe30-596b-0137-5b2f-0242ac11001d/css/theme-4a4c4710-5f4f-0137-cd6c-0242ac110015.css">
<style>
#mz-app, #mz-autocomplete { display: none ; }
</style>
<link rel="stylesheet" href="/ui-components.css">
<script type="text/javascript">
(function (w) {
w.mz = w.mz || {}; w.mz.track = w.mz.track || function() { (w.mz.q = w.mz.q || []).push(arguments) }
w.mz.config = {
tracking: {
url: 'https://app.mezereon/t',
key: 'track-bef5ae02-d2a7-4496-9892-10ce4a3f6bb4',
log: false
},
search: {
url: 'https://app.mezereon/api/1.0',
key: 'search-5110e3e3-10b0-464f-aade-55a55dd6c100'
},
scroll: {
element: ".mz-query",
duration: 500,
}
};
})(window);
</script>
<script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script>
<script src="./ui-components.umd.min.js" defer></script>
<script src="./theme/ui-components.umd.min.js" defer></script>
<script src="./mezereon.js" defer></script>
</head>
<body>
<noscript>
<strong>We're sorry but ui-components-vue doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div class="mz-wrapper">
<a href="https://www.mezereon.com" target="blank">
<img
alt="Mezereon logo"
src="https://cdn.mezereon.net/assets/mezereon-logo.png"
style="float: right; height: 40px; margin-top: 10px"
/>
</a>
<div class="mz-container mz-flex">
<div id="mz-autocomplete" class="mz-flex-fit">
<mz-search-box query-param="search_query" search-url="/preview.html" placeholder="search the store.."></mz-search-box>
</div>
</div>
<div id="mz-app">
<mz-context ref="context"></mz-context>
<img src="https://cdn.mezereon.net/assets/loading.gif" class="mz-loader" v-show="loading" />
<div v-cloak class="mz-results" v-show="!loading">
<div :class="['mz-box-body', filterLayoutClass]">
<mz-refinements :horizontal="true" class="mz-aggs-horizontal mz-hidden-xs"></mz-refinements>
<mz-selections></mz-selections>
<div class="mz-row">
<div class="mz-aggs mz-aggs-vertical mz-hidden-xs page-sidebar">
<portal to="mz-mobile-facets" :disabled="!portalNav">
<mz-banner zone="facets-top-1"></mz-banner>
<mz-banner zone="facets-top-2"></mz-banner>
<mz-refinements></mz-refinements>
<mz-banner zone="facets-bottom-1"></mz-banner>
<mz-banner zone="facets-bottom-2"></mz-banner>
</portal>
</div>
<div class="page-content">
<mz-action-bar @toggle-portal-nav="togglePortalNav">
<mz-hits-info></mz-hits-info>
</mz-action-bar>
<mz-banner zone="results-top-1"></mz-banner>
<mz-banner zone="results-top-2"></mz-banner>
<mz-hits-grid v-slot="single" class="mz-grid productGrid">
<hit-grid-item :item="single.hit.item" :score="single.hit.score" :index="single.index"></hit-grid-item>
</mz-hits-grid>
<mz-banner zone="results-bottom-1"></mz-banner>
<mz-banner zone="results-bottom-2"></mz-banner>
</div>
<mz-pagination></mz-pagination>
</div>
</div>
</div>
<ch-drawer location="right" custom-class="mz-drawer" area="80%" :visible.sync="portalNav">
<portal-target name="mz-mobile-facets"></portal-target>
</ch-drawer>
</div>
</div>
<!-- built files will be auto injected -->
</body>
</html>