bsod/brc
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

static #2

Merged
bsod merged 41 commits from static into master 2020-10-30 19:47:46 +01:00
Conversation 0 Commits 41 Files changed 258 +16 -14
2 changed files with 16 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files
Showing only changes of commit 94fcde5d41 - Show all commits

14
brc_static/css/styles.css
View file

@ -16,12 +16,13 @@ img {
max-width: 100%; max-width: 100%;
} }
.images { .images { /*Diese Klasse hab ich den ig bildern zugewiesen*/
filter: grayscale(100%); filter: grayscale(100%);
transition: height 0.5s ease-out, filter 0.3s ease 0.5s, width 0.3s ease-out; transition: height 0.5s ease-out, filter 0.3s ease 0.5s, width 0.3s ease-out;
height: 200px; height: 200px;
width: 200px; width: 200px;
cursor:pointer; cursor:pointer;
margin: 5px;
} }
.images:hover { .images:hover {
@ -81,6 +82,7 @@ video {
.col-3 { .col-3 {
width: 50%; width: 50%;
color: #f9f9ed;
} }
.col-1 { .col-1 {
@ -353,14 +355,14 @@ header {
background-color: #232323; background-color: #232323;
padding: 10em 20%; padding: 10em 20%;
width: 100%; width: 100%;
outline: 2px solid#ffffff; outline: 2px solid#f9f9ed;
outline-offset: -2.5em; outline-offset: -2.5em;
color: #fff; color: #f9f9ed;
position: relative; position: relative;
} }
.home-about-textbox h1 { .home-about-textbox h1 {
color: #ffffff; color: #f9f9ed;
position: absolute; position: absolute;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
@ -602,7 +604,7 @@ header {
=================== */ =================== */
.cta { .cta {
background-color: #ffffff; background-color: #f9f9ed;
padding: 5em 0; padding: 5em 0;
} }
@ -611,7 +613,7 @@ header {
footer { footer {
background: #232323; background: #232323;
color: #fff; color: #f9f9ed;
text-align: left; text-align: left;
padding: 5em 0; padding: 5em 0;
} }

16
brc_static/index.html
View file

@ -48,15 +48,15 @@
url: "https://instagram.com/p/" + element.node.shortcode url: "https://instagram.com/p/" + element.node.shortcode
} }
console.log(element); console.log(element);
if (index < 7) { if (index < 8) {
images.push(image) images.push(image)
} }
index += 1 index += 1
}); });
images.forEach(e => { images.forEach(e => {
thumb_html += '<a href="' + e.url + '"><img class="insta_thumb" src="'+ e.thumb_url + '"/></a>' thumb_html += '<a href="' + e.url + '"><img class="images" src="'+ e.thumb_url + '"/></a>' <!-- Hier war die class falsch zugewiesen -->
}) }); <!-- Muss hier ein ";" hin? -->
document.getElementById('ig_container').innerHTML = thumb_html; document.getElementById('ig_container').innerHTML = thumb_html;
} }
@ -67,14 +67,15 @@
xmlhttp.onreadystatechange = function() { xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) { if (this.readyState == 4 && this.status == 200) {
var myArr = JSON.parse(this.responseText); var myArr = JSON.parse(this.responseText);
show_posts(myArr) show_posts(myArr);
} }
}; };
xmlhttp.open("GET", url, true); xmlhttp.open("GET", url, true);
xmlhttp.send(); xmlhttp.send(); <!-- Muss hier ein ";" hin? -->
</script> </script>
<div class="home-about-textbox parallax--box"> <div class="home-about-textbox parallax--box">
<h1>Who we are</h1> <h1>Who we are</h1>
<p><i>Bricabracomania metalworks is home of antique-inspired, alternative jewelry with an obscure, sculptural twist.</i></p> <p><i>Bricabracomania metalworks is home of antique-inspired, alternative jewelry with an obscure, sculptural twist.</i></p>
@ -85,7 +86,6 @@
</section> </section>
</div> </div>
<section class="portfolio"> <section class="portfolio">
<!-- portfolio item 01 --> <!-- portfolio item 01 -->
<figure class="port-item"> <figure class="port-item">
@ -124,8 +124,8 @@
</div> </div>
</section> </section>
<p><a style="color: #fff; text-decoration: none;" href="https://www.instagram.com/bricabracomania_metalworks/">Check out our instagram page</a></p> <p><a style="color: #f9f9ed; text-decoration: none;" href="https://www.instagram.com/bricabracomania_metalworks/">Check out our instagram page</a></p>
<div id="ig_container"><!-- instagram posts will be inserted here --></div> <div id="ig_container"><!-- instagram posts will be inserted here --></div>
</div> </div>
<footer> <footer>