Added FooterComponent and updated various UI elements

Introduced a new FooterComponent and integrated it into the application. Adjusted home page layout and refined styles for better consistency, including minor restructuring of CSS rules and HTML elements.

frontend/src/app/home/home.component.html

@@ -17,7 +17,9 @@
       <!--      TODO load player count from old api or backend?-->
       <h2 style="color: white;"><span class="player-count">Loading...</span></h2>
       <h2 style="color: white;">Server IP: play.alttd.com</h2>
-      <app-copy-ip></app-copy-ip>
+      <div style="padding-top: 35px;">
+        <app-copy-ip></app-copy-ip>
+      </div>
     </section>
     <section class="darkmodeSection">
       <div class="container">
@@ -66,8 +68,8 @@
     </section>
     <section id="section2">
       <div class="customContainer">
-        <h2 style="color: white; padding-bottom: 35px; font-size:2.8em">Survival Shaped by You</h2>
-        <p style="color: white; padding-bottom: 35px; margin: auto; font-size: 1.1em;">Altitude is built by the
+        <h2 style="color: white; padding-bottom: 35px; font-size: 2.8em;">Survival Shaped by You</h2>
+        <p style="color: white; padding-bottom: 35px; font-size: 1.1em; margin: auto;">Altitude is built by the
           community, for the community. We've added features requested by our members and several custom plugins to
           create our "perfect" survival experience.</p>
         <div class="survivalShapedContainerPlugins">
@@ -106,6 +108,9 @@
     </section>
     <section class="removemobile darkmodeSection">
       <div class="customContainer">
+        <h2 style="padding-bottom: 35px; font-size: 2.8em;">Community Builds</h2>
+        <p style="padding-bottom: 35px; font-size: 1.1em; margin: auto;">Have a look at some of the incredible builds
+          made by the community. something more? idk placeholder placeholder</p>
         <div class="sliderWrapper">
           <div class="sliderContent">
             <div class="indexSlider">
@@ -136,7 +141,7 @@
       <div class="customContainer">
         <img ngSrc="/public/img/logos/log.png" alt="Alternative Altitude Server Logo" height="129"
              width="120">
-        <h2 style="margin: 20px 0; font-size: 1.8em;">play.alttd.com</h2>
+        <h2 style="margin: 20px 0; font-size: 1.8em; padding-bottom: 0 !important;">play.alttd.com</h2>
         <app-copy-ip></app-copy-ip>
       </div>
     </section>
@@ -145,4 +150,5 @@
       <p style="display: none;">Scroll Down</p>
     </a>
   </main>
+  <app-footer></app-footer>
 </ng-container>