New navbar implemented

Leo_Girbig · Leo_Girbig · commit d639bd3f5e37 · 2020-05-03T18:24:41.000+02:00
diff --git a/_config.yml b/_config.yml
@@ -35,6 +35,7 @@ plugins:
 
 sass:
   style: compressed
+  sass_dir: _sass
 
 font-awesome:
   assets: true
diff --git a/_includes/navbar.html b/_includes/navbar.html
@@ -1,23 +1,28 @@
 <nav class="navbar navbar-expand-lg fixed-top border-bottom">
-<div class="container-fluid justify-content-center">
+  <div class="navbar-header flex-grow-1">
+    <a href="index.html">
+      <img class="navbar-brand page-scroll navbar-logo" src="img/techAachen_Logo.svg" alt="TechAachen Logo" title="TechAachen Logo">
+    </a>
+    <a class="navbar-brand page-scroll" href="index.html">{{ site.title }}</a>
+
+    <button class="navbar-toggler ml-auto" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
+      <span class="navbar-toggler-icon"></span>
+    </button>
+  </div>
+  <div class="justify-content-center">
     <div class="navbar-header">
-      <a href="index.html">
-        <img class="navbar-brand page-scroll navbar-logo" src="img/techAachen_Logo.svg" alt="TechAachen Logo" title="TechAachen Logo">
-      </a>
-      <a class="navbar-brand page-scroll" href="index.html">{{ site.title }}</a>
-      <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
-        <span class="navbar-toggler-icon"></span>
-      </button>
+
+
     </div>
 
 
-<!-- Conntent of Collapse -->
+    <!-- Conntent of Collapse -->
     <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
       <div class="nav navbar-nav navbar-right">
         <a class="nav-item nav-link" href="aboutus.html">Über uns & die Vereine</a>
         <a class="nav-item nav-link" href="index.html#projects">Projekte</a>
         <a class="nav-item nav-link aktive" href="contact.html">Kontakt</a>
       </div>
     </div>
-</div>
+  </div>
 </nav>
diff --git a/_includes/scripts.html b/_includes/scripts.html
@@ -5,7 +5,7 @@
 
 <!-- Enables Popovers
       Needs alot of change to do it right -->
-<script>$(function(){
+ <script>$(function(){
     // Enables popover
     $("[data-toggle=popover]").popover({
       container: 'body'
diff --git a/_layouts/aboutuspage.html b/_layouts/aboutuspage.html
@@ -5,7 +5,7 @@
 
 <body id="page-top" class="bg-light">
 
-  {% include nav-page.html %}
+  {% include navbar.html %}
 
   <div class="container pt-5">
     <section id="aboutus" class="pb-0">
diff --git a/_layouts/front.html b/_layouts/front.html
@@ -5,7 +5,7 @@
 
 <body id="page-top">
 
-  {% include nav-front.html %}
+  {% include navbar.html %}
   {% include header.html %}
   <!-- style="background-color: white; transform: translate(0px, -230px);" -->
   <div class="container">
diff --git a/_layouts/paperwork.html b/_layouts/paperwork.html
@@ -5,7 +5,7 @@
 
 <body id="page-top" class="bg-light">
 
-{% include nav-page.html %}
+{% include navbar.html %}
 
   <section id="content">
     <div class="container">
diff --git a/_sass/_navbar-old.scss b/_sass/_navbar-old.scss
diff --git a/_sass/navbar.scss b/_sass/navbar.scss
@@ -11,8 +11,8 @@
       color: $theme-darkgrey;
 }
   .navbar-logo {
-      padding-top: 5px;
-      padding-bottom: 10px;
-      width: 5%;
+      // padding-top: 5px;
+      // padding-bottom: 10px;
+      width: 3rem;
   }
 }

Original file line number	Diff line number	Diff line change
`@@ -11,8 +11,8 @@`
`11`	`11`	`color: $theme-darkgrey;`
`12`	`12`	`}`
`13`	`13`	`.navbar-logo {`
`14`		`- padding-top: 5px;`
`15`		`- padding-bottom: 10px;`
`16`		`- width: 5%;`
	`14`	`+ // padding-top: 5px;`
	`15`	`+ // padding-bottom: 10px;`
	`16`	`+ width: 3rem;`
`17`	`17`	`}`
`18`	`18`	`}`