Nav arrow reposition and post image

_includes/menu-header.html → _includes/menu-nav.html

@@ -3,9 +3,6 @@
 <li class="nav-item">
     <a class="nav-link" href="{{site.baseurl}}/index.html">Home</a>
 </li>
-<!-- <li class="nav-item">
-    <a class="nav-link" href="{{site.baseurl}}/contact.html">Contact</a>
-</li> -->
 <li class="nav-item">
     <a class="nav-link" href="{{site.baseurl}}/about"><span class="align-middle">About</span></a>
 </li>

_includes/menu-social.html

@@ -4,4 +4,3 @@
 
 <li class="d-inline-block ml-1 mr-1"><a target="_blank" href="https://www.linkedin.com/in/marc-morcos" class="nav-link">LinkedIn <i class="fab fa-linkedin"></i></a></li>
 
-</li>

_includes/nav-arrows.html

@@ -0,0 +1,7 @@
+<!-- Go to next/previous post -->
+{% if page.next.url %}
+    <a class="prev" style="float: left;" href="{{site.baseurl}}{{page.next.url}}"><i class="fa fa-arrow-circle-left text-muted post-navigation-arrow"></i> </a>
+{% endif %}
+{% if page.previous.url %}
+    <a class="next" style="float: right;" href="{{site.baseurl}}{{page.previous.url}}"><i class="fa fa-arrow-circle-right text-muted post-navigation-arrow"></i></a>
+{% endif %}

_layouts/default.html

@@ -31,7 +31,7 @@
     </button>
     <div class="collapse navbar-collapse" id="navbarsDefault">        
     	<ul class="navbar-nav ml-auto align-items-center">
-    		{% include menu-header.html %}
+    		{% include menu-nav.html %}
         {% include menu-social.html %}
     	</ul>
     </div>
@@ -43,13 +43,11 @@
 
     <footer class="footer pt-5 pb-5 text-center">        
     <div class="container">        
-          <div class="socials-media">    
-            <ul class="list-unstyled">
-              {% include menu-header.html %}
-              {% include menu-social.html %}
-            </ul>    
-          </div>
-          {% include footer-copyright.html %}
+        <ul class="list-unstyled">
+          {% include menu-nav.html %}
+          {% include menu-social.html %}
+        </ul>
+        {% include footer-copyright.html %}
         </div>
     </footer>
 

_layouts/post.html

@@ -1,11 +1,15 @@
 ---
 layout: default
 ---
-<section >    
+<section >  
+    <div>
+      {% include nav-arrows.html %}
+    </div>  
     	<div class="row justify-content-center">
     		<div class="side-margin">
 
     			<article class="card">
+
 
     			<div class="card-body">
 
@@ -41,15 +45,9 @@ <h1 class="display-4">
 
     			</article>
 
-                <div class="PageNavigation dissapear-narrow">
-                  {% if page.next.url %}
-                    <a class="prev" href="{{site.baseurl}}{{page.next.url}}"><i class="fa fa-angle-left"></i> </a>
-                  {% endif %}
-                  {% if page.previous.url %}
-                    <a class="next" href="{{site.baseurl}}{{page.previous.url}}"><i class="fa fa-angle-right"></i></a>
-                  {% endif %}
-                </div>
-
     		</div>
     </div>
+    <div>
+      {% include nav-arrows.html %}
+    </div>
 </section>

_posts/realtime-ai-verbal-conversation-assistant-capstone/2024-05-21-realtime-ai-verbal-conversation-assistant-capstone.md

@@ -3,7 +3,7 @@ title: "Realtime AI Verbal Conversation Assistant - Capstone"
 date: "2024-05-21"
 metadate: "hide"
 categories: [ Portfolio ]
-image: "/assets/images/posts/realtime-ai-verbal-conversation-assistant-capstone/logonobackground.png"
+image: "/assets/images/posts/realtime-ai-verbal-conversation-assistant-capstone/cover.png"
 layout: post
 ---
 

assets/css/custom.css

@@ -37,10 +37,9 @@
   }
 }
 
-@media (max-width: 1000px) {
-  .dissapear-narrow {
-    display: none !important;
-  }
+.post-navigation-arrow{
+  font-size: 50px;
+  margin-top: 3rem;
 }
 
 /* Remove bullet points and margin/padding from the list */