Skip to content

Commit b2ceb46

Browse files
committed
Fixed index page mobile alignment issues
1 parent 2d8c54c commit b2ceb46

File tree

4 files changed

+74
-64
lines changed

4 files changed

+74
-64
lines changed

resources/views/admin/includes/sort-link.blade.php

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -10,14 +10,18 @@
1010
$down_fill = 'black';
1111
}
1212
@endphp
13+
<div class="flex items-center gap-4">
1314
@if (request()->query('sort') == $attribute)
1415
<a href="{{request()->fullUrlWithQuery(['sort' => '-'.$attribute])}}" class="no-underline hover:underline text-cyan-600 dark:text-cyan-400">{{ __($label) }}</a>
1516
@else
1617
<a href="{{request()->fullUrlWithQuery(['sort' => $attribute])}}" class="no-underline hover:underline text-cyan-600 dark:text-cyan-400">{{ __($label) }}</a>
1718
@endif
18-
<svg class="inline-block" xmlns="http://www.w3.org/2000/svg" width="15px" height="15px" viewBox="0 0 15 15" fill="none">
19-
<path d="M7.5 3L15 11H0L7.5 3Z" fill="{{$up_fill}}"/>
20-
</svg>
21-
<svg class="inline-block" xmlns="http://www.w3.org/2000/svg" width="15px" height="15px" viewBox="0 0 15 15" fill="none">
22-
<path d="M7.49988 12L-0.00012207 4L14.9999 4L7.49988 12Z" fill="{{$down_fill}}"/>
23-
</svg>
19+
<div class="flex flex-col">
20+
<svg class="inline-block" xmlns="http://www.w3.org/2000/svg" width="15px" height="15px" viewBox="0 0 15 15" fill="none">
21+
<path d="M7.5 3L15 11H0L7.5 3Z" fill="{{$up_fill}}"/>
22+
</svg>
23+
<svg class="inline-block" xmlns="http://www.w3.org/2000/svg" width="15px" height="15px" viewBox="0 0 15 15" fill="none">
24+
<path d="M7.49988 12L-0.00012207 4L14.9999 4L7.49988 12Z" fill="{{$down_fill}}"/>
25+
</svg>
26+
</div>
27+
</div>

resources/views/admin/permission/index.blade.php

Lines changed: 20 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -21,10 +21,10 @@
2121
{{ session()->get('message') }}
2222
</div>
2323
@endif
24-
<div class="min-w-full border-b border-gray-200 shadow">
24+
<div class="min-w-full border-b border-gray-200 shadow overflow-x-auto">
2525
<form method="GET" action="{{ route('permission.index') }}">
2626
<div class="py-2 flex">
27-
<div class="overflow-hidden flex pl-4">
27+
<div class="flex pl-2">
2828
<input type="search" name="search" value="{{ request()->input('search') }}" class="rounded-md shadow-sm border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50" placeholder="Search">
2929
<button type='submit' class='ml-4 inline-flex items-center px-4 py-2 bg-gray-800 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-gray-700 active:bg-gray-900 focus:outline-none focus:border-gray-900 focus:ring ring-gray-300 disabled:opacity-25 transition ease-in-out duration-150'>
3030
{{ __('Search') }}
@@ -35,11 +35,11 @@
3535
<table class="border-collapse table-auto w-full text-sm">
3636
<thead>
3737
<tr>
38-
<th class="py-4 px-6 bg-grey-lightest font-bold uppercase text-sm text-grey-dark border-b border-grey-light text-left">
38+
<th class="py-4 px-4 bg-grey-lightest font-bold uppercase text-sm text-grey-dark border-b border-grey-light text-left">
3939
@include('admin.includes.sort-link', ['label' => 'Name', 'attribute' => 'name'])
4040
</th>
4141
@canany(['permission edit', 'permission delete'])
42-
<th class="py-4 px-6 bg-grey-lightest font-bold uppercase text-sm text-grey-dark border-b border-grey-light text-left">
42+
<th class="py-4 px-4 bg-grey-lightest font-bold uppercase text-sm text-grey-dark border-b border-grey-light text-left">
4343
{{ __('Actions') }}
4444
</th>
4545
@endcanany
@@ -49,27 +49,29 @@
4949
<tbody class="bg-white dark:bg-slate-800">
5050
@foreach($permissions as $permission)
5151
<tr>
52-
<td class="border-b border-slate-100 dark:border-slate-700 p-4 pl-8 text-slate-500 dark:text-slate-400">
52+
<td class="border-b border-slate-100 dark:border-slate-700 p-4 text-slate-500 dark:text-slate-400">
5353
<div class="text-sm text-gray-900">
5454
<a href="{{route('permission.show', $permission->id)}}" class="no-underline hover:underline text-cyan-600 dark:text-cyan-400">{{ $permission->name }}</a>
5555
</div>
5656
</td>
5757
@canany(['permission edit', 'permission delete'])
58-
<td class="border-b border-slate-100 dark:border-slate-700 p-4 pl-8 text-slate-500 dark:text-slate-400">
58+
<td class="border-b border-slate-100 dark:border-slate-700 p-4 text-slate-500 dark:text-slate-400">
5959
<form action="{{ route('permission.destroy', $permission->id) }}" method="POST">
60-
@can('permission edit')
61-
<a href="{{route('permission.edit', $permission->id)}}" class="px-4 py-2 text-white mr-4 bg-blue-600">
62-
{{ __('Edit') }}
63-
</a>
64-
@endcan
60+
<div class="flex">
61+
@can('permission edit')
62+
<a href="{{route('permission.edit', $permission->id)}}" class="px-4 py-2 text-white mr-4 bg-blue-600">
63+
{{ __('Edit') }}
64+
</a>
65+
@endcan
6566

