470 lines
21 KiB
PHP
470 lines
21 KiB
PHP
<!doctype html>
|
|
<html>
|
|
<head>
|
|
<title>Custom Wristbands.cz</title>
|
|
<meta charset="utf-8"/>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
|
|
<link href='https://fonts.googleapis.com/css?family=Ubuntu:400,300,500,700&subset=latin-ext,latin' rel='stylesheet' type='text/css'>
|
|
<link href="@asset('foundation.min.css')" type="text/css" rel="stylesheet">
|
|
<script src="@asset('vendor/jquery.min.js')" type="text/javascript"></script>
|
|
<script src="@asset('foundation.min.js')" type="text/javascript"></script>
|
|
<link href="@asset('layout.css')" type="text/css" rel="stylesheet">
|
|
<link href="@asset('style.css')" type="text/css" rel="stylesheet">
|
|
</head>
|
|
<body>
|
|
|
|
<div class="top-bar homepage">
|
|
|
|
<div class="top-bar-left">
|
|
<ul class="menu">
|
|
<li class="menu-text">
|
|
<a href="/"><img src="@asset('images/cwbs_logo_medium.png')" alt="Custom Wristbands Logo"></a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="top-bar-right">
|
|
<ul class="menu">
|
|
<li><a href="#" class="active">Home</a></li>
|
|
<li><a href="#">Sortiment</a></li>
|
|
<li><a href="#">Doprodej</a></li>
|
|
<li><a href="#">Galerie</a></li>
|
|
<li><a href="#">O nás</a></li>
|
|
<li><a href="#">Kontakt</a></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="orbit header" role="region" aria-label="Favorite Space Pictures" data-orbit>
|
|
<ul class="orbit-container">
|
|
<button class="orbit-previous" aria-label="previous"><span class="show-for-sr">Previous Slide</span><i class="fa fa-fw fa-2x fa-chevron-left"></i></button>
|
|
<button class="orbit-next" aria-label="next"><span class="show-for-sr">Next Slide</span><i class="fa fa-fw fa-2x fa-chevron-right"></i></button>
|
|
<li class="orbit-slide is-active">
|
|
<h2>Silikonové náramky 1</h2>
|
|
<h3>všeho druhu</h3>
|
|
<div class="img" style="background-image: url(@asset('images/Sabaton.jpg')) "></div>
|
|
</li>
|
|
<li class="orbit-slide">
|
|
<h2>Silikonové náramky2</h2>
|
|
<h3>všeho druhu</h3>
|
|
<div class="img" style="background-image: url(@asset('images/background_o_nás.jpg'));"></div>
|
|
</li>
|
|
<li class="orbit-slide">
|
|
<h2>Silikonové náramky3</h2>
|
|
<h3>všeho druhu</h3>
|
|
<div class="img" style="background-image: url(@asset('images/Sabaton.jpg'));"></div>
|
|
</li>
|
|
<li class="orbit-slide">
|
|
<h2>Silikonové náramky4</h2>
|
|
<h3>všeho druhu</h3>
|
|
<div class="img" style="background-image: url(@asset('images/Sabaton.jpg'));"></div>
|
|
</li>
|
|
</ul>
|
|
<nav class="orbit-bullets">
|
|
<button class="is-active" data-slide="0"><span class="show-for-sr">First slide details.</span><span class="show-for-sr">Current Slide</span></button>
|
|
<button data-slide="1"><span class="show-for-sr">Second slide details.</span></button>
|
|
<button data-slide="2"><span class="show-for-sr">Third slide details.</span></button>
|
|
<button data-slide="3"><span class="show-for-sr">Fourth slide details.</span></button>
|
|
</nav>
|
|
<i id="chevron-down" class="fa fa-2x fa-chevron-circle-down text-center white-text pointer" onclick="animateScroll()"></i>
|
|
<script>
|
|
|
|
function animateScroll() {
|
|
var body = $("html, body");
|
|
body.stop().animate({scrollTop:$('#assortment').offset().top}, '200', 'swing');
|
|
}
|
|
|
|
</script>
|
|
</div>
|
|
<div id="content">
|
|
<div class="row column text-center m-t-25">
|
|
|
|
<hr>
|
|
|
|
@yield('content')
|
|
|
|
<hr>
|
|
|
|
|
|
<h2 id="assortment">Náš sortiment</h2>
|
|
<hr>
|
|
<p class="text-center">
|
|
The city needs Bruce Wayne, your resources, your knowledge. It doesn't need your body or your life. That time is past.
|
|
<br>
|
|
Seven hundred twelve counts of extortion. Eight hundred and forty-nine counts of racketeering. Two hundred and forty-six counts of fraud. Eighty-seven counts of conspiracy murder.Five hundred and twenty-seven counts of obstruction of justice. How do the defendants plead?
|
|
<br>
|
|
You know how to fight six men. We can teach you how to engage 600.
|
|
<br>
|
|
You have inspired good. But you spat in the faces of Gotham's criminals. Didn't you think there might be casualties? Things always get worse before they get better.
|
|
|
|
</p>
|
|
</div>
|
|
<div class="row small-up-2 large-up-4">
|
|
<div class="column">
|
|
<img class="thumbnail" src="http://placehold.it/250x250">
|
|
<h5 class="assortment-h5">Silikonové<br>náramky</h5>
|
|
<p class="assortment-p">Lorem ipsum dolor<br>
|
|
sit amet, consectetur<br>
|
|
adipiscing elit,<br>
|
|
sed do eiusmod<br>
|
|
tempor incididunt<br>
|
|
ut labore et dolore<br>
|
|
magna aliqua.</p>
|
|
<a href="#" class="assortment-more-btn text-center">- více zde -</a>
|
|
</div>
|
|
<div class="column">
|
|
<img class="thumbnail" src="http://placehold.it/250x250">
|
|
<h5 class="assortment-h5">Atypické<br>náramky</h5>
|
|
<p class="assortment-p">Lorem ipsum dolor<br>
|
|
sit amet, consectetur<br>
|
|
adipiscing elit,<br>
|
|
sed do eiusmod<br>
|
|
tempor incididunt<br>
|
|
ut labore et dolore<br>
|
|
magna aliqua.</p>
|
|
<a href="#" class="assortment-more-btn text-center">- více zde -</a>
|
|
</div>
|
|
<div class="column">
|
|
<img class="thumbnail" src="http://placehold.it/250x250">
|
|
<h5 class="assortment-h5">Papírové a látkové náramky</h5>
|
|
<p class="assortment-p">Lorem ipsum dolor<br>
|
|
sit amet, consectetur<br>
|
|
adipiscing elit,<br>
|
|
sed do eiusmod<br>
|
|
tempor incididunt<br>
|
|
ut labore et dolore<br>
|
|
magna aliqua.</p>
|
|
<a href="#" class="assortment-more-btn text-center">- více zde -</a>
|
|
</div>
|
|
<div class="column">
|
|
<img class="thumbnail" src="http://placehold.it/250x250">
|
|
<h5 class="assortment-h5">Silikonové<br>klíčenky</h5>
|
|
<p class="assortment-p">Lorem ipsum dolor<br>
|
|
sit amet, consectetur<br>
|
|
adipiscing elit,<br>
|
|
sed do eiusmod<br>
|
|
tempor incididunt<br>
|
|
ut labore et dolore<br>
|
|
magna aliqua.</p>
|
|
<a href="#" class="assortment-more-btn text-center">- více zde -</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="grey-wrapper m-t-25 clearfix">
|
|
<div class="row column" id="sale-images">
|
|
<h2 class="m-b-25">Doprodej zboží</h2>
|
|
<div class="column medium-2 sale-image-holder">
|
|
<img src=" http://placehold.it/250x250">
|
|
<div class="sale-item-data text-center">
|
|
<h5>Název produktu</h5>
|
|
<p>popis</p>
|
|
<p>počet ks</p>
|
|
<p class="price">cena: 39,-Kč/ks</p>
|
|
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
|
</div>
|
|
</div>
|
|
<div class="column medium-2 sale-image-holder">
|
|
<img src=" http://placehold.it/250x250">
|
|
<div class="sale-item-data text-center">
|
|
<h5>Název produktu</h5>
|
|
<p>popis</p>
|
|
<p>počet ks</p>
|
|
<p class="price">cena: 39,-Kč/ks</p>
|
|
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
|
</div>
|
|
</div>
|
|
<div class="column medium-2 sale-image-holder">
|
|
<img src=" http://placehold.it/250x250">
|
|
<div class="sale-item-data text-center">
|
|
<h5>Název produktu</h5>
|
|
<p>popis</p>
|
|
<p>počet ks</p>
|
|
<p class="price">cena: 39,-Kč/ks</p>
|
|
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
|
</div>
|
|
</div>
|
|
<div class="column medium-2 sale-image-holder">
|
|
<img src=" http://placehold.it/250x250">
|
|
<div class="sale-item-data text-center">
|
|
<h5>Název produktu</h5>
|
|
<p>popis</p>
|
|
<p>počet ks</p>
|
|
<p class="price">cena: 39,-Kč/ks</p>
|
|
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
|
</div>
|
|
</div>
|
|
<div class="column medium-2 sale-image-holder">
|
|
<img src=" http://placehold.it/250x250">
|
|
<div class="sale-item-data text-center">
|
|
<h5>Název produktu</h5>
|
|
<p>popis</p>
|
|
<p>počet ks</p>
|
|
<p class="price">cena: 39,-Kč/ks</p>
|
|
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
|
</div>
|
|
</div>
|
|
<div class="column medium-2 sale-image-holder">
|
|
<img src=" http://placehold.it/250x250">
|
|
<div class="sale-item-data text-center">
|
|
<h5>Název produktu</h5>
|
|
<p>popis</p>
|
|
<p>počet ks</p>
|
|
<p class="price">cena: 39,-Kč/ks</p>
|
|
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
|
</div>
|
|
</div>
|
|
<div class="column medium-2 sale-image-holder">
|
|
<img src=" http://placehold.it/250x250">
|
|
<div class="sale-item-data text-center">
|
|
<h5>Název produktu</h5>
|
|
<p>popis</p>
|
|
<p>počet ks</p>
|
|
<p class="price">cena: 39,-Kč/ks</p>
|
|
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
|
</div>
|
|
</div>
|
|
<div class="column medium-2 sale-image-holder">
|
|
<img src=" http://placehold.it/250x250">
|
|
<div class="sale-item-data text-center">
|
|
<h5>Název produktu</h5>
|
|
<p>popis</p>
|
|
<p>počet ks</p>
|
|
<p class="price">cena: 39,-Kč/ks</p>
|
|
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
|
</div>
|
|
</div>
|
|
<div class="column medium-2 sale-image-holder">
|
|
<img src=" http://placehold.it/250x250">
|
|
<div class="sale-item-data text-center">
|
|
<h5>Název produktu</h5>
|
|
<p>popis</p>
|
|
<p>počet ks</p>
|
|
<p class="price">cena: 39,-Kč/ks</p>
|
|
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
|
</div>
|
|
</div>
|
|
<div class="column medium-2 sale-image-holder">
|
|
<img src=" http://placehold.it/250x250">
|
|
<div class="sale-item-data text-center">
|
|
<h5>Název produktu</h5>
|
|
<p>popis</p>
|
|
<p>počet ks</p>
|
|
<p class="price">cena: 39,-Kč/ks</p>
|
|
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
|
</div>
|
|
</div>
|
|
<div class="column medium-2 sale-image-holder">
|
|
<img src=" http://placehold.it/250x250">
|
|
<div class="sale-item-data text-center">
|
|
<h5>Název produktu</h5>
|
|
<p>popis</p>
|
|
<p>počet ks</p>
|
|
<p class="price">cena: 39,-Kč/ks</p>
|
|
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
|
</div>
|
|
</div>
|
|
<div class="column medium-2 sale-image-holder">
|
|
<img src=" http://placehold.it/250x250">
|
|
<div class="sale-item-data text-center">
|
|
<h5>Název produktu</h5>
|
|
<p>popis</p>
|
|
<p>počet ks</p>
|
|
<p class="price">cena: 39,-Kč/ks</p>
|
|
<a href="#" class="button secondary rounded m-t-25">DETAIL</a>
|
|
</div>
|
|
</div>
|
|
<div class="clearfix"></div>
|
|
</div>
|
|
<script type="text/javascript">
|
|
$('.sale-image-holder').mouseenter(function() {
|
|
$(this).find('.sale-item-data').animate({opacity: 1}, 100, 'swing');
|
|
}).mouseleave(function() {
|
|
$(this).find('.sale-item-data').animate({opacity: 0}, 300, 'swing');
|
|
})
|
|
</script>
|
|
</div>
|
|
<div class="green-wrapper clearfix">
|
|
<div class="row column text-center" id="questions">
|
|
<h4 class="w-t">MÁTE DOTAZY? NEBO NÁM CHCETE ZASLAT RYCHLOU POPTÁVKU?</h4>
|
|
<a href="#" class="button secondary m-t-25 large rounded">RYCHLÝ FORMULÁŘ</a>
|
|
</div>
|
|
</div>
|
|
<div class="white-wrapper clearfix">
|
|
<div class="row column" id="design">
|
|
<div class="columns medium-7">
|
|
<h6>Design a potisk</h6>
|
|
<p>
|
|
<strong><i>
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
|
|
incididunt ut labore et dolore magna aliqua, amet, consectetur adipiscing elit,
|
|
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
|
</i></strong>
|
|
</p>
|
|
<p>
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et
|
|
dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
|
|
ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore
|
|
eu fugiat nulla pariatur.
|
|
</p>
|
|
</div>
|
|
<div class="columns medium-5">
|
|
<ul class="design-ul-block">
|
|
<li>
|
|
|
|
<h6 class="lowercase">
|
|
Proč si vybrat právě nás?
|
|
</h6>
|
|
<p class="small">
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
|
|
incididunt ut labore et dolore magna aliqua, amet, consectetur adipiscing elit,
|
|
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
|
</p>
|
|
</li>
|
|
<li>
|
|
<h6 class="lowercase">
|
|
Jaký používáme materiál?
|
|
</h6>
|
|
<p class="small">
|
|
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor
|
|
incididunt ut labore et dolore magna aliqua, amet, consectetur adipiscing elit,
|
|
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
|
</p>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="large">
|
|
<div class="row column text-center">
|
|
<h2 id="galerie">Galerie</h2>
|
|
<hr>
|
|
</div>
|
|
<div class="orbit footer" role="region" aria-label="Favorite Space Pictures" data-orbit>
|
|
<ul class="orbit-container text-center">
|
|
<button class="orbit-previous" aria-label="previous"><span class="show-for-sr">Previous Slide</span><i class="fa fa-fw fa-2x fa-chevron-left"></i></button>
|
|
<button class="orbit-next" aria-label="next"><span class="show-for-sr">Next Slide</span><i class="fa fa-fw fa-2x fa-chevron-right"></i></button>
|
|
<li class="orbit-slide is-active row p-lr-15">
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">.
|
|
</div>
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">
|
|
</div>
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">
|
|
</div>
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">
|
|
</div>
|
|
</li>
|
|
<li class="orbit-slide row p-lr-15">
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">.
|
|
</div>
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">
|
|
</div>
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">
|
|
</div>
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">
|
|
</div>
|
|
</li>
|
|
<li class="orbit-slide row p-lr-15">
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">.
|
|
</div>
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">
|
|
</div>
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">
|
|
</div>
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">
|
|
</div>
|
|
</li>
|
|
<li class="orbit-slide row p-lr-15">
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">.
|
|
</div>
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">
|
|
</div>
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">
|
|
</div>
|
|
<div class="column medium-3">
|
|
<img src=" http://placehold.it/250x250">
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<footer class="large">
|
|
<div class="row text-center">
|
|
<ul class="menu social-icons">
|
|
<li>
|
|
<a href="#" target="_blank">
|
|
<span class="fa-stack fa-lg">
|
|
<i class="fa fa-circle fa-stack-2x"></i>
|
|
<i class="fa fa-facebook fa-stack-1x w-t"></i>
|
|
</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="#" target="_blank">
|
|
<span class="fa-stack fa-lg">
|
|
<i class="fa fa-circle fa-stack-2x"></i>
|
|
<i class="fa fa fa-google-plus fa-stack-1x w-t"></i>
|
|
</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="#" target="_blank">
|
|
<span class="fa-stack fa-lg">
|
|
<i class="fa fa-circle fa-stack-2x"></i>
|
|
<i class="fa fa-instagram fa-stack-1x w-t"></i>
|
|
</span>
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="#" target="_blank">
|
|
<span class="fa-stack fa-lg">
|
|
<i class="fa fa-circle fa-stack-2x"></i>
|
|
<i class="fa fa-pinterest-p fa-stack-1x w-t"></i>
|
|
</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<div class="clearfix"></div>
|
|
<ul class="menu">
|
|
<li><a href="#" class="active">Home</a></li>
|
|
<li><a href="#">Sortiment</a></li>
|
|
<li><a href="#">Doprodej</a></li>
|
|
<li><a href="#">Galerie</a></li>
|
|
<li><a href="#">O nás</a></li>
|
|
<li><a href="#">Kontakt</a></li>
|
|
</ul>
|
|
<div class="clearfix"></div>
|
|
<hr>
|
|
<p>
|
|
<a href="#">Název</a> -
|
|
<a href="#">Adresa</a> -
|
|
<a href="#">www.url.cz</a> -
|
|
<a href="#">email@email</a> -
|
|
<a href="#">00420147852369</a>
|
|
</p>
|
|
</div>
|
|
|
|
</footer>
|
|
<script type="text/javascript">
|
|
$(function() {
|
|
$(document).foundation();
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|