Cleaning up the topics page.

1 files changed, 31 insertions, 4 deletions

diff --git a/resources/views/topicindex.blade.php b/resources/views/topicindex.blade.php
index 8ef2114..7de3042 100644
--- a/resources/views/topicindex.blade.php
+++ b/resources/views/topicindex.blade.php
@@ -6,13 +6,40 @@ html {
 }
 @endsection
 
-@section('content')
+@section ('content')
 
 <div class="text-center container">
+
+<div class="container row text-white text-lg">
+	<ul class="list-inline">
+	@foreach ($letters as $letter)
+		<li class="list-inline-item">
+		<a href="#{{$letter->name}}" class="text-white">{{$letter->name}}</a>
+		</li>
+	@endforeach
+	</ul>
+</div>
+
+@php ($curLetter = "")
 @foreach ($topics->get() as $topic)
-      @if ( "" != $topic->name )
-      <a href="{{ route('topic', $topic->name) }}" class="btn btn-lg btn-outline-primary">{{ ucwords($topic->name) }}</a>
-      @endif
+	@if ( "" != $topic->name )
+		@php ( $firstLetter = strtoupper(substr($topic->name, 0, 1)) )
+		@if ( $curLetter != $firstLetter )
+			<div class="container row">
+				<h2 id="{{$firstLetter}}">
+					<a class="text-white" href="#{{$firstLetter}}">
+					{{ $firstLetter }}
+					</a>
+				</h2>
+			</div>
+			<hr>
+
+			@php ($curLetter = $firstLetter)
+
+		@endif
+		<a href="{{ route('topic', $topic->name) }}" class="btn btn-lg btn-outline-primary">{{ ucwords($topic->name) }}</a>
+	@endif
 @endforeach
+
 </div>
 @endsection