2020-10-07 20:52:33 +02:00
<!doctype html>
< html >
< head >
< meta charset = "UTF-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
< title > bricabracomania.< / title >
< link href = "css/styles.css" rel = "stylesheet" type = "text/css" >
2020-10-13 11:07:55 +02:00
< link rel = "icon" type = "image/ico" href = "images/favicon.ico" >
2020-10-07 20:52:33 +02:00
< / head >
< body style = "background-color:black;" >
< header >
2020-10-28 20:41:06 +01:00
< img src = "img/logo_ivory.png" alt = "bricabracomania logo" class = "logo" / >
2020-10-07 20:52:33 +02:00
< nav class = "nav" >
< ul >
< li > < a href = "/" > Home< / a > < / li >
< li > < a href = "about.html" > About< / a > < / li >
2020-10-12 00:36:26 +02:00
< li > < a href = "projects.html" > Projects< / a > < / li >
< li > < a href = "contacts.html" > Contacts< / a > < / li >
2020-10-07 20:52:33 +02:00
< / ul >
< / nav >
< / header >
< section class = "home-hero parallax--bg" >
< div class = "container" >
2020-10-28 20:41:06 +01:00
< h1 class = "title parallax--box" > < span > < img src = "img/title_ivory.png" alt = "bricabracomania metalworks" > < / span >
2020-10-07 20:52:33 +02:00
< / h1 >
2020-10-13 11:07:55 +02:00
< a href = "projects.html" class = "button button-accent" > See Our Work< / a >
2020-10-07 20:52:33 +02:00
< / div >
< / section >
< div class = "container" >
< section class = "home-about" >
< script type = "text/javascript" >
function show_posts(myArr) {
var ar = myArr.graphql.user.edge_owner_to_timeline_media.edges;
var images = [];
2020-10-11 23:25:42 +02:00
var thumb_html = '';
2020-10-07 20:52:33 +02:00
var index = 0;
ar.forEach(element => {
image = {
thumb_url: element.node.thumbnail_resources[1].src,
url: "https://instagram.com/p/" + element.node.shortcode
}
console.log(element);
2020-10-11 23:05:59 +02:00
if (index < 8 ) {
2020-10-07 20:52:33 +02:00
images.push(image)
}
index += 1
});
images.forEach(e => {
2020-10-12 22:06:10 +02:00
thumb_html += '< a href = "' + e.url + '" > < img class = "images" src = "'+ e.thumb_url + '" / > < / a > '
});
2020-10-07 20:52:33 +02:00
document.getElementById('ig_container').innerHTML = thumb_html;
}
var xmlhttp = new XMLHttpRequest();
var url = "https://www.instagram.com/bricabracomania_metalworks/?__a=1";
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 & & this.status == 200) {
var myArr = JSON.parse(this.responseText);
2020-10-11 23:05:59 +02:00
show_posts(myArr);
2020-10-07 20:52:33 +02:00
}
};
xmlhttp.open("GET", url, true);
2020-10-12 22:06:10 +02:00
xmlhttp.send();
2020-10-07 20:52:33 +02:00
< / script >
2020-10-11 23:05:59 +02:00
2020-10-07 20:52:33 +02:00
< div class = "home-about-textbox parallax--box" >
< h1 > Who we are< / h1 >
< p > < i > Bricabracomania metalworks is home of antique-inspired, alternative jewelry with an obscure, sculptural twist.< / i > < / p >
< p > < strong > Every design is created with passion and devotion in the best traditions of wax carving by hand, experimenting with forms and textures, as well as unconventional material combinations and patinas.< / strong > < / p >
2020-10-10 01:15:09 +02:00
< p > We celebrate statement pieces, bold designs and mix of eras – < / p >
2020-10-07 20:52:33 +02:00
< / div >
< / section >
< / div >
< section class = "portfolio" >
<!-- portfolio item 01 -->
< figure class = "port-item" >
< img src = "img/portfolio-01.jpg" alt = "portfolio item" >
< figcaption class = "port-desc" >
< p > Project title< / p >
2020-10-12 22:06:10 +02:00
< a href = "projects.html" class = "button button-accent button-small" > Project details< / a > <!-- Hier müsste dann genau auf das Projekt verlinkt werden (Autoscrollen?) -->
2020-10-07 20:52:33 +02:00
< / figcaption >
< / figure >
<!-- portfolio item 03 -->
< figure class = "port-item" >
< img src = "img/portfolio-03.jpg" alt = "portfolio item" >
< figcaption class = "port-desc" >
< p > TELL TALE HEARTS< / p >
2020-10-12 22:06:10 +02:00
< a href = "projects.html" class = "button button-accent button-small" > Project details< / a > <!-- Hier müsste dann genau auf das Projekt verlinkt werden (Autoscrollen?) -->
2020-10-07 20:52:33 +02:00
< / figcaption >
< / figure >
<!-- portfolio item 05 -->
< figure class = "port-item" >
< img src = "img/portfolio-05.jpg" alt = "portfolio item" >
< figcaption class = "port-desc" >
< p > INSPECTING THE DEAD MAN'S CHEST< / p >
2020-10-12 22:06:10 +02:00
< a href = "projects.html" class = "button button-accent button-small" > Project details< / a > <!-- Hier müsste dann genau auf das Projekt verlinkt werden (Autoscrollen?) -->
2020-10-07 20:52:33 +02:00
< / figcaption >
< / figure >
< / section >
< section class = "cta" >
< div class = "container" >
< h2 class = "title title-cta" > Order your piece now!
< / h2 >
2020-10-12 22:06:10 +02:00
< a href = "contacts.html" class = "button button-dark" > Order< / a >
2020-10-07 20:52:33 +02:00
< / div >
< / section >
2020-10-12 00:36:26 +02:00
< p > < a style = "color: #f9f9ed; text-decoration: none; font-size: 15pt;" href = "https://www.instagram.com/bricabracomania_metalworks/" > Check out our instagram page< / a > < / p >
2020-10-11 23:05:59 +02:00
< div id = "ig_container" > <!-- instagram posts will be inserted here --> < / div >
2020-10-07 20:52:33 +02:00
< footer >
< div class = "container" >
< div class = "col-3" >
< ul class = "unstyled-list" style = "text-align:center;" >
< li > < strong > Hancarved jewellery loved and produced by< / strong > < / li >
< li > Bricabracomania Metalworks< / li >
< li > 2020< / li >
< / ul >
< / div >
< div class = "col-3" >
< ul class = "unstyled-list" style = "text-align:center;" >
< li > < strong > Follow us< / strong > < / li >
< a href = "https://www.facebook.com/bricabracomania" target = "popup" > < img src = "images/fb.png" style = "width:50px; height:50px;" / > < / a > < a href = "https://www.etsy.com/shop/BricabracomaniaCraft" target = "popup" > < img src = "images/etsy.png" style = "width:50px; height:50px;" / > < / a > < a href = "https://www.instagram.com/bricabracomania_metalworks" target = "popup" > < img src = "images/instagram.png" style = "width:50px; height:50px;" / > < / a >
< / ul >
< / div >
< / footer >
< script
src="https://code.jquery.com/jquery-2.2.4.min.js"
integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
crossorigin="anonymous">< / script >
< / body >
< / html >
