mirror of
https://github.com/tiennm99/coolify.git
synced 2026-10-14 14:17:18 +00:00
feat(search): preselect first result in resource picker
Add the local UI design system reference and update frontend references to it.
This commit is contained in:
1 parent
3d64eb214a
commit
8cf22d7739
6 files changed
+718
-7
No files matched your search
@@ -46,7 +46,7 @@
|
||||
--color-coolgray-500: #323232;
|
||||
|
||||
/* Graphite design language (ported from ref/frontend). Layered neutral
|
||||
surfaces + translucent hairlines. See UI_REDESIGN.md. */
|
||||
surfaces + translucent hairlines. See DESIGN.md. */
|
||||
--color-app: #0c0c0d;
|
||||
/* Canvas: neutral near-black (oklch), not pure black */
|
||||
--color-panel: oklch(10% 0 0);
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
// Icon glyphs from the reicon pack (OUTLINE group), converted to
|
||||
// currentColor so they inherit the surrounding text color. To add more:
|
||||
// copy the inner markup from the reicon Outline weight and swap
|
||||
// #000000 -> currentColor. See UI_REDESIGN.md.
|
||||
// #000000 -> currentColor. See DESIGN.md.
|
||||
$icons = [
|
||||
'cloud' => '<path d="M7.5 19.25h9.75a4.5 4.5 0 0 0 .62-8.96A6.25 6.25 0 0 0 5.8 8.65 5.25 5.25 0 0 0 7.5 19.25Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>',
|
||||
'code' => '<path d="m8.5 7-5 5 5 5M15.5 7l5 5-5 5M13.5 4l-3 16" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>',
|
||||
|
||||
@@ -127,6 +127,21 @@
|
||||
this.isPaletteTransitioning = false;
|
||||
});
|
||||
},
|
||||
preselectFirstResult() {
|
||||
this.$nextTick(() => {
|
||||
const results = Array.from(this.$el.querySelectorAll('.search-result-item'))
|
||||
.filter(item => item.offsetParent !== null);
|
||||
|
||||
if (results.length === 0) {
|
||||
this.selectedIndex = -1;
|
||||
return;
|
||||
}
|
||||
|
||||
this.selectedIndex = 0;
|
||||
results[0].focus();
|
||||
results[0].scrollIntoView({ block: 'nearest' });
|
||||
});
|
||||
},
|
||||
navigateResults(direction) {
|
||||
const results = Array.from(this.$el.querySelectorAll('.search-result-item'))
|
||||
.filter(item => item.offsetParent !== null);
|
||||
@@ -366,7 +381,7 @@
|
||||
wire:loading.class="pointer-events-none opacity-40 blur-[2px]"
|
||||
wire:target="selectServer,selectDestination,selectProject,selectEnvironment">
|
||||
@if ($selectedServerId === null)
|
||||
<div x-init="selectedIndex = -1">
|
||||
<div x-init="preselectFirstResult()">
|
||||
<div class="command-palette-step-header">
|
||||
<button type="button" @click="runPaletteTransition(() => $wire.goBack())" class="command-palette-step-back"
|
||||
title="Back">
|
||||
@@ -413,7 +428,7 @@
|
||||
@endif
|
||||
|
||||
@if ($selectedServerId !== null && $selectedDestinationUuid === null)
|
||||
<div x-init="selectedIndex = -1">
|
||||
<div x-init="preselectFirstResult()">
|
||||
<div class="command-palette-step-header">
|
||||
<button type="button" @click="runPaletteTransition(() => $wire.goBack())" class="command-palette-step-back"
|
||||
title="Back">
|
||||
@@ -461,7 +476,7 @@
|
||||
@endif
|
||||
|
||||
@if ($selectedDestinationUuid !== null && $selectedProjectUuid === null)
|
||||
<div x-init="selectedIndex = -1">
|
||||
<div x-init="preselectFirstResult()">
|
||||
<div class="command-palette-step-header">
|
||||
<button type="button" @click="runPaletteTransition(() => $wire.goBack())" class="command-palette-step-back"
|
||||
title="Back">
|
||||
@@ -509,7 +524,7 @@
|
||||
@endif
|
||||
|
||||
@if ($selectedProjectUuid !== null && $selectedEnvironmentUuid === null)
|
||||
<div x-init="selectedIndex = -1">
|
||||
<div x-init="preselectFirstResult()">
|
||||
<div class="command-palette-step-header">
|
||||
<button type="button" @click="runPaletteTransition(() => $wire.goBack())" class="command-palette-step-back"
|
||||
title="Back">
|
||||
|
||||
Reference in new issue
Block a user