Refactor button components to use Proxmox UI library
- Updated button components across various views to utilize the new Proxmox UI button structure. - Replaced instances of <x-button.primary> and <x-button.secondary> with <x-proxmox::ui.button> for consistency and improved styling. - Adjusted button attributes and loading states to align with the new component design. - Ensured that all button functionalities remain intact while enhancing the overall UI consistency.
This commit is contained in:
@@ -213,12 +213,12 @@
|
||||
</div>
|
||||
|
||||
<div class="flex justify-center">
|
||||
<x-button.primary wire:click="createCdDrive" wire:loading.attr="disabled"
|
||||
<x-proxmox::ui.button wire:click="createCdDrive" wire:loading.attr="disabled"
|
||||
class="w-full sm:w-auto"
|
||||
:disabled="count($cdDrives) >= 2">
|
||||
:disabled="count($cdDrives) >= 2" variant="primary">
|
||||
<x-loading target="createCdDrive" />
|
||||
Create CD/DVD-ROM Drive
|
||||
</x-button.primary>
|
||||
</x-proxmox::ui.button>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
@@ -320,22 +320,22 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex gap-2 w-full sm:w-auto min-w-0">
|
||||
<x-button.primary wire:click="applyIso('{{ $drive }}')"
|
||||
<x-proxmox::ui.button wire:click="applyIso('{{ $drive }}')"
|
||||
wire:loading.attr="disabled"
|
||||
class="flex-1 sm:flex-initial"
|
||||
:disabled="($currentIsos[$drive] ?? 'none') === ($selectedIsos[$drive] ?? 'none')">
|
||||
:disabled="($currentIsos[$drive] ?? 'none') === ($selectedIsos[$drive] ?? 'none')" variant="primary">
|
||||
<x-loading target="applyIso('{{ $drive }}')" />
|
||||
<span wire:loading.remove wire:target="applyIso('{{ $drive }}')">Apply</span>
|
||||
<span wire:loading wire:target="applyIso('{{ $drive }}')">Applying...</span>
|
||||
</x-button.primary>
|
||||
<x-button.danger wire:click="ejectIso('{{ $drive }}')"
|
||||
</x-proxmox::ui.button>
|
||||
<x-proxmox::ui.button wire:click="ejectIso('{{ $drive }}')"
|
||||
wire:loading.attr="disabled"
|
||||
class="flex-1 sm:flex-initial"
|
||||
:disabled="!isset($currentIsos[$drive]) || $currentIsos[$drive] === 'none'">
|
||||
:disabled="!isset($currentIsos[$drive]) || $currentIsos[$drive] === 'none'" variant="danger">
|
||||
<x-loading target="ejectIso('{{ $drive }}')" />
|
||||
<span wire:loading.remove wire:target="ejectIso('{{ $drive }}')">Eject</span>
|
||||
<span wire:loading wire:target="ejectIso('{{ $drive }}')">Ejecting...</span>
|
||||
</x-button.danger>
|
||||
</x-proxmox::ui.button>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-xs text-base/50">
|
||||
@@ -424,11 +424,11 @@
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-3">
|
||||
<x-button.primary
|
||||
<x-proxmox::ui.button
|
||||
onclick="window.open('https://billing.virtnet.bond/tickets/create', '_blank')"
|
||||
class="w-full sm:w-auto">
|
||||
class="w-full sm:w-auto" variant="primary">
|
||||
Request ISO
|
||||
</x-button.primary>
|
||||
</x-proxmox::ui.button>
|
||||
|
||||
<div class="bg-info/10 border border-info/30 rounded-lg p-2 sm:p-3">
|
||||
<div class="flex items-start gap-2">
|
||||
@@ -664,17 +664,17 @@
|
||||
|
||||
<div class="flex flex-col sm:flex-row items-stretch sm:items-center gap-2">
|
||||
<div class="flex-1 w-full sm:w-auto">
|
||||
<x-button.secondary wire:click="refreshBootConfiguration" wire:loading.attr="disabled"
|
||||
class="w-full">
|
||||
<x-proxmox::ui.button wire:click="refreshBootConfiguration" wire:loading.attr="disabled"
|
||||
class="w-full" variant="secondary">
|
||||
<x-loading target="refreshBootConfiguration" />
|
||||
Refresh
|
||||
</x-button.secondary>
|
||||
</x-proxmox::ui.button>
|
||||
</div>
|
||||
<div class="flex items-center gap-2 flex-1 w-full sm:w-auto">
|
||||
<x-button.secondary wire:click="resetOrder" :disabled="!$this->hasChanges"
|
||||
class="flex-1">
|
||||
<x-proxmox::ui.button wire:click="resetOrder" :disabled="!$this->hasChanges"
|
||||
class="flex-1" variant="secondary">
|
||||
Reset to current
|
||||
</x-button.secondary>
|
||||
</x-proxmox::ui.button>
|
||||
<div class="relative" x-data="{ open: false }" x-cloak>
|
||||
<button type="button" @click="open = true" class="text-base/50 hover:text-gray-600 dark:text-gray-400 transition-colors" :disabled="!$this->hasChanges">
|
||||
<x-ri-question-line class="size-4" />
|
||||
@@ -729,11 +729,11 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-2 flex-1 w-full sm:w-auto">
|
||||
<x-button.primary wire:click="saveOrder" wire:loading.attr="disabled" :disabled="!$this->hasChanges"
|
||||
class="flex-1">
|
||||
<x-proxmox::ui.button wire:click="saveOrder" wire:loading.attr="disabled" :disabled="!$this->hasChanges"
|
||||
class="flex-1" variant="primary">
|
||||
<x-loading target="saveOrder" />
|
||||
Save boot order
|
||||
</x-button.primary>
|
||||
</x-proxmox::ui.button>
|
||||
<div class="relative" x-data="{ open: false }" x-cloak>
|
||||
<button type="button" @click="open = true" class="text-base/50 hover:text-gray-600 dark:text-gray-400 transition-colors" :disabled="!$this->hasChanges">
|
||||
<x-ri-question-line class="size-4" />
|
||||
|
||||
Reference in New Issue
Block a user