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

feat: update Proxmox boot order view with improved button styling and layout adjustments for better usability and visual consistency

Browse Source
This commit is contained in:
Joseph.Rawlings
2025-12-04 12:22:21 -05:00
parent 9a50f08021
commit 2ab2ed8e1b
2 changed files with 26 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
extensions/Servers/Proxmox/views/boot-order.blade.php
View File

@@ -212,20 +212,22 @@
</span>
</div>
<x-button.secondary wire:click="createCdDrive" wire:loading.attr="disabled"
class="w-full lg:w-48"
:disabled="count($cdDrives) >= 2">
<x-loading target="createCdDrive" />
Create CD/DVD-ROM Drive
</x-button.secondary>
<div class="flex justify-center">
<x-button.primary wire:click="createCdDrive" wire:loading.attr="disabled"
class="w-full sm:w-auto"
:disabled="count($cdDrives) >= 2">
<x-loading target="createCdDrive" />
Create CD/DVD-ROM Drive
</x-button.primary>
</div>
</div>
@endif
@foreach($cdDrives as $index => $drive)
<div class="bg-background-secondary border border-neutral rounded-lg p-4 space-y-4" wire:key="cd-drive-{{ $drive }}">
<div class="bg-background-secondary border border-neutral rounded-lg p-3 lg:p-4 space-y-3 lg:space-y-4" wire:key="cd-drive-{{ $drive }}">
<div class="flex flex-wrap items-center justify-between gap-2 min-w-0">
<div class="flex-1">
<div class="flex items-center gap-2 min-w-0 flex-1">
<div class="flex-1 min-w-0">
<div class="flex items-center gap-2 min-w-0">
<h3 class="text-base sm:text-lg font-semibold break-words">Mount ISO Image - {{ strtoupper($drive) }}</h3>
<div class="relative" x-data="{ open: false }" x-cloak>
<button type="button" @click="open = true" class="text-base/50 hover:text-base/70 transition-colors">
@@ -301,11 +303,11 @@
</div>
</div>
<div class="flex flex-col gap-2 sm:flex-row sm:items-center min-w-0">
<div class="flex-1 min-w-0 relative w-full sm:w-auto">
<div class="flex flex-col lg:flex-row gap-3 min-w-0">
<div class="flex-1 min-w-0 relative">
<select id="iso-selection-{{ $drive }}"
wire:model.live="selectedIsos.{{ $drive }}"
class="w-full bg-background border border-neutral rounded-md px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-secondary">
class="w-full bg-background border border-neutral rounded-md px-3 py-2 pr-8 text-sm focus:outline-none focus:ring-2 focus:ring-secondary">
@foreach($isoOptions as $option)
<option value="{{ $option['value'] }}">{{ $option['label'] }}</option>
@endforeach
@@ -368,10 +370,10 @@
</div>
</div>
</div>
<div class="flex w-full sm:w-auto gap-2 min-w-0">
<div class="flex gap-2 w-full lg:w-auto">
<x-button.primary wire:click="applyIso('{{ $drive }}')"
wire:loading.attr="disabled"
class="flex-1 sm:flex-none"
class="flex-1 lg:flex-none lg:min-w-[120px]"
:disabled="($currentIsos[$drive] ?? 'none') === ($selectedIsos[$drive] ?? 'none')">
<x-loading target="applyIso('{{ $drive }}')" />
<span wire:loading.remove wire:target="applyIso('{{ $drive }}')">Apply</span>
@@ -379,7 +381,7 @@
</x-button.primary>
<x-button.danger wire:click="ejectIso('{{ $drive }}')"
wire:loading.attr="disabled"
class="flex-1 sm:flex-none"
class="flex-1 lg:flex-none lg:min-w-[120px]"
:disabled="!isset($currentIsos[$drive]) || $currentIsos[$drive] === 'none'">
<x-loading target="ejectIso('{{ $drive }}')" />
<span wire:loading.remove wire:target="ejectIso('{{ $drive }}')">Eject</span>

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

@@ -152,7 +152,15 @@
$tabs = [
['label' => 'Overview', 'view' => 'overview', 'route' => route('proxmox.server.overview', ['server' => $server->id])],
['label' => 'Statistics', 'view' => 'statistics', 'route' => route('proxmox.server.statistics', ['server' => $server->id]), 'advanced' => true],
['label' => 'Boot Settings', 'view' => 'boot-order', 'route' => route('proxmox.server.boot-order', ['server' => $server->id]), 'advanced' => true],
[
'label' => 'Hardware',
'dropdown' => true,
'items' => [
['label' => 'Boot Settings', 'view' => 'boot-order', 'route' => route('proxmox.server.boot-order', ['server' => $server->id]), 'advanced' => true],
['label' => 'Display', 'view' => 'display', 'route' => route('proxmox.server.display', ['server' => $server->id]), 'advanced' => true],
['label' => 'System', 'view' => 'system', 'route' => route('proxmox.server.system', ['server' => $server->id]), 'advanced' => true],
]
],
[
'label' => 'Networking',
'dropdown' => true,
@@ -163,8 +171,6 @@
]
],
['label' => 'Cloud-init', 'view' => 'cloud-init', 'route' => route('proxmox.server.cloud-init', ['server' => $server->id]), 'advanced' => true],
['label' => 'Display', 'view' => 'display', 'route' => route('proxmox.server.display', ['server' => $server->id]), 'advanced' => true],
['label' => 'System', 'view' => 'system', 'route' => route('proxmox.server.system', ['server' => $server->id]), 'advanced' => true],
];
if($server->service->product->settings()->where('key', 'backups')->first()?->value > 0) {
$tabs[] = ['label' => 'Backups', 'view' => 'backups', 'route' => route('proxmox.server.backups', ['server' => $server->id])];