BetterSEQTA/BetterSEQTA-Plus
1
0
Fork 0
mirror of https://github.com/BetterSEQTA/BetterSEQTA-Plus.git synced 2026-06-06 03:34:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: further interface tweaks

Browse Source
This commit is contained in:
SethBurkart123
2025-04-01 18:19:45 +11:00
parent d0edad8134
commit 6a556b6940
2 changed files with 22 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/plugins/built-in/globalSearch/Calculator.svelte
+12 -10
View File
@@ -48,20 +48,20 @@
if (evaluated !== undefined) { if (evaluated !== undefined) {
if (math.typeOf(evaluated) === 'Unit') { if (math.typeOf(evaluated) === 'Unit') {
// Handle unit conversion results // Handle unit conversion results
result = math.format(evaluated, { precision: 14 }); result = math.format(evaluated, { precision: 14, lowerExp: -15, upperExp: 15 });
inputUnit = detectUnit(input); inputUnit = detectUnit(input);
outputUnit = detectUnit(result); outputUnit = detectUnit(result);
} else if (typeof evaluated === 'number') { } else if (typeof evaluated === 'number') {
// Handle regular numbers // Handle regular numbers
if (math.round(evaluated) === evaluated) { if (math.round(evaluated) === evaluated) {
result = math.format(evaluated, { precision: 14 }); result = math.format(evaluated, { precision: 14, lowerExp: -15, upperExp: 15 });
} else { } else {
result = math.format(evaluated, { precision: 14 }); result = math.format(evaluated, { precision: 14, lowerExp: -15, upperExp: 15 });
} }
inputUnit = ''; inputUnit = '';
outputUnit = ''; outputUnit = '';
} else { } else {
result = math.format(evaluated, { precision: 14 }); result = math.format(evaluated, { precision: 14, lowerExp: -15, upperExp: 15 });
inputUnit = ''; inputUnit = '';
outputUnit = ''; outputUnit = '';
} }
@@ -94,10 +94,11 @@
{#if result !== null} {#if result !== null}
<div class="p-2"> <div class="p-2">
<p class="text-[0.85rem] p-1 pb-0.5 font-semibold text-zinc-500 dark:text-zinc-400">Calculator</p> <p class="text-[0.85rem] p-1 pb-0.5 pt-0 font-semibold text-zinc-500 dark:text-zinc-400">Calculator</p>
<div class="flex items-center justify-between gap-8 rounded-lg border border-transparent {isSelected ? 'bg-zinc-900/5 dark:bg-white/10 border-zinc-900/5 dark:border-zinc-100/5' : ''}"> <div class="flex items-center justify-between gap-8 rounded-lg border border-transparent {isSelected ? 'bg-zinc-900/5 dark:bg-white/10 border-zinc-900/5 dark:border-zinc-100/5' : ''}">
<div class="flex flex-col flex-1 items-center py-4 pl-4"> <div class="flex flex-col flex-1 items-center py-4 pl-4 min-w-0">
<div class="py-2 text-4xl font-semibold text-zinc-900 dark:text-white"> <div class="overflow-hidden py-2 w-full font-semibold text-center whitespace-nowrap text-zinc-900 dark:text-white text-ellipsis"
style="--char-count: {result?.length || 10}; font-size: min(2.5rem, max(1rem, calc(25vw / var(--char-count, 10))))">
{searchTerm} {searchTerm}
</div> </div>
<div class="px-3 py-1 mt-1 text-sm rounded-md text-zinc-900 dark:text-zinc-300 bg-zinc-100 dark:bg-zinc-100/10"> <div class="px-3 py-1 mt-1 text-sm rounded-md text-zinc-900 dark:text-zinc-300 bg-zinc-100 dark:bg-zinc-100/10">
@@ -105,7 +106,7 @@
</div> </div>
</div> </div>
<div class="flex flex-col justify-center items-center w-12"> <div class="flex flex-col flex-shrink-0 justify-center items-center w-12">
<div class="h-8 w-[1px] bg-zinc-900/5 dark:bg-zinc-100/5"></div> <div class="h-8 w-[1px] bg-zinc-900/5 dark:bg-zinc-100/5"></div>
<div class="text-2xl text-zinc-900 dark:text-zinc-100"> <div class="text-2xl text-zinc-900 dark:text-zinc-100">
→ →
@@ -114,8 +115,9 @@
</div> </div>
{#if !isCalculating} {#if !isCalculating}
<div class="flex flex-col flex-1 items-center py-4 pr-4"> <div class="flex flex-col flex-1 items-center py-4 pr-4 min-w-0">
<div class="py-2 text-4xl font-semibold text-zinc-900 dark:text-white"> <div class="overflow-hidden py-2 w-full font-semibold text-center whitespace-nowrap text-zinc-900 dark:text-white text-ellipsis"
style="--char-count: {result?.length || 10}; font-size: min(2.5rem, max(1rem, calc(30vw / var(--char-count, 10))))">
{result} {result}
</div> </div>
<div class="px-3 py-1 mt-1 text-sm rounded-md text-zinc-900 dark:text-zinc-300 bg-zinc-100 dark:bg-zinc-100/10"> <div class="px-3 py-1 mt-1 text-sm rounded-md text-zinc-900 dark:text-zinc-300 bg-zinc-100 dark:bg-zinc-100/10">
src/plugins/built-in/globalSearch/SearchBar.svelte
+10 -11
View File
@@ -3,8 +3,8 @@
import { settingsState } from '@/seqta/utils/listeners/SettingsState' import { settingsState } from '@/seqta/utils/listeners/SettingsState'
import { fade, scale } from 'svelte/transition'; import { fade, scale } from 'svelte/transition';
import { circOut, quintOut } from 'svelte/easing'; import { circOut, quintOut } from 'svelte/easing';
import { getStaticCommands, type StaticCommandItem } from './commands'; import { type StaticCommandItem } from './commands';
import { getAllDynamicItems, type DynamicContentItem } from './dynamicSearch'; import { type DynamicContentItem } from './dynamicSearch';
import type { CombinedResult } from './types'; import type { CombinedResult } from './types';
import { createSearchIndexes, performSearch as doSearch } from './searchUtils'; import { createSearchIndexes, performSearch as doSearch } from './searchUtils';
import { highlightMatch, highlightSnippet } from './highlightUtils'; import { highlightMatch, highlightSnippet } from './highlightUtils';
@@ -33,7 +33,6 @@
console.debug(`[Global Search] Indexed ${commands.length} command items and ${dynamicItems.length} dynamic items.`); console.debug(`[Global Search] Indexed ${commands.length} command items and ${dynamicItems.length} dynamic items.`);
} }
let commandPalleteOpen = $state(false); let commandPalleteOpen = $state(false);
let searchTerm = $state(''); let searchTerm = $state('');
let selectedIndex = $state(0); let selectedIndex = $state(0);
@@ -171,7 +170,7 @@
role="button" role="button"
tabindex="0"> tabindex="0">
<div <div
class="w-full max-w-2xl rounded-xl ring-1 shadow-2xl ring-black/5 dark:ring-white/10 { transparencyEffects ? 'bg-white/80 dark:bg-zinc-900/80 backdrop-blur' : 'bg-white dark:bg-zinc-900' }" class="w-full max-w-2xl overflow-clip rounded-xl ring-1 shadow-2xl ring-black/5 dark:ring-white/10 { transparencyEffects ? 'bg-white/80 dark:bg-zinc-900/80 backdrop-blur' : 'bg-white dark:bg-zinc-900' }"
transition:scale={{ duration: 100, start: 0.95, opacity: 0, easing: circOut }} transition:scale={{ duration: 100, start: 0.95, opacity: 0, easing: circOut }}
onclick={(e) => { onclick={(e) => {
e.stopPropagation(); e.stopPropagation();
@@ -203,7 +202,7 @@
/> />
{#if combinedResults.length > 0} {#if combinedResults.length > 0}
<ul class="overflow-y-auto max-h-[32rem] text-base scroll-py-2 p-1 gap-0.5 flex flex-col"> <ul class="overflow-y-auto max-h-[24rem] text-base scroll-py-2 p-1 gap-0.5 flex flex-col">
{#each combinedResults as result, i (result.id)} {#each combinedResults as result, i (result.id)}
{@const isSelected = selectedIndex === (calculatorResult ? i + 1 : i)} {@const isSelected = selectedIndex === (calculatorResult ? i + 1 : i)}
{@const item = result.item} {@const item = result.item}
@@ -221,9 +220,9 @@
{@html highlightMatch(staticItem.text, searchTerm, result.matches)} {@html highlightMatch(staticItem.text, searchTerm, result.matches)}
</span> </span>
{#if staticItem.keybindLabel} {#if staticItem.keybindLabel}
<span class="flex-none ml-auto text-sm font-semibold text-zinc-500 dark:text-zinc-400"> <div class="flex-none ml-auto">
<kbd class="px-2 py-1 rounded bg-zinc-100 dark:bg-zinc-800">{staticItem.keybindLabel}</kbd> {@render Shortcut({ text: '', keybind: staticItem.keybindLabel })}
</span> </div>
{/if} {/if}
</button> </button>
{:else if result.type === 'dynamic'} {:else if result.type === 'dynamic'}
@@ -266,7 +265,7 @@
{/if} {/if}
</div> </div>
{/if} {/if}
<div class="p-3 w-full border-t border-zinc-900/5 dark:border-zinc-100/5"> <div class="px-3 py-2 w-full border-t border-zinc-900/5 dark:border-zinc-100/5 bg-white/5">
{#if combinedResults.length > 0 || calculatorResult} {#if combinedResults.length > 0 || calculatorResult}
<div class="flex justify-between items-center text-sm text-zinc-500 dark:text-zinc-400"> <div class="flex justify-between items-center text-sm text-zinc-500 dark:text-zinc-400">
<div class="flex gap-4 items-center"> <div class="flex gap-4 items-center">
@@ -274,7 +273,7 @@
{#if selectedIndex >= 0 && selectedIndex < combinedResults.length} {#if selectedIndex >= 0 && selectedIndex < combinedResults.length}
{@const item = combinedResults[selectedIndex].item} {@const item = combinedResults[selectedIndex].item}
{#if 'keybind' in item && item.keybind} {#if 'keybind' in item && item.keybind}
{@render Shortcut({ text: 'Shortcut', keybind: item.keybindLabel })} {@render Shortcut({ text: 'Shortcut', keybind: [ ...(item?.keybindLabel ?? []) ] })}
{/if} {/if}
{/if} {/if}
{/if} {/if}
@@ -299,7 +298,7 @@
<div class="flex gap-2 items-center"> <div class="flex gap-2 items-center">
<div class="flex gap-1 items-center"> <div class="flex gap-1 items-center">
{#each keybind as key} {#each keybind as key}
<kbd class="px-1 py-0.5 text-center align-middle rounded min-w-6 bg-zinc-100 dark:bg-zinc-800">{key}</kbd> <kbd class="px-1 py-0.5 text-[0.8rem] text-center align-middle rounded min-w-6 bg-zinc-100 dark:bg-zinc-100/10">{key}</kbd>
{/each} {/each}
</div> </div>
<span>{text}</span> <span>{text}</span>