Joseph.Rawlings/Virtnet.bond
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

fix: correct escaped quotes in modal backdrop and match server list icon style

Browse Source 
- Fixed escaped quotes in Alpine.js directives that were breaking the modal
- Changed icon button styling to match server list (bg-secondary/10 p-2 rounded-lg)
- Use x-dynamic-component for custom icons, x-ri-server-line for default
- Properly format all x-transition and @click attributes
This commit is contained in:
Joseph.Rawlings
2025-12-06 09:23:19 -05:00
parent 374713faa6
commit ecd2e3fccd
1 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
extensions/Servers/Proxmox/views/components/layout.blade.php
View File

@@ -50,16 +50,16 @@
<!-- Server Icon -->
<button
wire:click="openIconModal"
class="flex-shrink-0 size-10 rounded-lg bg-background-secondary border border-neutral hover:border-primary/50 hover:bg-background-secondary/80 transition-all duration-200 flex items-center justify-center group"
class="bg-secondary/10 p-2 rounded-lg hover:bg-secondary/20 transition-colors cursor-pointer"
title="Click to customize server icon"
>
@if($server->user_set_icon)
@php
$iconStyle = $server->user_set_icon_color ? 'color: ' . $server->user_set_icon_color : '';
$iconColor = $server->user_set_icon_color ?: 'currentColor';
@endphp
<i class="ri-{{ $server->user_set_icon }} text-xl transition-transform group-hover:scale-110" style="{{ $iconStyle }}"></i>
<x-dynamic-component :component="'ri-' . $server->user_set_icon" class="size-5" style="color: {{ $iconColor }}" />
@else
<x-ri-server-line class="size-5 text-base/60 transition-transform group-hover:scale-110" />
<x-ri-server-line class="size-5 text-secondary" />
@endif
</button>
<span class="text-2xl font-bold">
@@ -964,16 +964,16 @@
}">
<!-- Modal Backdrop -->
<div x-cloak x-show="open"
x-transition:enter=\"transition ease-out duration-300\"
x-transition:enter-start=\"opacity-0\"
x-transition:enter-end=\"opacity-100\"
x-transition:leave=\"transition ease-in duration-200\"
x-transition:leave-start=\"opacity-100\"
x-transition:leave-end=\"opacity-0\"
@click=\"$wire.closeIconModal()\"
@keydown.escape.window=\"$wire.closeIconModal()\"
class=\"fixed inset-0 z-50 bg-black/50 backdrop-blur-sm\"
style=\"display: none;\">
x-transition:enter="transition ease-out duration-300"
x-transition:enter-start="opacity-0"
x-transition:enter-end="opacity-100"
x-transition:leave="transition ease-in duration-200"
x-transition:leave-start="opacity-100"
x-transition:leave-end="opacity-0"
@click="$wire.closeIconModal()"
@keydown.escape.window="$wire.closeIconModal()"
class="fixed inset-0 z-50 bg-black/50 backdrop-blur-sm"
style="display: none;">
</div>
<!-- Modal Content -->
<div x-cloak x-show="open"