2014-05-15 01:23:31 +01:00
<!DOCTYPE html>
2014-05-15 00:13:56 +01:00
< html >
< head >
2014-05-15 01:22:58 +01:00
< title > Lilla Macarons< / title >
< meta charset = "UTF-8" >
2014-05-15 09:19:56 +01:00
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" / >
2014-05-15 00:13:56 +01:00
< link href = "http://fonts.googleapis.com/css?family=Niconne" rel = "stylesheet" type = "text/css" / >
< link href = "http://fonts.googleapis.com/css?family=Josefin+Sans" rel = "stylesheet" type = "text/css" / >
< style type = "text/css" >
2014-05-15 10:23:08 +01:00
html {
2014-05-15 00:13:56 +01:00
font-family: "Josefin Sans", sans-serif;
margin: 0;
2014-05-15 09:19:56 +01:00
background: url("macarons.jpg") no-repeat center top fixed;
background-size: cover;
2014-05-15 10:23:08 +01:00
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
2014-05-15 00:13:56 +01:00
color: #fff;
2014-05-15 10:24:18 +01:00
min-height: 100%;
2014-05-15 10:25:05 +01:00
min-width: 100%;
2014-05-15 00:13:56 +01:00
}
2014-06-11 20:37:02 +01:00
2014-05-15 00:13:56 +01:00
a {
color: #fff;
text-decoration: none;
}
2014-06-11 20:37:02 +01:00
2014-05-15 00:13:56 +01:00
h1#sticker {
margin: 0 auto;
text-align: center;
top: 25%;
2014-05-15 08:18:14 +01:00
left: 35%;
position: absolute;
2014-05-15 00:13:56 +01:00
font-family: 'Niconne', cursive;
2014-05-15 10:49:40 +01:00
font-size: 6em;
2014-05-15 00:13:56 +01:00
width: 2.5em;
height: 2.5em;
border-radius: 2em;
background: yellow;
line-height: 2.35em;
color: #fff;
2014-05-15 10:49:40 +01:00
border: 0.3em solid white;
2014-05-15 00:13:56 +01:00
}
2014-06-11 20:37:02 +01:00
2014-05-15 00:13:56 +01:00
#contact {
2014-05-15 08:18:14 +01:00
position: absolute;
2014-05-15 00:13:56 +01:00
width: 16em;
left: 3em;
top:85%;
text-align: left;
}
2014-06-11 20:37:02 +01:00
2014-05-15 00:13:56 +01:00
#contact .icons {
padding: 0 0 0 1.5em;
}
2014-06-11 20:37:02 +01:00
2014-05-15 00:13:56 +01:00
#rightmenu {
background-color: rgba(128,0,128,0.4);
color: #fff;
border-left: 3px solid purple;
position: absolute;
2014-05-15 08:18:14 +01:00
margin-left: 100%;
2014-05-15 00:13:56 +01:00
top: 0;
width: 15em;
height: 100%;
padding: 1em;
2014-05-15 09:42:23 +01:00
display: none;
2014-05-15 00:13:56 +01:00
}
2014-06-11 20:37:02 +01:00
2014-05-15 00:13:56 +01:00
.menutitle {
font-size: 150%;
}
2014-06-11 20:37:02 +01:00
2014-05-15 00:13:56 +01:00
.flavours {
line-height: 2em;
font-size: 120%;
list-style-type: none;
2014-05-15 09:49:32 +01:00
padding: 0;
font-weight: 400;
2014-05-15 00:13:56 +01:00
}
div.allergies {
font-size: 90%;
white-space: normal;
position: absolute;
top: 85%;
}
2014-06-11 20:37:02 +01:00
2014-05-15 00:13:56 +01:00
#ordertext {
display: none;
font-size: 120%;
}
2014-06-11 20:37:02 +01:00
2014-05-15 00:13:56 +01:00
#footer {
font-size: 70%;
position: absolute;
top: 97%;
width: 98%;
text-align: right;
2014-06-11 20:37:02 +01:00
}
2014-05-15 11:27:31 +01:00
@media only screen and (-webkit-device-pixel-ratio:2) {
2014-05-15 11:10:25 +01:00
h1#sticker {
font-size: 3em;
}
2014-06-11 20:37:02 +01:00
2014-05-15 11:10:25 +01:00
.menutitle, .flavours, .allergies {
2014-06-11 20:37:02 +01:00
font-size: 80%;
2014-05-15 11:10:25 +01:00
}
}
2014-05-15 00:13:56 +01:00
< / style >
< script src = "http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" > < / script >
2014-05-16 16:02:33 +01:00
< script type = "text/javascript" >
2014-05-15 20:55:42 +01:00
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
2014-11-11 18:50:03 +00:00
(i[r].q=i[r].q||[]).push(arguments);},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m);
2014-05-15 20:55:42 +01:00
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-51053608-1', 'lillamacarons.com');
ga('send', 'pageview');
2014-05-15 21:00:42 +01:00
var trackOutboundLink = function(url) {
2014-05-17 15:48:46 +01:00
ga('send', 'event', 'outbound', 'click', url);
2014-11-11 18:50:03 +00:00
};
2014-05-15 20:55:42 +01:00
< / script >
2014-05-15 00:13:56 +01:00
< script type = "text/javascript" >
function openMenu() {
$(function(){
2014-05-16 15:12:40 +01:00
$("#ordertext").fadeIn(2000);
2014-05-15 17:16:03 +01:00
if ( $("#rightmenu").css("display") == "none" ) {
2014-05-15 09:42:23 +01:00
$("#rightmenu").css("display", "inline");
2014-05-15 00:13:56 +01:00
$("#rightmenu").animate({left: "-=" + $("#rightmenu").css("width")}, 1000);
}
});
}
2014-06-11 20:37:02 +01:00
2014-05-15 00:13:56 +01:00
function closeMenu() {
$(function(){
2014-05-15 17:16:03 +01:00
if ( $("#rightmenu").css("display") != "none" ) {
2014-05-15 09:45:45 +01:00
$("#rightmenu").animate({left: "+=" + $("#rightmenu").css("width")}, 1000, function(){
2014-05-15 09:42:23 +01:00
$("#rightmenu").css("display", "none");
2014-05-15 09:35:54 +01:00
});
2014-05-15 00:13:56 +01:00
}
});
}
< / script >
< / head >
< body >
2014-11-11 18:50:03 +00:00
< h1 id = "sticker" onmouseover = "openMenu();" onclick = "openMenu();" > Lilla< / h1 >
2014-05-15 00:13:56 +01:00
< div id = "contact" >
< span id = "ordertext" > Place your order here< / span > < br / >
< span class = "icons" >
2014-05-17 15:35:33 +01:00
< a target = "_blank" onclick = "trackOutboundLink('http://facebook.com/macaronslilla');" href = "http://facebook.com/macaronslilla" > < img src = "facebook-4-32.png" alt = "facebook" / > < / a >
< a target = "_blank" onclick = "trackOutboundLink('http://twitter.com/lilla_macarons');" href = "http://twitter.com/lilla_macarons" > < img src = "twitter-4-32.png" alt = "twitter" / > < / a >
< a target = "_blank" onclick = "trackOutboundLink('mailto:enquiries@lillamacarons.com');" href = "mailto:enquiries@lillamacarons.com" > < img src = "email-14-32.png" alt = "email" / > < / a >
2014-05-15 00:13:56 +01:00
< / span >
< / div >
< div id = "footer" >
< span id = "attribution" > Photo by < a href = "https://www.flickr.com/people/24576874@N00" > Julien Haler< / a > via Flickr< / span >
< / div >
2014-06-11 20:37:02 +01:00
2014-05-15 00:13:56 +01:00
<!-- Menu -->
< div id = "rightmenu" onclick = "closeMenu();" >
2014-05-15 01:22:58 +01:00
< p class = "menutitle" > Macaron Flavours< / p >
2014-05-15 00:13:56 +01:00
< ul class = "flavours" >
< li > < span > Earl Grey & Biscuit< / span > < / li >
< li > < span > Lemon & Orange< / span > < / li >
< li > < span > Strawberry & Custard< / span > < / li >
< li > < span > Raspberry & Vanilla< / span > < / li >
< li > < span > Double Chocolate< / span > < / li >
< li > < span > Pistachio< / span > < / li >
< li > < span > Coffee & Irish Cream< / span > < / li >
< li > < span > Chocolate & Orange< / span > < / li >
< li > < span > Hazelnut< / span > < / li >
< / ul >
< div class = "allergies" > < span > Allergy advice: Contains nuts, gluten,< br / > dairy and eggs. Please contact us for< br / > a full list of ingredients.< / span > < / div >
< / div >
<!-- /Menu -->
< / body >
2014-05-15 01:20:18 +01:00
< / html >
