fix(ui): apply dynamic z-index pattern to resolve searchable select dropdown overlap in user modals
This commit is contained in:
parent
4e65aca18e
commit
223fcddbc5
@ -159,7 +159,7 @@ $roleSelectConfig = [
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
@if(auth()->user()->isSystemAdmin())
|
@if(auth()->user()->isSystemAdmin())
|
||||||
<div class="space-y-2 relative z-30">
|
<div class="space-y-2 relative z-10 focus-within:z-30">
|
||||||
<label class="text-xs font-black text-slate-500 uppercase tracking-widest pl-1">{{ __('Affiliation') }}</label>
|
<label class="text-xs font-black text-slate-500 uppercase tracking-widest pl-1">{{ __('Affiliation') }}</label>
|
||||||
<x-searchable-select id="modal-account-company" name="company_id"
|
<x-searchable-select id="modal-account-company" name="company_id"
|
||||||
placeholder="{{ __('SYSTEM') }}" x-model="currentUser.company_id"
|
placeholder="{{ __('SYSTEM') }}" x-model="currentUser.company_id"
|
||||||
@ -171,7 +171,7 @@ $roleSelectConfig = [
|
|||||||
</div>
|
</div>
|
||||||
@endif
|
@endif
|
||||||
|
|
||||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 relative z-20">
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 relative z-10 focus-within:z-30">
|
||||||
<div class="space-y-2">
|
<div class="space-y-2">
|
||||||
<label class="text-xs font-black text-slate-500 uppercase tracking-widest pl-1">{{ __('Role') }} <span class="text-rose-500">*</span></label>
|
<label class="text-xs font-black text-slate-500 uppercase tracking-widest pl-1">{{ __('Role') }} <span class="text-rose-500">*</span></label>
|
||||||
<div id="role-select-wrapper" class="relative">{{-- Dynamic --}}</div>
|
<div id="role-select-wrapper" class="relative">{{-- Dynamic --}}</div>
|
||||||
|
|||||||
@ -96,7 +96,7 @@ $roleSelectConfig = [
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@if(auth()->user()->isSystemAdmin())
|
@if(auth()->user()->isSystemAdmin())
|
||||||
<div class="space-y-2 relative z-30">
|
<div class="space-y-2 relative z-10 focus-within:z-30">
|
||||||
<label class="text-xs font-black text-slate-500 uppercase tracking-widest pl-1">{{ __('Affiliation') }}</label>
|
<label class="text-xs font-black text-slate-500 uppercase tracking-widest pl-1">{{ __('Affiliation') }}</label>
|
||||||
<x-searchable-select id="modal-account-company" name="company_id" placeholder="{{ __('SYSTEM') }}" x-model="currentUser.company_id" @change="currentUser.company_id = $event.target.value; updateRoleSelect()">
|
<x-searchable-select id="modal-account-company" name="company_id" placeholder="{{ __('SYSTEM') }}" x-model="currentUser.company_id" @change="currentUser.company_id = $event.target.value; updateRoleSelect()">
|
||||||
@foreach($companies as $company)
|
@foreach($companies as $company)
|
||||||
@ -105,7 +105,7 @@ $roleSelectConfig = [
|
|||||||
</x-searchable-select>
|
</x-searchable-select>
|
||||||
</div>
|
</div>
|
||||||
@endif
|
@endif
|
||||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 relative z-20">
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6 relative z-10 focus-within:z-30">
|
||||||
<div class="space-y-2">
|
<div class="space-y-2">
|
||||||
<label class="text-xs font-black text-slate-500 uppercase tracking-widest pl-1">{{ __('Role') }} <span class="text-rose-500">*</span></label>
|
<label class="text-xs font-black text-slate-500 uppercase tracking-widest pl-1">{{ __('Role') }} <span class="text-rose-500">*</span></label>
|
||||||
<div id="role-select-wrapper" class="relative">{{-- Dynamic --}}</div>
|
<div id="role-select-wrapper" class="relative">{{-- Dynamic --}}</div>
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user