diff options
| author |   HsiangNianian <i@jyunko.cn> | 2026-01-15 17:36:36 +0800 |
|---|---|---|
| committer | HsiangNianian <i@jyunko.cn> | 2026-01-15 17:36:41 +0800 |
| commit | 31077dbd39a25eecd24a1dca0f8c9d1879265277 (patch) | |
| tree | 4cae8d216c3093421addaa0450bc8004c537e373 /ui/src/lib/GameConsole.svelte | |
| parent | 76559c624f7d2418c2f25e4cb2d3c994f4218964 (diff) | |
| download | DropOut-31077dbd39a25eecd24a1dca0f8c9d1879265277.tar.gz DropOut-31077dbd39a25eecd24a1dca0f8c9d1879265277.zip | |
feat: Implement custom dropdown components for version selection in BottomBar and ModLoaderSelector, enhancing user interaction and UI consistency
Diffstat (limited to 'ui/src/lib/GameConsole.svelte')
| -rw-r--r-- | ui/src/lib/GameConsole.svelte | 19 |
1 files changed, 10 insertions, 9 deletions
diff --git a/ui/src/lib/GameConsole.svelte b/ui/src/lib/GameConsole.svelte index 1b1ab53..bc5edbc 100644 --- a/ui/src/lib/GameConsole.svelte +++ b/ui/src/lib/GameConsole.svelte @@ -6,6 +6,8 @@ import { invoke } from "@tauri-apps/api/core"; import { open } from "@tauri-apps/plugin-shell"; import { onMount, tick } from "svelte"; + import CustomSelect from "../components/CustomSelect.svelte"; + import { ChevronDown, Check } from 'lucide-svelte'; let consoleElement: HTMLDivElement; let autoScroll = $state(true); @@ -21,7 +23,10 @@ let selectedSource = $state("all"); // Get sorted sources for dropdown - let sortedSources = $derived([...logsState.sources].sort()); + let sourceOptions = $derived([ + { value: "all", label: "All Sources" }, + ...[...logsState.sources].sort().map(s => ({ value: s, label: s })) + ]); // Derived filtered logs let filteredLogs = $derived(logsState.logs.filter((log) => { @@ -151,15 +156,11 @@ <h3 class="font-bold text-zinc-100 uppercase tracking-wider px-2">Console</h3> <!-- Source Dropdown --> - <select + <CustomSelect + options={sourceOptions} bind:value={selectedSource} - class="bg-zinc-900 border border-zinc-700 rounded-md px-3 py-1.5 pr-8 text-zinc-300 text-xs focus:border-indigo-500 focus:outline-none focus:ring-1 focus:ring-indigo-500/30 cursor-pointer hover:border-zinc-600 transition-colors" - > - <option value="all">All Sources</option> - {#each sortedSources as source} - <option value={source}>{source}</option> - {/each} - </select> + class="w-36" + /> <!-- Level Filters --> <div class="flex items-center bg-[#1e1e1e] rounded border border-[#3e3e42] overflow-hidden"> |