<header role="banner">
<div class="topbar">
<div class="container">
<div class="topbar__inner">
<div class="topbar__logo">
<img class="logo" src="../../dist/images/logo.svg">
</div>
<div class="topbar__navigation">
<div class="topbar__navigation-flex">
<div class="topbar__navigation-secondary">
More at <a href="https://github.com/Novicell/novicell-pattern-library" title="github.com/Novicell/novicell-pattern-library" target="" class="link " property="url">github.com/Novicell/novicell-pattern-library</a>
</div>
<div class="topbar__navigation-primary">
<nav class="nav-main" role="navigation" vocab="http://schema.org/" typeof="SiteNavigationElement">
<ul class="nav-main-list">
<li class="nav-main-list__item ">
<a href="#" title="Home" target="" class="link " property="url">Home</a>
</li>
<li class="nav-main-list__item nav-main-list__item--active">
<a href="#" title="Get started" target="" class="link true " property="url">Get started</a>
</li>
<li class="nav-main-list__item ">
<a href="#" title="About" target="" class="link " property="url">About</a>
</li>
<li class="nav-main-list__item ">
<a href="#" title="About" target="" class="link " property="url">About</a>
</li>
<li class="nav-main-list__item ">
<a href="#" title="About" target="" class="link " property="url">About</a>
</li>
<li class="nav-main-list__item ">
<a href="#" title="About" target="" class="link " property="url">About</a>
</li>
<li class="nav-main-list__item ">
<a href="#" title="About" target="" class="link " property="url">About</a>
</li>
<li class="nav-main-list__item ">
<a href="#" title="About" target="" class="link " property="url">About</a>
</li>
</ul>
</nav>
<div class="topbar__navigation-search">
<input class="input " type="search" name="search-input" id="search-id" placeholder="Search" />
</div>
</div>
</div>
</div>
<div class="nav-main-mobile">
<button class="mobile-navigation-button hamburger hamburger--squeeze" id="js-mobile-navigation-button" type="button">
<div class="hamburger-box">
<div class="hamburger-inner"></div>
</div>
<span class="hamburger-label js-hamburger-label" data-menu-text="Menu" data-close-text="Close">Menu</span>
</button>
</div>
</div>
</div>
</div>
</header>
<div class="">
<h1 class=" "></h1>
</div>
<h1>Novicell Sprite Scroller Demo</h1>
<div class="sticky-wrapper">
<h3>Scroll down the page to watch the sprite move</h3>
<div class="sprite"></div>
</div>
<script defer src="../../dist/scripts/sprite-scroll.bundle.js"></script>
<footer role="contentinfo" class="footer">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-4">
<div class="row">
<h2 class="heading heading--footer ">Footer header</h2>
<p class="paragraph ">Novicell Aarhus<br>Søren Nymarks Vej 6<br>8270 Højbjerg,<br>Denmark</p>
<ul class="social-media-list">
<li class="social-media-list__item">
<div class="social-link social-link--twitter ">
<a href="#" title="Twitter link" target="_blank">
<svg class="social-link__icon">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="../../dist/icons/icons.svg#icon-twitter"></use>
</svg>
</a>
</div>
</li>
<li class="social-media-list__item">
<div class="social-link social-link--google-plus ">
<a href="#" title="Google Plus link" target="_blank">
<svg class="social-link__icon">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="../../dist/icons/icons.svg#icon-google-plus"></use>
</svg>
</a>
</div>
</li>
<li class="social-media-list__item">
<div class="social-link social-link--facebook ">
<a href="#" title="Facebook link" target="_blank">
<svg class="social-link__icon">
<use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="../../dist/icons/icons.svg#icon-facebook"></use>
</svg>
</a>
</div>
</li>
</ul>
</div>
</div>
<div class="col-xs-12 col-sm-4">
<h2 class="heading heading--footer ">Footer header</h2>
<ul class="link-list ">
<li class="link-list__item">
<a href="#" title="Link title 1" target="" class="link " property="url">Link text 1</a>
</li>
<li class="link-list__item">
<a href="#" title="Link title 2" target="" class="link " property="url">Link text 2</a>
</li>
<li class="link-list__item">
<a href="#" title="Link title 3" target="" class="link " property="url">Link text 3</a>
</li>
</ul>
</div>
<div class="col-xs-12 col-sm-4">
<h2 class="heading heading--footer ">Send us your inquiry</h2>
<div class="form-field ">
<label class="label " for="">
Text label
</label>
<input class="input " type="text" name="text-input" id="text-id" placeholder="Insert text" />
</div>
<div class="form-field ">
<label class="label " for="">
Email label
</label>
<input class="input " type="email" name="email-input" id="email-id" placeholder="Insert e-mail" />
</div>
<div class="form-field ">
<label class="label " for="">
Textarea label
</label>
<textarea class="textarea " name="text-input" id="text-id" placeholder="Insert text"></textarea>
</div>
<button type="button" class="button button--gradient">
gradient
</button>
</div>
</div>
</div>
</footer>
{{ render '@header' }}
<div class="">
<h1 class="{{ modifier }} {{ class }}">{{ text }}</h1>
</div>
<h1>Novicell Sprite Scroller Demo</h1>
<div class="sticky-wrapper">
<h3>Scroll down the page to watch the sprite move</h3>
<div class="sprite"></div>
</div>
<script defer src="{{ path '/dist/scripts/sprite-scroll.bundle.js' }}"></script>
{{ render '@footer' }}
/* No context defined for this component. */
{
"title": "Page",
"status": "prototype",
"context": {
"url": "...",
"alt": "Image",
"text": "Hi fromsprite-scroll Page"
}
}
There are no notes for this item.