Remove deprecated classes from Tailwind template; add interaction styles

Author: shengslogar

resources/views/tailwind.blade.php

@@ -1,18 +1,26 @@
 @unless ($breadcrumbs->isEmpty())
 
-    <nav class="container-fluid px-1">
-        <ol class="list-reset py-4 pl-4 rounded flex bg-gray-300 text-gray-800">
+    <nav class="container mx-auto">
+        <ol class="p-4 rounded flex flex-wrap bg-gray-300 text-sm text-gray-800">
             @foreach ($breadcrumbs as $breadcrumb)
 
                 @if ($breadcrumb->url && !$loop->last)
-                    <li class="px-2">
-                        <a href="{{ $breadcrumb->url }}" class="no-underline text-blue-600">{{ $breadcrumb->title }}</a>
+                    <li>
+                        <a href="{{ $breadcrumb->url }}"
+                           class="text-blue-600 hover:text-blue-900 hover:underline focus:text-blue-900 focus:underline">
+                            {{ $breadcrumb->title }}
+                        </a>
                     </li>
                 @else
-                    <li class="px-2">{{ $breadcrumb->title }}</li>
+                    <li>
+                        {{ $breadcrumb->title }}
+                    </li>
                 @endif
-                @if(!$loop->last)
-                    <li class="text-gray-500">/</li>
+
+                @unless($loop->last)
+                    <li class="text-gray-500 px-2">
+                        /
+                    </li>
                 @endif
 
             @endforeach