add custom element for footer

js/customElements/blogFooter.js

@@ -9,7 +9,7 @@ class blogFooter extends HTMLElement {
                 blog.forEach((element) => {
                     let li = document.createElement("li");
                     let a = document.createElement("a");
-                    a.href = "/post.php?id=" + element["id"];
+                    a.href = "/post.html?id=" + element["id"];
                     a.innerText = element["title"];
                     li.appendChild(a);
                     ul.appendChild(li);

js/customElements/blogIndex.js

@@ -11,7 +11,7 @@ class BlogIndex extends HTMLElement {
                     <article class="breakWord">
                         <h2>${element["title"]}</h2>
                         <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>
                     `;
                 });

js/customElements/footer.js

+class Footer extends HTMLElement {
+    constructor() {
+        super();
+        this.innerHTML = `
+            <footer>
+                <div id="blueBar"></div>
+                <div id="footerContent">
+                    <div>
+                        <a href="/datenschutzerklaerung.php">Datenschutzerkl&auml;rung</a><br>
+                        <a href="/bildquellen.php">Bildquellen</a><br>
+                        <a href="/impressum.php">Impressum</a><br>
+                    </div>
+                    <div id="newestPost">
+                        <h3>Neueste Beitr&auml;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);
\ No newline at end of file

js/script.js

@@ -14,3 +14,4 @@ require("./customElements/newComment");
 require("./customElements/contactMailButton");
 require("./customElements/header");
 require("./customElements/mainMenu");
+require("./customElements/footer");
\ No newline at end of file

public/internal/footer.php

@@ -2,44 +2,7 @@
 function getFooter(){
     echo (<<<EOF
     </div>
-    <footer>
-    <div id="blueBar"></div>
-    <div id="footerContent">
-    <div>
-        <a href="/datenschutzerklaerung.php">Datenschutzerkl&auml;rung</a><br>
-        <a href="/bildquellen.php">Bildquellen</a><br>
-        <a href="/impressum.php">Impressum</a><br>
-    </div>
-    <div id="newestPost">
-        <h3>Neueste Beitr&auml;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>
+    <jl-footer></jl-footer>
     <script src="/js/script.js"></script>
     </body>
     </html>