Refactor Proxmox views for improved styling and consistency
- Updated subdomain.blade.php to enhance button styles and modal transitions. - Changed text colors for better readability and consistency across the UI. - Refactored system.blade.php to unify button components and improve layout structure. - Adjusted modal z-index values for consistent layering. - Enhanced accessibility by ensuring proper text contrast and hover states.
This commit is contained in:
@@ -1,12 +1,10 @@
|
||||
<x-proxmox::layout :server="$server" view="system" :status="$status" :status-polling="true" :status-polling-interval="'2s'">
|
||||
<div class="space-y-6" x-data="{ pageLoaded: false }" x-init="setTimeout(() => pageLoaded = true, 50)">
|
||||
<div class="flex flex-col gap-2"
|
||||
:class="pageLoaded ? 'opacity-100 translate-y-0' : 'opacity-0 -translate-y-2'"
|
||||
style="transition: all 0.4s ease-out;">
|
||||
<div class="space-y-6">
|
||||
<div class="flex flex-col gap-2">
|
||||
<div class="flex items-center gap-2 min-w-0">
|
||||
<h2 class="text-xl font-semibold break-words">System Configuration</h2>
|
||||
<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">
|
||||
<button type="button" @click="open = true" class="text-base/50 hover:text-base/70 transition-colors">
|
||||
<x-ri-question-line class="size-4" />
|
||||
</button>
|
||||
<!-- Modal Backdrop -->
|
||||
@@ -19,7 +17,7 @@
|
||||
x-transition:leave-end="opacity-0"
|
||||
@click="open = false"
|
||||
@keydown.escape.window="open = false"
|
||||
class="fixed inset-0 z-[60] bg-black/50 backdrop-blur-sm"
|
||||
class="fixed inset-0 z-50 bg-black/50 backdrop-blur-sm"
|
||||
style="display: none;">
|
||||
</div>
|
||||
<!-- Modal -->
|
||||
@@ -32,9 +30,9 @@
|
||||
x-transition:leave-end="opacity-0 scale-95"
|
||||
@click.away="open = false"
|
||||
@keydown.escape.window="open = false"
|
||||
class="fixed inset-0 z-[60] flex items-center justify-center p-4"
|
||||
class="fixed inset-0 z-50 flex items-center justify-center p-4"
|
||||
style="display: none;">
|
||||
<div class="relative w-full max-w-2xl max-h-[90vh] overflow-y-auto bg-background-secondary rounded-xl border border-gray-200 dark:border-gray-800 shadow-2xl p-6">
|
||||
<div class="relative w-full max-w-2xl max-h-[90vh] overflow-y-auto bg-background-secondary rounded-xl border border-neutral/20 shadow-2xl p-6">
|
||||
<button @click="open = false" class="absolute top-4 right-4 text-base/50 hover:text-base transition-colors">
|
||||
<x-ri-close-line class="size-5" />
|
||||
</button>
|
||||
@@ -49,7 +47,7 @@
|
||||
<p class="block font-sans text-sm font-normal leading-relaxed text-base/90 mb-4">
|
||||
Configure low-level system settings including firmware type, CPU model, machine type, and virtualization features. These settings affect how the virtual machine hardware is presented to the guest operating system.
|
||||
</p>
|
||||
<div class="pt-4 mt-4 border-t border-gray-200 dark:border-gray-800 space-y-2.5">
|
||||
<div class="pt-4 mt-4 border-t border-neutral/30 space-y-2.5">
|
||||
<p class="block font-sans text-xs font-normal leading-relaxed text-base/75">
|
||||
<span class="font-semibold text-base/90">Firmware & Machine:</span> Select the chipset architecture (Q35 or i440fx) and firmware type (SeaBIOS or OVMF/UEFI).
|
||||
</p>
|
||||
@@ -64,19 +62,17 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400">Manage firmware, CPU, SMBIOS, and trusted module devices exposed to this VPS.</p>
|
||||
<p class="text-sm text-base/60">Manage firmware, CPU, SMBIOS, and trusted module devices exposed to this VPS.</p>
|
||||
</div>
|
||||
|
||||
<div class="grid gap-6 xl:grid-cols-2">
|
||||
<div class="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 rounded-2xl shadow-theme-sm p-5 space-y-4 transition-all duration-300 hover:shadow-md"
|
||||
:class="pageLoaded ? 'opacity-100 translate-y-0' : 'opacity-0 translate-y-4'"
|
||||
style="transition: all 0.4s ease-out 0.1s;">
|
||||
<div class="bg-background-secondary border border-neutral rounded-lg p-5 space-y-4">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<div class="flex items-center gap-2 min-w-0">
|
||||
<h3 class="text-lg font-semibold break-words">Firmware & Machine</h3>
|
||||
<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">
|
||||
<button type="button" @click="open = true" class="text-base/50 hover:text-base/70 transition-colors">
|
||||
<x-ri-question-line class="size-4" />
|
||||
</button>
|
||||
<!-- Modal Backdrop -->
|
||||
@@ -89,7 +85,7 @@
|
||||
x-transition:leave-end="opacity-0"
|
||||
@click="open = false"
|
||||
@keydown.escape.window="open = false"
|
||||
class="fixed inset-0 z-[60] bg-black/50 backdrop-blur-sm"
|
||||
class="fixed inset-0 z-50 bg-black/50 backdrop-blur-sm"
|
||||
style="display: none;">
|
||||
</div>
|
||||
<!-- Modal -->
|
||||
@@ -102,9 +98,9 @@
|
||||
x-transition:leave-end="opacity-0 scale-95"
|
||||
@click.away="open = false"
|
||||
@keydown.escape.window="open = false"
|
||||
class="fixed inset-0 z-[60] flex items-center justify-center p-4"
|
||||
class="fixed inset-0 z-50 flex items-center justify-center p-4"
|
||||
style="display: none;">
|
||||
<div class="relative w-full max-w-2xl max-h-[90vh] overflow-y-auto bg-background-secondary rounded-xl border border-gray-200 dark:border-gray-800 shadow-2xl p-6">
|
||||
<div class="relative w-full max-w-2xl max-h-[90vh] overflow-y-auto bg-background-secondary rounded-xl border border-neutral/20 shadow-2xl p-6">
|
||||
<button @click="open = false" class="absolute top-4 right-4 text-base/50 hover:text-base transition-colors">
|
||||
<x-ri-close-line class="size-5" />
|
||||
</button>
|
||||
@@ -119,7 +115,7 @@
|
||||
<p class="block font-sans text-sm font-normal leading-relaxed text-base/90 mb-4">
|
||||
Configure the virtual machine's chipset architecture and firmware type. These settings determine the hardware interface presented to the guest operating system.
|
||||
</p>
|
||||
<div class="pt-4 mt-4 border-t border-gray-200 dark:border-gray-800 space-y-2.5">
|
||||
<div class="pt-4 mt-4 border-t border-neutral/30 space-y-2.5">
|
||||
<p class="block font-sans text-xs font-normal leading-relaxed text-base/75">
|
||||
<span class="font-semibold text-base/90">Machine Type:</span> Q35 offers PCIe and UEFI-friendly layout, while i440fx mirrors legacy Intel chipsets for maximum compatibility.
|
||||
</p>
|
||||
@@ -134,7 +130,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Select the chipset, firmware, and power-management features available to the guest.</p>
|
||||
<p class="text-sm text-base/60 mt-1">Select the chipset, firmware, and power-management features available to the guest.</p>
|
||||
</div>
|
||||
@if($this->firmwareMachineSynced)
|
||||
<span class="text-xs font-semibold text-success">Synced</span>
|
||||
@@ -183,14 +179,14 @@
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-3">
|
||||
<label class="inline-flex items-start gap-2 text-sm font-medium text-gray-600 dark:text-gray-400">
|
||||
<label class="inline-flex items-start gap-2 text-sm font-medium text-base/70">
|
||||
<input type="checkbox" wire:model.live="acpiEnabled" class="rounded border-neutral text-secondary focus:ring-secondary mt-0.5">
|
||||
<div class="flex flex-col gap-0.5">
|
||||
<span>Enable ACPI support</span>
|
||||
<p class="text-xs text-base/50 font-normal">ACPI (Advanced Configuration and Power Interface) enables power management, device configuration, and graceful shutdown. Required for most modern operating systems.</p>
|
||||
</div>
|
||||
</label>
|
||||
<label class="inline-flex items-start gap-2 text-sm font-medium text-gray-600 dark:text-gray-400">
|
||||
<label class="inline-flex items-start gap-2 text-sm font-medium text-base/70">
|
||||
<input type="checkbox" wire:model.live="kvmEnabled" class="rounded border-neutral text-secondary focus:ring-secondary mt-0.5">
|
||||
<div class="flex flex-col gap-0.5">
|
||||
<span>Enable KVM virtualization</span>
|
||||
@@ -201,13 +197,13 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 rounded-2xl shadow-theme-sm p-5 space-y-4">
|
||||
<div class="bg-background-secondary border border-neutral rounded-lg p-5 space-y-4">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<div class="flex items-center gap-2 min-w-0">
|
||||
<h3 class="text-lg font-semibold break-words">CPU & Virtualization</h3>
|
||||
<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">
|
||||
<button type="button" @click="open = true" class="text-base/50 hover:text-base/70 transition-colors">
|
||||
<x-ri-question-line class="size-4" />
|
||||
</button>
|
||||
<!-- Modal Backdrop -->
|
||||
@@ -220,7 +216,7 @@
|
||||
x-transition:leave-end="opacity-0"
|
||||
@click="open = false"
|
||||
@keydown.escape.window="open = false"
|
||||
class="fixed inset-0 z-[60] bg-black/50 backdrop-blur-sm"
|
||||
class="fixed inset-0 z-50 bg-black/50 backdrop-blur-sm"
|
||||
style="display: none;">
|
||||
</div>
|
||||
<!-- Modal -->
|
||||
@@ -233,9 +229,9 @@
|
||||
x-transition:leave-end="opacity-0 scale-95"
|
||||
@click.away="open = false"
|
||||
@keydown.escape.window="open = false"
|
||||
class="fixed inset-0 z-[60] flex items-center justify-center p-4"
|
||||
class="fixed inset-0 z-50 flex items-center justify-center p-4"
|
||||
style="display: none;">
|
||||
<div class="relative w-full max-w-2xl max-h-[90vh] overflow-y-auto bg-background-secondary rounded-xl border border-gray-200 dark:border-gray-800 shadow-2xl p-6">
|
||||
<div class="relative w-full max-w-2xl max-h-[90vh] overflow-y-auto bg-background-secondary rounded-xl border border-neutral/20 shadow-2xl p-6">
|
||||
<button @click="open = false" class="absolute top-4 right-4 text-base/50 hover:text-base transition-colors">
|
||||
<x-ri-close-line class="size-5" />
|
||||
</button>
|
||||
@@ -250,7 +246,7 @@
|
||||
<p class="block font-sans text-sm font-normal leading-relaxed text-base/90 mb-4">
|
||||
Configure the virtual CPU model and hardware-assisted virtualization features. These settings affect CPU performance and compatibility with the guest operating system.
|
||||
</p>
|
||||
<div class="pt-4 mt-4 border-t border-gray-200 dark:border-gray-800 space-y-2.5">
|
||||
<div class="pt-4 mt-4 border-t border-neutral/30 space-y-2.5">
|
||||
<p class="block font-sans text-xs font-normal leading-relaxed text-base/75">
|
||||
<span class="font-semibold text-base/90">CPU Type:</span> Select a specific CPU model or use "host" to expose all host CPU features. "host" offers best performance but may reduce portability.
|
||||
</p>
|
||||
@@ -265,7 +261,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Tune the virtual CPU model and host feature flags exposed to the guest OS.</p>
|
||||
<p class="text-sm text-base/60 mt-1">Tune the virtual CPU model and host feature flags exposed to the guest OS.</p>
|
||||
</div>
|
||||
@if($this->cpuVirtualizationSynced)
|
||||
<span class="text-xs font-semibold text-success">Synced</span>
|
||||
@@ -290,7 +286,7 @@
|
||||
<label class="text-sm font-semibold text-base/80">CPU Flags</label>
|
||||
<div class="grid gap-2 sm:grid-cols-2">
|
||||
@foreach($flagOptions as $flag => $label)
|
||||
<label class="flex items-center gap-2 rounded-md border border-neutral/60 px-3 py-2 text-sm text-gray-600 dark:text-gray-400">
|
||||
<label class="flex items-center gap-2 rounded-md border border-neutral/60 px-3 py-2 text-sm text-base/70">
|
||||
<input type="checkbox" value="{{ $flag }}" wire:model.live="selectedCpuFlags"
|
||||
class="rounded border-neutral text-secondary focus:ring-secondary">
|
||||
<span>{{ $label }}</span>
|
||||
@@ -301,7 +297,7 @@
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<p class="text-xs font-semibold text-gray-500 dark:text-gray-400 mb-2">Warning: These flags may not be supported by all CPUs.</p>
|
||||
<p class="text-xs font-semibold text-base/60 mb-2">Warning: These flags may not be supported by all CPUs.</p>
|
||||
<div class="flex flex-wrap gap-1.5">
|
||||
|
||||
|
||||
@@ -315,13 +311,13 @@
|
||||
</div>
|
||||
|
||||
<div class="grid gap-6 xl:grid-cols-2">
|
||||
<div class="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 rounded-2xl shadow-theme-sm p-5 space-y-4">
|
||||
<div class="bg-background-secondary border border-neutral rounded-lg p-5 space-y-4">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<div class="flex items-center gap-2 min-w-0">
|
||||
<h3 class="text-lg font-semibold break-words">EFI Disks</h3>
|
||||
<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">
|
||||
<button type="button" @click="open = true" class="text-base/50 hover:text-base/70 transition-colors">
|
||||
<x-ri-question-line class="size-4" />
|
||||
</button>
|
||||
<!-- Modal Backdrop -->
|
||||
@@ -334,7 +330,7 @@
|
||||
x-transition:leave-end="opacity-0"
|
||||
@click="open = false"
|
||||
@keydown.escape.window="open = false"
|
||||
class="fixed inset-0 z-[60] bg-black/50 backdrop-blur-sm"
|
||||
class="fixed inset-0 z-50 bg-black/50 backdrop-blur-sm"
|
||||
style="display: none;">
|
||||
</div>
|
||||
<!-- Modal -->
|
||||
@@ -347,9 +343,9 @@
|
||||
x-transition:leave-end="opacity-0 scale-95"
|
||||
@click.away="open = false"
|
||||
@keydown.escape.window="open = false"
|
||||
class="fixed inset-0 z-[60] flex items-center justify-center p-4"
|
||||
class="fixed inset-0 z-50 flex items-center justify-center p-4"
|
||||
style="display: none;">
|
||||
<div class="relative w-full max-w-2xl max-h-[90vh] overflow-y-auto bg-background-secondary rounded-xl border border-gray-200 dark:border-gray-800 shadow-2xl p-6">
|
||||
<div class="relative w-full max-w-2xl max-h-[90vh] overflow-y-auto bg-background-secondary rounded-xl border border-neutral/20 shadow-2xl p-6">
|
||||
<button @click="open = false" class="absolute top-4 right-4 text-base/50 hover:text-base transition-colors">
|
||||
<x-ri-close-line class="size-5" />
|
||||
</button>
|
||||
@@ -364,7 +360,7 @@
|
||||
<p class="block font-sans text-sm font-normal leading-relaxed text-base/90 mb-4">
|
||||
EFI (Extensible Firmware Interface) disks provide non-volatile storage for UEFI firmware variables. These are required for UEFI-based virtual machines to store boot configuration and Secure Boot keys.
|
||||
</p>
|
||||
<div class="pt-4 mt-4 border-t border-gray-200 dark:border-gray-800 space-y-2.5">
|
||||
<div class="pt-4 mt-4 border-t border-neutral/30 space-y-2.5">
|
||||
<p class="block font-sans text-xs font-normal leading-relaxed text-base/75">
|
||||
<span class="font-semibold text-base/90">Purpose:</span> UEFI guests require an EFI storage chip to store firmware variables, boot entries, and Secure Boot configuration.
|
||||
</p>
|
||||
@@ -379,7 +375,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400 mt-1">UEFI guests require an EFI storage chip. Each entry maps to an efidisk slot.</p>
|
||||
<p class="text-sm text-base/60 mt-1">UEFI guests require an EFI storage chip. Each entry maps to an efidisk slot.</p>
|
||||
</div>
|
||||
@if($this->efiDisksSynced)
|
||||
<span class="text-xs font-semibold text-success">Synced</span>
|
||||
@@ -398,7 +394,7 @@
|
||||
Remove
|
||||
</button>
|
||||
</div>
|
||||
<p class="text-xs text-gray-500 dark:text-gray-400 break-all">{{ $definition }}</p>
|
||||
<p class="text-xs text-base/60 break-all">{{ $definition }}</p>
|
||||
</div>
|
||||
@empty
|
||||
<div class="text-xs text-base/50 border border-dashed border-neutral rounded-md px-3 py-4 text-center">
|
||||
@@ -413,29 +409,29 @@
|
||||
<div class="grid gap-2">
|
||||
<p class="text-xs text-base/50">EFI disks are provisioned automatically on cephpool with a fixed 4M size in raw format.</p>
|
||||
<div class="flex flex-col gap-1">
|
||||
<label class="inline-flex items-center gap-2 text-xs font-semibold text-gray-500 dark:text-gray-400">
|
||||
<label class="inline-flex items-center gap-2 text-xs font-semibold text-base/60">
|
||||
<input type="checkbox" wire:model="newEfiPreenroll"
|
||||
class="rounded border-neutral text-secondary focus:ring-secondary">
|
||||
Preenroll keys
|
||||
</label>
|
||||
<p class="text-xs text-base/50">Pre-enroll Secure Boot keys during EFI disk creation. Enables Secure Boot by default. Useful for UEFI guests requiring Secure Boot support.</p>
|
||||
</div>
|
||||
<x-proxmox::ui.button wire:click="addEfiDisk" wire:loading.attr="disabled" class="w-full sm:w-auto" variant="secondary">
|
||||
<x-button.secondary wire:click="addEfiDisk" wire:loading.attr="disabled" class="w-full sm:w-auto">
|
||||
<x-loading target="addEfiDisk" />
|
||||
Add EFI Disk
|
||||
</x-proxmox::ui.button>
|
||||
</x-button.secondary>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 rounded-2xl shadow-theme-sm p-5 space-y-4">
|
||||
<div class="bg-background-secondary border border-neutral rounded-lg p-5 space-y-4">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<div class="flex items-center gap-2 min-w-0">
|
||||
<h3 class="text-lg font-semibold break-words">TPM Devices</h3>
|
||||
<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">
|
||||
<button type="button" @click="open = true" class="text-base/50 hover:text-base/70 transition-colors">
|
||||
<x-ri-question-line class="size-4" />
|
||||
</button>
|
||||
<!-- Modal Backdrop -->
|
||||
@@ -448,7 +444,7 @@
|
||||
x-transition:leave-end="opacity-0"
|
||||
@click="open = false"
|
||||
@keydown.escape.window="open = false"
|
||||
class="fixed inset-0 z-[60] bg-black/50 backdrop-blur-sm"
|
||||
class="fixed inset-0 z-50 bg-black/50 backdrop-blur-sm"
|
||||
style="display: none;">
|
||||
</div>
|
||||
<!-- Modal -->
|
||||
@@ -461,9 +457,9 @@
|
||||
x-transition:leave-end="opacity-0 scale-95"
|
||||
@click.away="open = false"
|
||||
@keydown.escape.window="open = false"
|
||||
class="fixed inset-0 z-[60] flex items-center justify-center p-4"
|
||||
class="fixed inset-0 z-50 flex items-center justify-center p-4"
|
||||
style="display: none;">
|
||||
<div class="relative w-full max-w-2xl max-h-[90vh] overflow-y-auto bg-background-secondary rounded-xl border border-gray-200 dark:border-gray-800 shadow-2xl p-6">
|
||||
<div class="relative w-full max-w-2xl max-h-[90vh] overflow-y-auto bg-background-secondary rounded-xl border border-neutral/20 shadow-2xl p-6">
|
||||
<button @click="open = false" class="absolute top-4 right-4 text-base/50 hover:text-base transition-colors">
|
||||
<x-ri-close-line class="size-5" />
|
||||
</button>
|
||||
@@ -478,7 +474,7 @@
|
||||
<p class="block font-sans text-sm font-normal leading-relaxed text-base/90 mb-4">
|
||||
TPM (Trusted Platform Module) devices provide hardware-based security features for virtual machines. They enable secure boot, BitLocker encryption, and other security features that require TPM functionality.
|
||||
</p>
|
||||
<div class="pt-4 mt-4 border-t border-gray-200 dark:border-gray-800 space-y-2.5">
|
||||
<div class="pt-4 mt-4 border-t border-neutral/30 space-y-2.5">
|
||||
<p class="block font-sans text-xs font-normal leading-relaxed text-base/75">
|
||||
<span class="font-semibold text-base/90">Purpose:</span> Virtual TPM devices expose TPM functionality to the guest OS, enabling features like Secure Boot, BitLocker disk encryption, and Windows Device Guard.
|
||||
</p>
|
||||
@@ -493,7 +489,7 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-sm text-gray-500 dark:text-gray-400 mt-1">Expose virtual TPM state chips for secure boot or BitLocker workloads.</p>
|
||||
<p class="text-sm text-base/60 mt-1">Expose virtual TPM state chips for secure boot or BitLocker workloads.</p>
|
||||
</div>
|
||||
@if($this->tpmDevicesSynced)
|
||||
<span class="text-xs font-semibold text-success">Synced</span>
|
||||
@@ -512,7 +508,7 @@
|
||||
Remove
|
||||
</button>
|
||||
</div>
|
||||
<p class="text-xs text-gray-500 dark:text-gray-400 break-all">{{ $definition }}</p>
|
||||
<p class="text-xs text-base/60 break-all">{{ $definition }}</p>
|
||||
</div>
|
||||
@empty
|
||||
<div class="text-xs text-base/50 border border-dashed border-neutral rounded-md px-3 py-4 text-center">
|
||||
@@ -527,17 +523,17 @@
|
||||
<div class="grid gap-2">
|
||||
<p class="text-xs text-base/50">TPM devices are provisioned on cephpool with a fixed 4M state file.</p>
|
||||
<div class="flex flex-col gap-1">
|
||||
<label class="text-xs font-semibold text-gray-500 dark:text-gray-400">Version</label>
|
||||
<label class="text-xs font-semibold text-base/60">Version</label>
|
||||
<select wire:model="newTpmVersion"
|
||||
class="bg-background border border-neutral rounded-md px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-secondary">
|
||||
<option value="v1.2">v1.2</option>
|
||||
<option value="v2.0">v2.0</option>
|
||||
</select>
|
||||
</div>
|
||||
<x-proxmox::ui.button wire:click="addTpmDevice" wire:loading.attr="disabled" class="w-full sm:w-auto" variant="secondary">
|
||||
<x-button.secondary wire:click="addTpmDevice" wire:loading.attr="disabled" class="w-full sm:w-auto">
|
||||
<x-loading target="addTpmDevice" />
|
||||
Add TPM Device
|
||||
</x-proxmox::ui.button>
|
||||
</x-button.secondary>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
@@ -545,17 +541,17 @@
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-2 overflow-x-auto">
|
||||
<x-proxmox::ui.button wire:click="loadSystemConfiguration" wire:loading.attr="disabled" variant="secondary">
|
||||
<x-button.secondary wire:click="loadSystemConfiguration" wire:loading.attr="disabled">
|
||||
<x-loading target="loadSystemConfiguration" />
|
||||
Refresh
|
||||
</x-proxmox::ui.button>
|
||||
<x-proxmox::ui.button wire:click="resetSystemSettings" :disabled="!$this->hasChanges" variant="secondary">
|
||||
</x-button.secondary>
|
||||
<x-button.secondary wire:click="resetSystemSettings" :disabled="!$this->hasChanges">
|
||||
Reset
|
||||
</x-proxmox::ui.button>
|
||||
<x-proxmox::ui.button wire:click="saveSystemSettings" wire:loading.attr="disabled" :disabled="!$this->hasChanges" variant="primary">
|
||||
</x-button.secondary>
|
||||
<x-button.primary wire:click="saveSystemSettings" wire:loading.attr="disabled" :disabled="!$this->hasChanges">
|
||||
<x-loading target="saveSystemSettings" />
|
||||
Save Settings
|
||||
</x-proxmox::ui.button>
|
||||
</x-button.primary>
|
||||
</div>
|
||||
</div>
|
||||
</x-proxmox::layout>
|
||||
|
||||
Reference in New Issue
Block a user