tkmind/tkmind_go
1
0
Fork 0
Code Issues Pull Requests Actions 6 Packages Projects Releases Wiki Activity

feat: UI tweaks including dark mode fixes, FOUC flash fixes, suspenseful loading states, and 7 more (#2079)

Browse Source
This commit is contained in:
Best Codes
2025-04-09 16:54:12 -05:00
committed by GitHub
parent 1d74f538ef
commit 0daff53110
10 changed files with 101 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files
ui/desktop/src/components/settings/models/AddModelInline.tsx
+3 -3
View File
@@ -76,7 +76,7 @@ export function AddModelInline() {
<Select
options={providerOptions}
value={providerOptions.find((option) => option.value === selectedProvider) || null}
onChange={(option) => {
onChange={(option: { value: string | null }) => {
setSelectedProvider(option?.value || null);
setModelName(''); // Clear model name when provider changes
setFilteredModels([]);
@@ -110,10 +110,10 @@ export function AddModelInline() {
</div>
<Button
type="button"
className="bg-black text-white hover:bg-black/90"
className="bg-black text-white hover:bg-black/90 dark:bg-white dark:text-black dark:hover:bg-white/90"
onClick={handleSubmit}
>
<Plus className="mr-2 h-4 w-4" /> Add Model
<Plus className="h-4 w-4" /> Add Model
</Button>
</form>
</div>
ui/desktop/src/components/settings/models/Search.tsx
+6 -6
View File
@@ -74,7 +74,7 @@ export function SearchBar() {
return (
<div className="relative" ref={searchBarRef}>
<Search className="absolute left-3 top-2.5 h-4 w-4 text-muted-foreground" />
<Search className="absolute left-3 top-[0.8rem] h-4 w-4 text-textSubtle" />
<input
type="text"
placeholder="Search models..."
@@ -85,17 +85,17 @@ export function SearchBar() {
}}
onKeyDown={handleKeyDown}
onFocus={() => setShowResults(true)}
className="w-full pl-12 py-2 bg-background border border-muted-foreground/20 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
className="w-full pl-9 py-2 text-black dark:text-white bg-bgApp border border-borderSubtle rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500"
/>
{showResults && search && (
<div className="absolute z-10 w-full mt-2 bg-white dark:bg-gray-800 border border-muted-foreground/20 rounded-md shadow-lg">
<div className="absolute z-10 w-full mt-2 bg-white dark:bg-gray-800 border border-borderSubtle rounded-md shadow-lg">
{filteredModels.length > 0 ? (
filteredModels.map((model, index) => (
<div
key={model.id}
ref={(el) => (resultsRef.current[index] = el)}
className={`p-2 flex justify-between items-center hover:bg-muted/50 dark:hover:bg-gray-700 cursor-pointer ${
model.id === currentModel?.id ? 'bg-muted/50 dark:bg-gray-700' : ''
className={`p-2 flex justify-between items-center hover:bg-bgSubtle/50 dark:hover:bg-gray-700 cursor-pointer ${
model.id === currentModel?.id ? 'bg-bgSubtle/50 dark:bg-gray-700' : ''
}`}
>
<div>
@@ -112,7 +112,7 @@ export function SearchBar() {
</div>
))
) : (
<div className="p-2 text-muted-foreground dark:text-gray-400">No models found</div>
<div className="p-2 text-textSubtle dark:text-gray-400">No models found</div>
)}
</div>
)}