| 
<x-central.app-layout><x-slot name="header">
 <div class="flex items-center justify-between">
 <h2 class="font-semibold text-xl text-gray-800 leading-tight">
 {{ __('Role Details') }}
 </h2>
 <a href="{{ route('central.role.index') }}" class="no-underline font-medium text-gray-600 hover:text-gray-500">
 {{ __('Back') }}
 </a>
 </div>
 </x-slot>
 
 <div class="py-12">
 <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
 <div class="bg-white overflow-hidden shadow-md sm:rounded-lg">
 <dl>
 <div class="px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
 <dt class="text-sm font-medium text-gray-500">
 {{ __('ID') }}
 </dt>
 <dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
 {{ $role->id }}
 </dd>
 </div>
 <div class="px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
 <dt class="text-sm font-medium text-gray-500">
 {{ __('Name') }}
 </dt>
 <dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
 {{ $role->name }}
 </dd>
 </div>
 
 <div class="px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
 <dt class="text-sm font-medium text-gray-500">
 {{ __('Permissions') }}
 </dt>
 <dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
 <ul class="relative list-unstyled rounded-md flex flex-wrap">
 @include('central.backend.includes.permissions', ['permissions' => $permissions])
 </ul>
 </dd>
 </div>
 
 <div class="px-4 py-5 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6">
 <dt class="text-sm font-medium text-gray-500">
 {{ __('Additional Permissions') }}
 </dt>
 <dd class="mt-1 text-sm text-gray-900 sm:mt-0 sm:col-span-2">
 <ul class="relative list-unstyled rounded-md flex flex-wrap">
 @include('central.backend.includes.permissions', ['permissions' => $general_permissions])
 </ul>
 </dd>
 </div>
 </dl>
 </div>
 </div>
 </div>
 </x-central.app-layout>
 
 |