oskarb/beerable
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Reponsive table

Browse Source
This commit is contained in:
Oskar-Mikael
2021-09-05 17:24:29 +02:00
parent 84be59bc91
commit b2675d7c30
2 changed files with 58 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
resources/views/layouts/app.blade.php
View File

@@ -74,7 +74,7 @@
</div> </div>
</nav> </nav>
<main class="py-4 container mx-auto"> <main class="py-4 container mx-auto px-4 md:px-0">
@yield('content') @yield('content')
</main> </main>
</div> </div>

109
resources/views/list/show.blade.php
View File

@@ -31,59 +31,64 @@
Add Beer Add Beer
</button> </button>
</form> </form>
<table class="mx-auto border-2 border-black text-center my-10"> <div class="overflow-x-auto">
<tr class="border-black border-2 text-xl"> <table style="border-spacing:0" class="mx-auto border-collapse w-full border-2 border-black text-center my-10">
<th class="border-black border-r-2 px-4"> <tr class="border-black border-2 text-xl">
@sortablelink('beer') <th class="border-black border-r-2 px-4 w-1/4">
<img class="w-4 float-right mt-2" src="https://www.shareicon.net/data/2015/11/07/668285_arrows_512x512.png"/> @sortablelink('beer')
</th> <img class="w-4 float-right mt-2"
<th class="border-black border-r-2 px-4"> src="https://www.shareicon.net/data/2015/11/07/668285_arrows_512x512.png" />
@sortablelink('rating') </th>
<img class="w-4 float-right mt-2" src="https://www.shareicon.net/data/2015/11/07/668285_arrows_512x512.png"/> <th class="border-black border-r-2 px-4">
</th> @sortablelink('rating')
<th class="border-black border-r-2 px-4"> <img class="w-4 float-right mt-2"
@sortablelink('country') src="https://www.shareicon.net/data/2015/11/07/668285_arrows_512x512.png" />
<img class="w-4 float-right mt-2" src="https://www.shareicon.net/data/2015/11/07/668285_arrows_512x512.png"/> </th>
</th> <th class="border-black border-r-2 px-4">
<th class="border-black border-r-2 px-4"> @sortablelink('country')
@sortablelink('type') <img class="w-4 float-right mt-2"
<img class="w-4 float-right mt-2" src="https://www.shareicon.net/data/2015/11/07/668285_arrows_512x512.png"/> src="https://www.shareicon.net/data/2015/11/07/668285_arrows_512x512.png" />
</th> </th>
</tr> <th class="border-black border-r-2 px-4">
@foreach ($listBeers as $beer) @sortablelink('type')
<tr class="border-black border-2 text-lg"> <img class="w-4 float-right mt-2"
<td class="border-black border-r-2 px-4 underline hover:no-underline"> src="https://www.shareicon.net/data/2015/11/07/668285_arrows_512x512.png" />
<a href="{{ route('beer.show', $beer->id) }}"> </th>
{{ $beer->beer }}
</a>
</td>
<td class="border-black border-r-2 px-4">
{{ $beer->rating }}
</td>
<td class="border-black border-r-2 px-4">
{{ $beer->country }}
</td>
<td class="border-black border-r-2 px-4">
{{ $beer->type }}
</td>
<td class="border-black border-r-2 px-4 bg-blue-700">
<a href="{{ route('beer.edit', $beer->id) }}">
Edit
</a>
</td>
<td class="border-black border-r-2 px-4 bg-red-700">
<form method="POST" action="{{ route('list.removeitem', $list->id) }}">
@csrf
@method('DELETE')
<input name="beer" hidden value="{{ $beer->id }}" />
<button onclick="return confirm('Are you sure?')" type="submit">
Remove
</button>
</td>
</tr> </tr>
@endforeach @foreach ($listBeers as $beer)
</table> <tr class="border-black border-2 text-lg">
<td class="border-black border-r-2 px-4 underline hover:no-underline">
<a href="{{ route('beer.show', $beer->id) }}">
{{ $beer->beer }}
</a>
</td>
<td class="border-black border-r-2 px-4">
{{ $beer->rating }}
</td>
<td class="border-black border-r-2 px-4">
{{ $beer->country }}
</td>
<td class="border-black border-r-2 px-4">
{{ $beer->type }}
</td>
<td class="border-black border-r-2 px-4 bg-blue-700">
<a href="{{ route('beer.edit', $beer->id) }}">
Edit
</a>
</td>
<td class="border-black border-r-2 px-4 bg-red-700">
<form method="POST" action="{{ route('list.removeitem', $list->id) }}">
@csrf
@method('DELETE')
<input name="beer" hidden value="{{ $beer->id }}" />
<button onclick="return confirm('Are you sure?')" type="submit">
Remove
</button>
</td>
</tr>
@endforeach
</table>
</div>
@if (session()->has('success')) @if (session()->has('success'))
<p class="text-green-400 my-4">{{ Session::get('success') }}</p> <p class="text-green-400 my-4">{{ Session::get('success') }}</p>