add custom element for footer
This commit is contained in:
parent
3735f70a93
commit
5a31509318
|
@ -9,7 +9,7 @@ class blogFooter extends HTMLElement {
|
||||||
blog.forEach((element) => {
|
blog.forEach((element) => {
|
||||||
let li = document.createElement("li");
|
let li = document.createElement("li");
|
||||||
let a = document.createElement("a");
|
let a = document.createElement("a");
|
||||||
a.href = "/post.php?id=" + element["id"];
|
a.href = "/post.html?id=" + element["id"];
|
||||||
a.innerText = element["title"];
|
a.innerText = element["title"];
|
||||||
li.appendChild(a);
|
li.appendChild(a);
|
||||||
ul.appendChild(li);
|
ul.appendChild(li);
|
||||||
|
|
|
@ -11,7 +11,7 @@ class BlogIndex extends HTMLElement {
|
||||||
<article class="breakWord">
|
<article class="breakWord">
|
||||||
<h2>${element["title"]}</h2>
|
<h2>${element["title"]}</h2>
|
||||||
<p breakWord>${element["content"]}</p>
|
<p breakWord>${element["content"]}</p>
|
||||||
<p class="center"><a href="/post.php?id=${element["id"]}"><button>Mehr lesen</button></a></p>
|
<p class="center"><a href="/post.html?id=${element["id"]}"><button>Mehr lesen</button></a></p>
|
||||||
</article>
|
</article>
|
||||||
`;
|
`;
|
||||||
});
|
});
|
||||||
|
|
47
js/customElements/footer.js
Normal file
47
js/customElements/footer.js
Normal file
|
@ -0,0 +1,47 @@
|
||||||
|
class Footer extends HTMLElement {
|
||||||
|
constructor() {
|
||||||
|
super();
|
||||||
|
this.innerHTML = `
|
||||||
|
<footer>
|
||||||
|
<div id="blueBar"></div>
|
||||||
|
<div id="footerContent">
|
||||||
|
<div>
|
||||||
|
<a href="/datenschutzerklaerung.php">Datenschutzerklärung</a><br>
|
||||||
|
<a href="/bildquellen.php">Bildquellen</a><br>
|
||||||
|
<a href="/impressum.php">Impressum</a><br>
|
||||||
|
</div>
|
||||||
|
<div id="newestPost">
|
||||||
|
<h3>Neueste Beiträge:</h3>
|
||||||
|
<jl-footer_blog></jl-footer_blog>
|
||||||
|
</div>
|
||||||
|
<div class="center">
|
||||||
|
<p class="center">
|
||||||
|
<a href="https://www.instagram.com/jonasled1/">
|
||||||
|
<jl-svg data-name="instagram"></jl-svg>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="https://www.thingiverse.com/jonasled/designs/">
|
||||||
|
<jl-svg data-name="3d_model"></jl-svg>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="https://paypal.me/jonasled/">
|
||||||
|
<jl-svg data-name="paypal"></jl-svg>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="https://matrix.to/#/@jonasled:jonasled.de">
|
||||||
|
<jl-svg data-name="matrix"></jl-svg>
|
||||||
|
</a>
|
||||||
|
|
||||||
|
<a href="https://twitter.com/jonasled1">
|
||||||
|
<jl-svg data-name="twitter"></jl-svg>
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<jl-cookie_notice></jl-cookie_notice>
|
||||||
|
`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
customElements.define("jl-footer", Footer);
|
|
@ -13,4 +13,5 @@ require("./customElements/commentsDisplay");
|
||||||
require("./customElements/newComment");
|
require("./customElements/newComment");
|
||||||
require("./customElements/contactMailButton");
|
require("./customElements/contactMailButton");
|
||||||
require("./customElements/header");
|
require("./customElements/header");
|
||||||
require("./customElements/mainMenu");
|
require("./customElements/mainMenu");
|
||||||
|
require("./customElements/footer");
|
|
@ -2,44 +2,7 @@
|
||||||
function getFooter(){
|
function getFooter(){
|
||||||
echo (<<<EOF
|
echo (<<<EOF
|
||||||
</div>
|
</div>
|
||||||
<footer>
|
<jl-footer></jl-footer>
|
||||||
<div id="blueBar"></div>
|
|
||||||
<div id="footerContent">
|
|
||||||
<div>
|
|
||||||
<a href="/datenschutzerklaerung.php">Datenschutzerklärung</a><br>
|
|
||||||
<a href="/bildquellen.php">Bildquellen</a><br>
|
|
||||||
<a href="/impressum.php">Impressum</a><br>
|
|
||||||
</div>
|
|
||||||
<div id="newestPost">
|
|
||||||
<h3>Neueste Beiträge:</h3>
|
|
||||||
<jl-footer_blog></jl-footer_blog>
|
|
||||||
</div>
|
|
||||||
<div class="center">
|
|
||||||
<p class="center">
|
|
||||||
<a href="https://www.instagram.com/jonasled1/">
|
|
||||||
<jl-svg data-name="instagram"></jl-svg>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="https://www.thingiverse.com/jonasled/designs/">
|
|
||||||
<jl-svg data-name="3d_model"></jl-svg>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="https://paypal.me/jonasled/">
|
|
||||||
<jl-svg data-name="paypal"></jl-svg>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="https://matrix.to/#/@jonasled:jonasled.de">
|
|
||||||
<jl-svg data-name="matrix"></jl-svg>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a href="https://twitter.com/jonasled1">
|
|
||||||
<jl-svg data-name="twitter"></jl-svg>
|
|
||||||
</a>
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
<jl-cookie_notice></jl-cookie_notice>
|
|
||||||
<script src="/js/script.js"></script>
|
<script src="/js/script.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
Loading…
Reference in a new issue