タグ一覧画面を追加

resources/assets/sass/app.scss

@@ -13,3 +13,6 @@ $primary: #e53fb1;
 // Components
 @import "components/ejaculation";
 @import "components/link-card";
+
+// Tag
+@import "tag/index";

resources/assets/sass/tag/_index.scss

@@ -0,0 +1,22 @@
+.tags {
+  & > .btn-tag {
+    width: 100%;
+
+    .tag-name {
+      display: inline-block;
+      max-width: 80%;
+      overflow: hidden;
+      line-height: 40px;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      vertical-align: middle;
+    }
+
+    .checkins-count {
+      display: inline-block;
+      line-height: 40px;
+      white-space: nowrap;
+      vertical-align: middle;
+    }
+  }
+}

resources/views/layouts/base.blade.php

@@ -79,6 +79,9 @@
                         <li class="nav-item {{ stripos(Route::currentRouteName(), 'user.okazu') === 0 ? 'active' : ''}}">
                             <a class="nav-link" href="{{ route('user.okazu', ['name' => Auth::user()->name]) }}">オカズ</a>
                         </li>
+                        <li class="nav-item {{ stripos(Route::currentRouteName(), 'tag') === 0 ? 'active' : ''}}">
+                            <a class="nav-link" href="{{ route('tag') }}">タグ一覧</a>
+                        </li>
                         {{--<li class="nav-item">
                             <a class="nav-link" href="{{ route('ranking') }}">ランキング</a>
                         </li>--}}

resources/views/tag/index.blade.php

@@ -0,0 +1,20 @@
+@extends('layouts.base')
+
+@section('title', 'タグ一覧')
+
+@section('content')
+    <div class="container pb-1">
+        <h2 class="mb-3">タグ一覧</h2>
+        <p class="text-secondary">公開チェックインに付けられているタグを、チェックイン数の多い順で表示しています。</p>
+    </div>
+    <div class="container-fluid">
+        <div class="row mx-1">
+            @foreach($tags as $tag)
+                <div class="col-12 col-lg-6 col-xl-3 py-3 text-break tags">
+                    <a href="{{ route('search', ['q' => $tag->name]) }}" class="btn btn-outline-primary btn-tag" title="{{ $tag->name }}"><span class="tag-name">{{ $tag->name }}</span> <span class="checkins-count">({{ $tag->checkins_count }})</span></a>
+                </div>
+            @endforeach
+        </div>
+        {{ $tags->links(null, ['className' => 'mt-4 justify-content-center']) }}
+    </div>
+@endsection