66-
@can('permission delete')
67-
@csrf
68-
@method('DELETE')
69-
<button class="px-4 py-2 text-white bg-red-600">
70-
{{ __('Delete') }}
71-
</button>
72-
@endcan
67+
@can('permission delete')
68+
@csrf
69+
@method('DELETE')
70+
<button class="px-4 py-2 text-white bg-red-600">
71+
{{ __('Delete') }}
72+
</button>
73+
@endcan
74+
</div>
7375
</form>
7476
</td>
7577
@endcanany

resources/views/admin/role/index.blade.php

Lines changed: 20 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -21,10 +21,10 @@
2121
{{ session()->get('message') }}
2222
</div>
2323
@endif
24-
<div class="min-w-full border-b border-gray-200 shadow">
24+
<div class="min-w-full border-b border-gray-200 shadow overflow-x-auto">
2525
<form method="GET" action="{{ route('role.index') }}">
2626
<div class="py-2 flex">
27-
<div class="overflow-hidden flex pl-4">
27+
<div class="flex pl-2">
2828
<input type="search" name="search" value="{{ request()->input('search') }}" class="rounded-md shadow-sm border-gray-300 focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50" placeholder="Search">
2929
<button type='submit' class='ml-4 inline-flex items-center px-4 py-2 bg-gray-800 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-gray-700 active:bg-gray-900 focus:outline-none focus:border-gray-900 focus:ring ring-gray-300 disabled:opacity-25 transition ease-in-out duration-150'>
3030
{{ __('Search') }}
@@ -35,11 +35,11 @@
3535
<table class="border-collapse table-auto w-full text-sm">
3636
<thead>
3737
<tr>
38-
<th class="py-4 px-6 bg-grey-lightest font-bold uppercase text-sm text-grey-dark border-b border-grey-light text-left">
38+
<th class="py-4 px-4 bg-grey-lightest font-bold uppercase text-sm text-grey-dark border-b border-grey-light text-left">
3939
@include('admin.includes.sort-link', ['label' => 'Name', 'attribute' => 'name'])
4040
</th>
4141
@canany(['role edit', 'role delete'])
42-
<th class="py-4 px-6 bg-grey-lightest font-bold uppercase text-sm text-grey-dark border-b border-grey-light text-left">
42+
<th class="py-4 px-4 bg-grey-lightest font-bold uppercase text-sm text-grey-dark border-b border-grey-light text-left">
4343
{{ __('Actions') }}
4444
</th>
4545
@endcanany
@@ -49,27 +49,29 @@
4949
<tbody class="bg-white dark:bg-slate-800">
5050
@foreach($roles as $role)
5151
<tr>
52-
<td class="border-b border-slate-100 dark:border-slate-700 p-4 pl-8 text-slate-500 dark:text-slate-400">
52+
<td class="border-b border-slate-100 dark:border-slate-700 p-4 text-slate-500 dark:text-slate-400">
5353
<div class="text-sm text-gray-900">
5454
<a href="{{route('role.show', $role->id)}}" class="no-underline hover:underline text-cyan-600 dark:text-cyan-400">{{ $role->name }}</a>
5555
</div>
5656
</td>
5757
@canany(['role edit', 'role delete'])
58-
<td class="border-b border-slate-100 dark:border-slate-700 p-4 pl-8 text-slate-500 dark:text-slate-400">
58+
<td class="border-b border-slate-100 dark:border-slate-700 p-4 text-slate-500 dark:text-slate-400">
5959
<form action="{{ route('role.destroy', $role->id) }}" method="POST">
60-
@can('role edit')
61-
<a href="{{route('role.edit', $role->id)}}" class="px-4 py-2 text-white mr-4 bg-blue-600">
62-
{{ __('Edit') }}
63-
</a>
64-
@endcan
60+
<div class="flex">
61+
@can('role edit')
62+
<a href="{{route('role.edit', $role->id)}}" class="px-4 py-2 text-white mr-4 bg-blue-600">
63+
{{ __('Edit') }}
64+
</a>
65+
@endcan
6566

66-
@can('role delete')
67-
@csrf
68-
@method('DELETE')
69-
<button class="px-4 py-2 text-white bg-red-600">
70-
{{ __('Delete') }}
71-
</button>
72-
@endcan
67+
@can('role delete')
68+
@csrf
69+
@method('DELETE')
70+
<button class="px-4 py-2 text-white bg-red-600">
71+
{{ __('Delete') }}
72+
</button>
73+
@endcan
74+
</div>
7375
</form>
7476
</td>
7577
@endcanany

0 commit comments

Comments
 (0)