_includes/components/navbeforeafter.html in chulapa-jekyll-1.0.1 vs _includes/components/navbeforeafter.html in chulapa-jekyll-1.1.0

@@ -4,19 +4,38 @@
 {%- endif -%}
 {%- assign classitemprevious = "invisible" -%}
 {%- if page.previous.url -%}
  {%- assign classitemprevious = "" -%}
 {%- endif -%}
+{%- assign titleitemprevious = page.previous.title | strip_html  | truncate: 30  -%}
+{%- assign titleitemnext = page.next.title | strip_html  | truncate: 30  -%}
 
+
+
 <nav aria-label="Navigation" class="container-lg chulapa-pagination  ">
   <ul class="col-lg-8 offset-lg-2 pagination chulapa-pagination-round px-0 ">
-    <li class="page-item text-left mr-auto {{ classitemprevious -}}">
-      <a class="page-link border-0 px-4" href="{{ page.previous.url | absolute_url }}" tabindex="-1">
+    <li class="page-item text-left mr-0 {{ classitemprevious -}}">
+      <a class="page-link border-0 px-4" href="{{ page.previous.url | absolute_url | default: "#" }}" tabindex="-1">
 	  <i class="fa fa-chevron-left" aria-hidden="true"></i><span class="sr-only">Previous</span>
 	  </a>
     </li>
-    <li class="page-item text-right ml-auto {{ classitemnext -}}">
-      <a class="page-link border-0 px-4" href="{{ page.next.url | absolute_url }}">
+    <li class="page-item border-0 disabled text-left ml-0 mr-auto d-none d-md-inline {{ classitemprevious -}}">
+      <p class="page-link chulapa-label">{{ titleitemprevious }}</p>
+    </li>
+    <li class="page-item border-0 disabled text-left ml-0 mr-auto d-none d-sm-inline d-md-none {{ classitemprevious -}}">
+      <p class="page-link chulapa-label">{{ titleitemprevious | truncate: 17 }}</p>
+    </li>
+	  <li class="page-item disabled mx-auto invisible">
+	   <p class="page-link">|</p>
+	  </li>	
+	  <li class="page-item border-0 disabled text-right mr-0 ml-auto d-none d-sm-inline d-md-none {{ classitemnext -}}">
+	    <p class="page-link chulapa-label">{{ titleitemnext | truncate: 17 }}</p>
+	  </li>
+	  <li class="page-item border-0 disabled text-right mr-0 ml-auto d-none d-md-inline {{ classitemnext -}}">
+	    <p class="page-link chulapa-label">{{ titleitemnext }}</p>
+	  </li>
+    <li class="page-item text-right ml-0 {{ classitemnext -}}">
+      <a class="page-link border-0 px-4" href="{{ page.next.url | absolute_url | default: "#" }}">
 	  <i class="fa fa-chevron-right" aria-hidden="true"></i><span class="sr-only">Next</span></a>
     </li>
   </ul>
 </nav>