footer component adjusted.

Frontend/src/app/components/bottom-bar/bottom-bar.component.html

@@ -1,26 +1,31 @@
-<div class="bottom-bar-wrapper">
-    <div class="folge-uns-item">
-        <p><span id="folge">FOLGE</span><span id="uns">UNS</span></p>
-    </div>
-    <div class="link-items">
-        <ul style="list-style-type:none" class="footer-links">
-            <li><a href="https://github.com/Mueller-Patrick/Betterzon">GiT</a></li>
-            <li><a href="https://blog.betterzon.xyz/">BLOG</a></li>
-            <li><a href="https://github.com/Mueller-Patrick/Betterzon/wiki">Wiki</a></li>
-        </ul>
-    </div>
-    <div id="footer-line">
+<footer class="footer text-center">
+    <div class="container">
+        <div class="row">
+            <!-- Footer Location-->
+            <div class="col-lg-4 mb-5 mb-lg-0">
+                <h4 class="text-uppercase mb-4">Location</h4>
+                <p class="lead mb-0">
+                    70376 Stuttgart
+                    <br />
 
+                </p>
+            </div>
+            <!-- Footer Social Icons-->
+            <div class="col-lg-4 mb-5 mb-lg-0">
+                <h4 class="text-uppercase mb-4">FOLGE UNS</h4>
+                <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-github"></i></a>
+                <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-twitter"></i></a>
+                <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-linkedin-in"></i></a>
+                <a class="btn btn-outline-light btn-social mx-1" href="#!"><i class="fab fa-fw fa-dribbble"></i></a>
+            </div>
+            <!-- Footer About Text-->
+            <div class="col-lg-4">
+                <h4 class="text-uppercase mb-4">SOME INFO</h4>
+                <p class="lead mb-0">
+                    text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries
+                </p>
+            </div>
+        </div>
     </div>
-    <div class="bottom-logo">
-        <p><span id="better">BETTER</span><span id="zon">ZON</span></p>
-    </div>
-    <div class="bottom-info">
-        <ul style="list-style-type:none" class="footer-links">
-            <li><a>DATENSCHUTZERKLÄRUNG</a></li>
-            <li><a>IMPRESSUM</a></li>
-        </ul>
-    </div>
-</div>
-
+</footer>